HubSpot Hacks: manage all cookies with HubSpot & Google Tag Manager

Often little or nothing changes when a visitor does not accept cookies on a website. Cookies are still active, and third-party scripts are being loaded.

We 'll show you how to change that combining the HubSpot cookie settings with Google Tag Manager.

By default, HubSpot's cookie banner only manages ... the HubSpot cookies

Activating HubSpot's default cookie bar only helps your users accept/refuse HubSpot's cookies. Out of the box, HubSpot's cookie bar does not control other cookies you offer through your site (think of Google, Facebook, ...).

And that's not what you want, right?

How to expand HubSpot's cookie banner to external cookies?

• We use the HubSpot cookie functionality, which sets a small opt-out cookie for the visitor. HubSpot guarantees that they will not track or trace anything for their piece

• We then use the same cookie to control all other functionalities via Google Tag Manager (GTM), thus preventing external scripts (Google Analytics, Hotjar, LinkedIn, AdWords, etc.) from being loaded and cookies from being set

A technical deep dive:

The first cookie, which is primarily used to keep track of the visitor's choice, is therefore an _opt_out_cookie with the value "yes". We will now read this cookie in Google Tag Manager.

How to create a new trigger for Google Tag Manager

To prevent external scripts from being loaded, we create a new trigger in Google Tag Manager based on the opt-out cookie. How to do this:

#1 Create a new variable (in GTM)

We create a variable in Google Tag Manager that will contain the value of the cookie.

• In the menu of Google Tag Manager you choose "NEW" under Variables in the overview at the bottom of User-Defined Variables
• In the pop-up that appears, first choose the type of variable. Here you choose "1st Party Cookie"

• Then give the variable a name and enter the name of the cookie you are going to read out

If you have a simple value like 1, 0, true, false ... in your cookie, you don't have to do anything with the other options in this screen.

Your variable is now ready and appears in the overview:

#2. Create a new trigger

The variable we just created will now be used in a new trigger. A trigger listens on your page (or app) to certain types of events: forms that are sent, clicking on buttons, loading a page, ... A trigger also ensures that a tag is loaded or blocked when certain conditions are met or just not.

• Under Triggers, choose > New
• In the pop-up choose the type 'Page view' and then choose "Some page views"

We set up our trigger as follows:

• In the leftmost field we have selected our newly created variable
• In the middle field we have chosen "does not equal"
• In the right field we entered "yes"

#3. Choose the right tags

Now that we have created our trigger, we can use it for the tags.

• Click at Tags on the tags you want to load with this new trigger.
  At the bottom of 'Triggering' click on the pencil to select another trigger
• In the new pop-up you will get an overview of all triggers you can choose from

Save your modification for this tag and do the same for all other tags you want to load this way.

With the preview function of Google Tag Manager you can now first check your changes without them being immediately applicable to all visitors to your site. 

Question. Is your HubSpot cookie banner fully ok?

If you also want to be fully compliant with your cookie policy, use the hack above to setup your GTM correctly. Or talk to one of our experts!