HubSpot Tracking Code Consent Mode
This document presents a comprehensive approach for implementing HubSpot Tracking Code in compliance with user consent preferences. The HubSpot tracking code is unique to each HubSpot account and allows HubSpot to monitor your website traffic. If you have any externally hosted pages (i.e., pages not on HubSpot), you must install the HubSpot tracking code to capture analytics for those pages. To align with privacy regulations, Tracking code should only be activated after the user consents to cookies.
The document outlines two implementation methods:
Both methods guarantee that Tracking code is only triggered after the user provides consent through Enzuzo.
Method 1: Implementation Through Google Tag Manager
If you want to implement HubSpot tracking code via Google Tag Manager (GTM), you must configure it to fire only after the user has granted consent to cookies to ensure compliance with cookie consent regulations.
Step 1: Install the banner in GTM
Please first follow our GTM installation guide to install our banner. This ensures that GTM adheres to the user’s consent preferences before activating any tracking scripts.
Step 2: Create a Custom Trigger for HubSpot in GTM
To prevent the HubSpot Tracking tag from firing before receiving consent, follow these steps:
From the left panel of your GTM account, select Triggers > click New > Click Trigger Configuration and choose Custom Event as the trigger type.
Name the trigger, here we named it “Enzuzo Trigger”. In the "Event Name" field, type "enzuzo_consent_update" and “Save” the trigger.
Step 3: Create a Tag for HubSpot
From the left panel of your GTM account, select “Tags”. Then click on “New” > “Tag Configuration” > Select the “Custom HTML” tag type. Give a name to your tag.
Copy your HubSpot Tracking Code from your account and paste the tracking code in the HTML field.
For HubSpot Tracking Tag to trigger based on user consent, we need to add additional consent settings to the tag. Click on "Advanced Settings" > "Consent Settings" > "Require additional consent for tag to fire", and then specify a category. Your tag will then fire when the user consents to the corresponding category in the Enzuzo Cookie Banner.
GTM Consent Category | Enzuzo Consent Category |
ad_storage | Marketing |
ad_user_data | Marketing |
ad_personalization | Marketing |
analytics_storage | Analytics |
personalization_storage | Preferences |
functionality_storage | Strictly Necessary |
security_storage | Strictly Necessary |
Step 4: Add the Custom Event Trigger to the HubSpot Tracking Tag
Under Triggering, click “Choose a trigger to make this tag fire” and select the custom consent trigger you created in Step 2.
Your HubSpot tag should look like this:
Save, Submit and Publish the changes
Method 2: Implementation using the Custom Script
If you have implemented HubSpot Tracking by adding the Tracking code to your website, you can ensure it runs only after users explicitly consent to tracking by using a custom script, eliminating the need for Google Tag Manager (GTM). Please make sure you have already installed the Cookie Banner using the procedure documented here.
Step 1: Add the Custom Script Below the Enzuzo Script
Copy the custom script and paste it below the Enzuzo script in the <head> tag :
<!-- HubSpot Tracking -->
<script>
function onConsentChange({ analytics, functional, marketing, preferences }) {
if (analytics) {
let hubSpotScript = document.getElementById('hs-script-loader');
if (hubSpotScript) {
hubSpotScript.src = ""; // Add HubSpot Tracking Code source here
}
}
}
window.__enzuzoConfig = {
callbacks: {
acceptSelected: onConsentChange,
acceptAll: onConsentChange,
decline: onConsentChange,
init: onConsentChange
}
}
</script>
<!-- End HubSpot Tracking -->
In the above illustration, HubSpot Tracking Code is permitted when the user consents to the Analytics category. If you prefer to use the Marketing category, replace the ‘analytics’ with ‘marketing’ in if-condition inside the function onConsentChange().
Step 2: Add the HubSpot Tracking code
Copy your HubSpot Tracking Code from your account. It would look like this:
<!-- Start of HubSpot Embed Code -->
<script type="text/javascript" id="hs-script-loader" async defer src="//js-na3.hs-scripts.com/XXXXXXXXX.js"></script>
<!-- End of HubSpot Embed Code -->
From your tracking code, copy the value of “src” from your <script> tag and paste it inside the onConsentChange function. As a result, your onConsentChange function should look like:
function onConsentChange({ analytics, functional, marketing, preferences }) {
if (analytics) {
let hubSpotScript = document.getElementById('hs-script-loader');
if (hubSpotScript) {
hubSpotScript.src = "//js-na3.hs-scripts.com/XXXXXXXXX.js";
}
}
}
Copy and paste the remaining tracking code (without the src element) anywhere before the </body> tag. Your tracking code should look like:
<!-- Start of HubSpot Embed Code -->
<script type="text/javascript" id="hs-script-loader" async defer></script>
<!-- End of HubSpot Embed Code -->
Caution
After adding the tracking code to any pages that aren't hosted with HubSpot, you should add the external site domains to your reports settings to include them in your HubSpot analytics.
TroubleShooting
HubSpot Tracking is loaded before giving consent:
1. If Enzuzo Cookie Banner is setup through GTM, verify the tag configuration.
Check the "Tag Configuration" of the Enzuzo cookie banner tag in GTM. The script URL should be of the format https://app.enzuzo.com/scripts/cookiebar/<account ID>. It should not have quotes or <script> tags.
The tag should be configured to fire on consent initialization.
Also, under "Advanced Settings" > "Consent Settings", the tag should be set to "No additional consent required".
2. Verify your tag triggers
Ensure that your HubSpot Tracking tag is configured to fire on the enzuzo_consent_update data layer event. They should be using a custom trigger configured as in the picture:
Your "Consent Settings" should also be correctly set on the tag. The correct categories are based on what Enzuzo category your script falls into.
Enzuzo Category | GTM Categor(ies) |
Analytics | analytics_storage |
Marketing | ad_storage, ad_user_data, ad_personalization |
Preferences | personalization_storage |
Functional | functionality_storage, security_storage |
3. Ensure that your HubSpot tracking tag only has one trigger (Enzuzo Custom Event trigger)
Make sure that your HubSpot tracking tag has only one trigger which is the one you created, as mentioned above, based on the enzuzo_consent_update event.
4. Ensure that the changes are saved and published.
Once you have saved all the changes made, Click the Submit button at the top right corner of your GTM account.
Finally, click Publish to make this tag live on your website.