Embed the Optimized Loader Script for Optimized Donation Forms

After testing and enabling an Optimized Donation Form to accept donations, you may be ready to make it available to donors. For the best donor experience, a donation form should launch from your organization's website. The Optimized Loader Script allows Optimized Donation Forms to load on top of a webpage anywhere on your website, and it's unique to your Online Giving environment.

You must embed the loader script in either:

  • a webpage above the form's hyperlink or button.

  • a root location of your organization's website.

    Tip: If you embed the script in a root location of your website, you only need to do it one time because it takes affect for all webpages on the website.

Embed the loader script on your website

  1. From Online Giving, Donation forms, select an Optimized Donation Form.

  2. From Publish, select Hyperlinks.

  3. Select the Optimized Loader Script link.

  4. Select Copy.

  5. Embed the script on a webpage or a root location of your website.

    Note: If you use Blackbaud Website Package, you will contact Blackbaud Website Package Support and give them the copied loader script. They will embed the script in the <head> of your site's web pages.

After the Optimized Loader Script is on your website, you can launch the form from any webpage, email, button, or other HTML element. From your form, under Publish, you will find HTML tags specific to the form to copy.

Hyperlinks

There are two types of hyperlinks you can use to launch the form. You can launch it from:

Button

You can also launch the form from a button or other HTML element, such as an image. To make this process easier, the code you copy contains an HTML button and the custom data-blackbaud-optimized-form-id property. In the code, you can change the element to a different one to launch the form. Don't change the custom property because it is unique to the form.

  1. From Publish, select Button.

  2. Select Copy.

    Tip: This HTML tag displays a button to open the form, and you can change "Donate" in the HTML tag if you prefer different text on the button. You can also use a different HTML element, such as <img> to open the form from an image. Don't make changes to the custom property because it is unique to this form.

  3. Paste the code in the webpage where you want the button to appear.