Usercentrics - PUBLIC

How to block the HubSpot tracking code (non-essential cookies)?

Overview

 

HubSpot Essential Cookies

HubSpot does drop essential cookies that do not require consent on customers site pages. You can see a full list of these essential cookies here.

HubSpot Non-Essential Cookies

HubSpot can also drop non-essential analytic cookies that are controlled by a (cookie) consent banner. You can see a full list of these non-essential analytic cookies here.

 

In order to block HubSpot analytic/tracking cookies, HubSpot provides us with the _hsq.push(['doNotTrack']); function which places the __hs_do_not_track cookie in the visitors browser, which will prevent the HubSpot tracking code from sending any information for the visitor. More details can be found here.

How does it work with the Usercentrics dataLayer?

Standard Package

  1. Add the Data Layer Name e.g. dataLayer in the Usercentrics Admin Interface:

  2. Use the code below:

The full code needs to be added in the body or the footer of the page or directly into the template's body.

<script> dataLayer = window.dataLayer || []; function removeHsCookies() { _hsp.push(['revokeCookieConsent']); console.log('Cookies consent removed'); _hsq.push(['doNotTrack']); console.log("do not Track enabled"); } function addHsCookies() { _hsq.push(['doNotTrack', { track: true }]); console.log('HubSpot has consent'); } var waitForDataLayerObjHubSpot = function (dataLayer, callback) { if (dataLayer.length > 0) { callback(); } else { setTimeout(function () { waitForDataLayerObjHubSpot(dataLayer, callback); }, 1000); } } waitForDataLayerObjHubSpot(dataLayer, function () { dataLayer.map(function (ele) { if (ele.event === 'consent_status') { if (ele['HubSpot'] === true) { addHsCookies(); } else { removeHsCookies(); } } return ele; }) }); </script>

Business & Enterprise Package

  1. Add the Window Event Name e.g. ucEvents in the Usercentrics Admin Interface:

     

Below is an example tested for landing pages hosted via HubSpot

First we add the removeHsCookies() function which does two things:

  1. revokeCookieConsent - Remove the hubSpot cookie consent as the page is a HubSpot hosted page and the tracking code is embedded on the page that’s why it gets automatically dropped. So we need to remove it.

  2. doNotTrack - When the cookie drops on the page with the do not track cookies data becomes anonymised and we don’t track the user

function removeHsCookies(){ _hsp.push(['revokeCookieConsent']); console.log('Cookies consent removed'); _hsq.push(['doNotTrack']); console.log("do not Track enabled"); }

Then we create a second function addHsCookies() where we set the doNotTrack = true for the cookie to be removed and HubSpot tracking code to collect data again.

function addHsCookies() { _hsq.push(['doNotTrack', { track: true }]); console.log('HubSpot has consent'); }

Now we need to call these two functions based on the user consent. To do that we will use EventListener

How to test it:

Test page: Contact - Open your HubSpot page → Dev tools → Application → Cookies

  • You will see hubspotutk and few more cookies to drop there and that is expected behaviour as it is a hosted page.

  • Click Deny All → The hubspotutk cookie will no longer be there and the __hs_do_not_track cookie will drop in the visitors browser, which will prevent the HubSpot tracking code from sending any information for the visitor.

  • Click Accept All or give consent to the HubSpot DPS and Save Services (It might need to reloading the page)

 


Do you need further help?

How can I get help with technical questions?

 

Usercentrics - PUBLIC