HubSpot tracking code

You can send three types of data to HubSpot:

• Events track when supporters open checkout or complete donations. HubSpot logs these as events on contact records, which you can use to segment contacts or trigger marketing campaigns.
• Contact properties capture supporter information and donation details when someone completes a donation. This creates or updates contact records in HubSpot with the data you specify.
• Form submissions treat each completed donation as a HubSpot form submission. This triggers automation workflows in HubSpot, such as sending welcome emails or creating deals.

You need:

• Your HubSpot tracking code installed on your website. Learn how to install the HubSpot tracking code.
• For contact properties: custom properties created in HubSpot before you implement the code.
• For form submissions: a form created in HubSpot with the fields you want to populate.

The code examples below use the Fundraise Up JavaScript API to capture donation events and send them to HubSpot. See the JavaScript API documentation for all available events and data fields.

This code tracks when supporters open checkout and complete donations. HubSpot records these as events on contact records.

1<script>
2  // Track when checkout opens
3  FundraiseUp.on('checkoutOpen', function(details) {
4    _hsq.push(["trackEvent", {
5      id: "Fundraise Up Checkout Open"
6    }]);
7  });
8
9  // Track completed donations
10  FundraiseUp.on('donationComplete', function(details) {
11    var eventName = 'Fundraise Up One Time Donation';
12
13    if (details.donation.recurring) {
14      eventName = 'Fundraise Up Recurring Donation'
15    }
16
17    _hsq.push(['trackEvent', {
18      id: eventName,
19      value: details.donation.amount
20    }]);
21  });
22</script>
23

After you add this code, HubSpot tracks two events: when someone opens your checkout form and when they complete a donation. One-time and recurring donations appear as separate events.

This code creates or updates HubSpot contact records when supporters complete donations. You can map donation data to any custom properties in your HubSpot account.

1<script>
2FundraiseUp.on('donationComplete', function(details) {
3  var _hsq = window._hsq = window._hsq || [];
4  var user = details.supporter;
5  var customFields = details.customFields;
6
7  _hsq.push(['identify', {
8    email: user.email,
9    firstname: user.firstName,
10    lastname: user.lastName,
11
12    // Map donation data to HubSpot custom properties
13    platform: 'Fundraise Up',
14    last_donation_amount: details.donation.amount,
15    last_donation_currency: details.donation.currency,
16    last_donation_frequency: details.donation.recurring ? 'Monthly' : 'One Time',
17    last_donation_date_utc: new Date().setUTCHours(0,0,0,0),
18
19    // Map UTM parameters
20    utm_source: customFields.utm_source,
21    utm_medium: customFields.utm_medium,
22    utm_campaign: customFields.utm_campaign,
23    utm_term: customFields.utm_term,
24    utm_keyword: customFields.utm_keyword,
25    utm_content: customFields.utm_content,
26  }]);
27
28  _hsq.push(['trackPageView']);
29});
30</script>
31

The code example shows common properties like donation amount and UTM parameters. You can map any field from the JavaScript API payload to your HubSpot properties. See the JavaScript API documentation for all available fields.

This code treats each completed donation as a HubSpot form submission. Use this approach to trigger automation workflows when someone donates.

Before you add this code:

1. Create a form in HubSpot with all the fields you want to track.
2. Replace portalId and formId with your form's information.
3. Replace the subscription ID in the consent options with your subscription ID.
4. Add or remove fields in the data.fields array to match your form's structure.

