Embed a Donation Form on WordPress
To embed a donation form on your WordPress site:
- Safelist your website
- Install the code snippet
- Add the donation form to a page
Safelist your website
To make sure your embedded form appears, safelist your website. If you need to add multiple domains (such as a test site or sandbox), follow these steps:
- Go to the Settings tab in the Studio designer
- Select Install
- Under Safelisted domains, add the URL of each website where you plan to embed the form
- Publish or Update your campaign to push through the changes
Install a code snippet
The Install snippet is a script that lets embedded campaigns appear on your site. You only need to add it once to your website’s <head>
section, where it will work for all embedded campaigns.
Important
Only add one Install snippet. Multiple snippets may slow down your website.
To copy the Install snippet:
- Go to the campaign’s Settings tab
- Select Install
- Next to Install snippet, select Copy
Using WPCode to add the snippet
We recommend using the WPCode plugin to easily add the Install snippet to your WordPress site’s header.
To install WPCode:
- Log in to WordPress
- In the menu, go to Plugins and Add New
- Search for WPCode – Insert Headers and Footers + Custom Code Snippets
- Select Install and activate
Note
If you don't have the Plugins option, your account doesn't have the necessary permissions to add plugins. Reach out to your team to get access.
To add the snippet using WPCode:
- After installing WPCode, go to Code Snippets and Header & Footer
- Under Header, paste the Install snippet
- Select Save changes
Once the Install snippet is saved, you can add multiple embedded forms to your website without changing the snippet.
Add the donation form to your website
With the Install snippet added, you’re ready to embed your donation form. You can place the form directly on the page or attach it to a button.
Options for embedding the donation form:
- Donate button: Add a button that opens the embedded form when selected.
- Inline donation grid: Embed the form directly on the page.
To embed the form on a page:
- Go to your WordPress site’s editor
- Add a Custom HTML block in the location where you want to place the form
- In your campaign’s Install page, copy either: the Donate button campaign parameter, or the Inline donation grid embed code
- Paste the code into the Custom HTML block, then Save and Publish the page
When viewing the page, supporters will have either a donate button or an inline donation grid. Selecting either option will open the embedded form in an overlay.
Tip
Share a direct link to your form by attaching the campaign parameter to your URL (e.g., https://yournonprofit.org/?campaign=12345
). This will open the form as soon as visitors land on the page.