Install Fundraise Up on a HubSpot website

Add the installation code

Choose where you want Fundraise Up to load, then follow the corresponding steps below.

Add the code to all pages

Use the account-level settings to load Fundraise Up on all HubSpot pages:

1. In the Fundraise Up Dashboard, go to Settings > Installation, then copy the installation code.
2. In HubSpot, click the Settings icon in the top navigation bar.
3. In the settings sidebar, go to Content > Pages.
4. From Choose a domain to edit its settings, choose Default settings for all domains.
5. On the Templates tab, paste the installation code into Site header HTML.
6. In the popup at the bottom of the page, click Save.

After you confirm the change, the installation code is active on all HubSpot pages that use the default settings.

Add the code to a specific page

Use the page settings when you want Fundraise Up to load only on one HubSpot page:

1. Copy the Fundraise Up installation code from the Dashboard.
2. In HubSpot, go to Content > Website Pages.
3. Open the page in the content editor.
4. In the top menu, click Settings.
5. In the Settings window, select Advanced.
6. Under Additional code snippets, paste the installation code into Head HTML.

HubSpot saves the changes automatically. Publish a new page or update an existing page to make the installation code active.

Add Elements

After you add the installation code, create a custom module that you can reuse with different Fundraise Up Elements.

Create a reusable module

To create the module in Design Manager, follow these steps:

1. In the left sidebar in HubSpot, go to More > Content > Design Manager. If Design Manager is pinned to your sidebar, open it directly.
2. In Design Manager, go to File > New file.
3. In the New file window, choose Module from the dropdown and click Next.
4. Select the locations where you want the module to appear.
5. For Module content scope, select Local module.
6. In the File name field, enter Fundraise Up Element and click Create.
7. In the right sidebar, click Add field and choose Text.
8. Name the field Fundraise Up Element ID.
9. Check that the HubL variable name is fundraise_up_element_id.
10. Insert the code below into the module.html (HTML + HubL) editor.
11. Enable Make available in templates and pages.
12. In the top-right corner, click Publish changes.

1<a href="#{{ module.fundraise_up_element_id }}" style="display: none"></a>

Add an Element to a page

Use the reusable module to place an Element on your HubSpot page:

1. Open your HubSpot page in the content editor.
2. Click Add, then drag the Fundraise Up Element module onto the page.
3. In Fundraise Up, open the Element that you want to add and copy its ID from the HTML code, such as XABCDEFG.
4. In the HubSpot module settings, paste the ID into the Fundraise Up Element ID field.
5. Publish a new page or update an existing page to make the Element active.

For example, if the Element code is:

1<a href="#XZFJMUUS" style="display: none"></a>

Enter XZFJMUUS in the Fundraise Up Element ID field.