1<script>
2FundraiseUp.on('donationComplete', function(details) {
3  // Replace with your form's portal ID and form ID
4  var portalId = '7376849';
5  var formId = 'fdf6ffce-1a9a-4b61-b5ff-8e3d395ab05b';
6  var url = 'https://api.hsforms.com/submissions/v3/integration/submit/' + portalId + '/' + formId;
7
8  var data = {
9    'submittedAt': Date.now(),
10    'fields': [
11      {
12        'name': 'campaign_id',
13        'value': details.campaign.id
14      },
15      {
16        'name': 'campaign_code',
17        'value': details.campaign.code ? details.campaign.code : ''
18      },
19      {
20        'name': 'campaign_name',
21        'value': details.campaign.name
22      },
23      {
24        'name': 'donation_id',
25        'value': details.donation.id
26      },
27      {
28        'name': 'donation_amount',
29        'value': details.donation.amount
30      },
31      {
32        'name': 'donation_currency',
33        'value': details.donation.currency
34      },
35      {
36        'name': 'donation_frequency',
37        'value': details.donation.recurring ? 'Monthly' : 'One Time'
38      },
39      {
40        'name': 'supporter_id',
41        'value': details.supporter.id
42      },
43      {
44        'name': 'supporter_first_name',
45        'value': details.supporter.firstName
46      },
47      {
48        'name': 'supporter_email',
49        'value': details.supporter.email
50      },
51      {
52        'name': 'supporter_utm_source',
53        'value': details.customFields.utm_source ? details.customFields.utm_source : ''
54      }
55    ],
56    'context': {
57      'hutk': ':hutk'
58    },
59    'legalConsentOptions': {
60      'consent': {
61        'consentToProcess': true,
62        'text': 'I agree to allow Example Company to store and process my personal data.',
63        'communications': [
64          {
65            'value': true,
66            'subscriptionTypeId': 999, // Replace with your subscription ID
67            'text': 'I agree to receive marketing communications from Example Company.'
68          }
69        ]
70      }
71    }
72  };
73
74  if (details.designation) {
75    var designationData = [
76      {
77        'name': 'designation_id',
78        'value': details.designation.id
79      },
80      {
81        'name': 'designation_name',
82        'value': details.designation.name
83      },
84      {
85        'name': 'designation_code',
86        'value': details.designation.code
87      },
88    ];
89    data.fields = data.fields.concat(designationData);
90  }
91
92  var xhr = new XMLHttpRequest();
93  xhr.open('POST', url);
94  xhr.setRequestHeader('Content-Type', 'application/json');
95  xhr.send(JSON.stringify(data));
96});
97</script>
98

You can combine this tracking with HubSpot's marketing automation for donor stewardship and personalized outreach. Here are some common scenarios:

• Build supporter segments based on checkout behavior

  When you track checkout opens, you can identify contacts who showed interest in donating but didn't complete a donation. You can then create a HubSpot segment of these contacts and follow up with messages that explain your mission or address common concerns about donating online.

• Trigger welcome series for new supporters

  When someone completes their first donation, you can automatically enroll them in a welcome workflow. This workflow sends additional emails beyond the standard thank you message, such as explanations of how their donation helps, impact stories, and ways to stay involved beyond giving.

• Re-engage lapsed supporters

  Tracking donation events over time helps you identify supporters who donated previously but haven't given recently. You can create automated workflows that reach out with personalized messages acknowledging their past support and inviting them to give again.

• Upgrade one-time donations to recurring support

  After someone makes a one-time donation, you can send them automated emails over the next few months that explain your recurring giving program and show the impact of sustained support. You can tailor the ask amount based on their initial gift.

• Score leads for major gift conversations

  Checkout opens and donation completions can feed into lead scoring in HubSpot. Contacts who repeatedly open checkout or make multiple donations receive higher scores, which helps your team identify supporters who might be ready for major gift conversations.

• Personalize event invitations based on giving history

  When you segment contacts by donation amount and frequency, you can send targeted event invitations. Major supporters might receive invites to exclusive gatherings, while other supporters get invitations to broader community events that match their level of engagement.

• Combine with CRM integration for complete tracking

  You can use this tracking code alongside the HubSpot CRM integration. The tracking code captures checkout opens and donation attempts, while the CRM integration handles completed donation data. This approach gives you visibility into the full supporter journey from interest to conversion.