Adding the Donations Modal Popups Installation Code to your Website

To use Donations modal popups on your website, you must first add the installation code to your site. This code only needs to be added once per page where you want modal popups to work.

Where should the installation code go?

The installation code must be added to any page where a Donations modal popup may be triggered. It should be placed just before the closing </body> tag.

You have two options for where to install it:

Option 1: Add the code to your site template (recommended if you'll have modals on multiple pages on your website)

Add the installation code to your website’s global template or layout.
This ensures the code is included on all pages of your site.
With this setup, you can place Donations modal popup links on any page, without additional setup.

Option 2: Add the code to a specific page

Add the installation code only to the page(s) where you plan to use Donations modal popup.
This limits modal functionality to those specific pages.
You can create and use multiple modal popups on that page, but they will only work there.

The best option depends on your website setup and preferences. If you're unsure, consult your website administrator or developer.

Getting the installation code

You can find the installation code in the Donations Modal Popup section on the Integrations tab of any Donations page in Soapbox.

Click Copy to copy the code. It will look similar to this:

<script>
window.addEventListener('load', () => {
((w, d, dm) => {
b = d.querySelector('body'),
s = d.createElement('script');
s.src = 'https://' + dm + '/component/donations/widget/?popupjs';
s.type = 'module';
b.append(s);
})(window, document, 'example.secure.nonprofitsoapbox.com');
});
</script>