Allow supporters to donate or make a purchase directly from your own organization's website. To comply and maintain GiveSmart's level of security, specify and include the external site where the page or order form will be embedded.
Before you start
- From the Admin Navigation, select Pages > All Pages.
- Click +New Page to create the custom page with an order form or click the pencil icon to edit an existing page.
Embed an order form
To include your order form on an external website, add the website URL to the Include List. Once added, copy the embed code and provide it to that website's administrator.
Tip: Include only the domain host portion of your external URL, example: https://givesmart.com/ . Do not include any sub-paths in the list or the embedded form may not appear on your external website. Example of sub-path: https://givesmart.com/donate .
- Click Edit List.
- Paste your Website URL into the open field.
- Click Add Website URL to add additional URL addresses.
- Click Copy and provide the embed code to that website's administrator.
Troubleshooting
Embedded content isn't displaying:
The external website URL must be whitelisted as a security measure by adding it to the list before embedding the custom page and/or order form. If the custom page or order form is not showing within the iframe embedded on your webpage, confirm the correct web address is added to the list.
If you've confirmed the correct website URL is added to the list, and you still can't see it, reach out to the website administrator for help.
Can I adjust the height and width of the iframe?
Yes, you can edit the iframe HTML code to specify the width and height of the iframe
The embedded form isn’t loading on my organization's website:
If the GiveSmart embedded form isn’t loading on your organization's website and you see a security error when using your browser's inspect tool, it usually means the website hosting the embed hasn’t been approved yet. To fix this, make sure your website's domain has been added to your GiveSmart Custom Order Form's "Include List."
Sometimes this can be confusing because the website shown in your browser’s address bar isn’t always the same place the embedded content is coming from. The system checks the source of the embedded page, not just what you see at the top of the browser.
If needed, you can find this source by looking at the failed request in your browser’s developer tools and checking where the request originated. Once that source site is added to the authorized embed list, the form should load correctly.
Steps:
- On your organization's specific webpage where the embedded form isn't rendering, right-click anywhere on the page and click the "Inspect" option
- In the Inspect tool, click on the tab labeled "Network."
- Refresh the webpage
- Within the Inspect tool, under the 'Name' column, locate a result named "embed" and click on it
- Scroll through the details and under the 'Request Headers' heading, locate a field labeled "Referer", copy the URL listed (this should look like your organization's website)
- On a separate browser window, open your GiveSmart site > View Admin > Pages > All Pages > click the edit icon next to Order Form Page
- Under the EMBED FORM section, click 'Edit List.'
- Paste the URL copied from the inspect tool in the Website URL field > Save > Save
Example:
