Embedding the popup on your website
Where to find your form's embed instructions, what the snippet and trigger link do, and how to share them with a developer.
A donation popup isn't hosted on its own page; it opens on your website. Installing it takes two pieces: a JavaScript snippet on your site and a trigger link that opens the form. Both come from the embed instructions screen in the editor: click Publish in the top bar, then Embed Form.
Work from that screen rather than copying from this article. The trigger link only works with your organization name and form slug in the URL, and the instructions screen shows both the snippet and the link with your details already filled in.
The three steps
- Add the snippet. Paste the code snippet from the instructions screen before the closing
</body>tag on every page of your website. Adding it to every page means a donate button in your site's navigation can open the form from anywhere on your site. - Create the trigger link. Create a link on your site that points to your form's URL, shown on the instructions screen. It follows the pattern
https://app.giveforms.com/forms/organization-name/donation-form-slug?gf-type=popup, with your actual organization name and form slug. When a visitor clicks the link, the donation form opens as a popup, without leaving your website. We recommend linking this to a prominent donate button in your navigation. Your website must have HTTPS/TLS enabled for the donation form to function properly. - Confirm it works. Click your new donation link and check that the form opens as a popup. If it does, you're done. If it doesn't, click Contact Support on the instructions screen and we'll help identify the problem and work with you to fix it.
Sharing the instructions with a developer
If someone else manages your website, click Share Instructions in the top right of the instructions screen. Enter their email address and click Send Email, or click Copy Link and send it yourself. They get the same steps with your form's snippet and URL, so there's nothing to fill in on their end.
Once the popup opens on your site, run a test transaction before sharing it widely. See Preview and test transactions.