Google Tag Manager and Cookiebot automatic cookie blocking

We are aware that the Google Tag Manager preview mode doesn’t work if you combine Cookiebot with automatic cookie blocking and Google Tag Manager. The reason for this is that you’ll be referring to events that aren’t known in Google Tag Manager, since they’ll be pushed to the datalayer outside of Google Tag Manager.

Combine the use of Google Tag Manager with Cookiebot “automated cookie blocking” to get the best of both worlds. Implementation is quick and easy and allows you to:

  • Control tags and cookies based on the user’s consent, using triggers in Google Tag Manager AND
  • Let Cookiebot automatically control all other cookies not set by Google Tag Manager, based on the consent given.

To achieve this, make sure that the Cookiebot script is not executed by Google Tag Manager. So either remove the Cookie Consent tag or it’s trigger. Furthermore:

  1. Make sure that Google Tag Manager is the very first script to load on your website.
  2. Mark your Google Tag Manager script tag with: data-cookieconsent=“ignore”
  3. This will ensure that Google Tag manager will always be allowed to load.
  4. Insert the Cookiebot script with automatic cookie blocking immediately after the Google Tag Manager script.

Here’s an example of how this could look:

<html>
<head>
<title>GTM & automatic cookie blocking </title>
<link rel="stylesheet" type="text/css" href="style.css">

!-- Google Tag Manager -->
<script data-cookieconsent="ignore">
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<!-- End Google Tag Manager -->

<script id="CookieConsent" src="https://consent.cookiebot.com/uc.js" 
 data-cbid="00000000-0000-0000-0000-000000000000" type="text/javascript" data-blockingmode="auto"></script>
.....
</head>

...
<body>

In Google Tag Manager, you can control your tags by implementing a trigger for each of the three categories functional, statistics, marketing. 
If you’re modifying a previous Cookiebot implementation:

Change the event name for each tag from cookieconsent_category to cookie_consent_category.

If you’re creating new triggers:

  • From the menu on the left, select Triggers
  • Create a new trigger by clicking New and choose Custom Event
  • Under Event name, for each of the categories, enter the corresponding value:

Preferences : cookie_consent_preferences
Statistics : cookie_consent_statistics
Marketing : cookie_consent_marketing
  • Make sure All custom events is checked under This trigger fires on 
  • Click Save to create the trigger. 

Assign these triggers to the tags you wish to control based on the user’s consent. For example, assign the cookie_consent_statistics trigger to your Google Analytics tag like this:

If you adjusted existing triggers, you don’t need to assign them again to the tags they were assigned to.

You may also implement the use of Google Tag Manager with manual blocking and implementation of prior consent for any remaining  elements outside your tag manager. Use the script for manual cookie blocking and follow our guide here for setting up Google Tag Manager implementation