Publish an Optimized Form

After testing and changing an Optimized Donation Form to accept donations, you are ready to share it with your donors.

Launch from hyperlinks and button

For the best donor experience, you should launch the form through hyperlinks and HTML elements, such as a button or image using the Optimized Loader Script.

Optimized Loader Script

Before you can display Optimized Donation Forms on your website, you must insert the Optimized Loader Script in the <head> or a root location of your website. It's a one time task because the script has your unique environment information. It enables you to use hyperlinks and HTML elements to launch your forms from your website.

Tip: To confirm that your website has the loader script, view the <head> in the website's source code. If it's already on your website, you will see a <script> tag similar to this,
<script src="https://sky.blackbaudcdn.net/static/og-web-loader/1/main.js data-envid="t-Z-FEhKwlvksGVGjTCcbBMEA"><script>
where data-envid is unique to your Online Giving environment.

  1. From Online Giving, All donation forms, select an Optimized Form.

  2. Under Publish, select Hyperlinks.

  3. Select the Optimized Loader Script link.

  4. Select Copy code.

  5. Insert the script in the <head> section of your website 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 insert 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 the form from,

Use this hyperlink on a webpage to display the form over the page where the link is located.

  1. Under Publish, select Hyperlinks.

  2. From Open form on top of same webpage, select Copy.

  3. Paste the code in the webpage where you want the form to launch from.

    Tip: You can change "Donate" in the HTML tag, if you prefer different text.

Use this hyperlink on other webpages and emails to open the form on top of your website.

  1. Under Publish, select Hyperlinks.

  2. From Open form from other webpages or emails, select Copy.

  3. Change https://yourwebsite.org to your organization's website.

  4. Paste the code in the webpage or email where you want the form to launch from.

    Tip: You can change "Donate" in the HTML tag, if you prefer different text.

    Note: If your hyperlink already has a question mark, replace the question mark ("?") before bbFormID with an ampersand ("&").

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. Under 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.

Launch from hosted URL

If you are unable to embed the Optimized Loader Script on your website or you need to download the form's QR code, you can link to the form from its Blackbaud hosted URL.

Under Publish, select Hosted URL.

  • To copy the form's URL, select Copy URL.

  • To download the QR code for printed materials, select Download QR code.

Set designations, campaigns, and appeals from hyperlink

When there are too many designations to add to the form or you would like to pass a campaign and appeal through a form, you can set these parameters in the form's hyperlink. For more information, see Get Started with Hyperlink Parameters.