Google Tag Manager and Automatic cookie blocking – Cookiebot Support

Combine the use of Google Tag Manager with automated cookie blocking by Cookiebot 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 and Consent Mode in Google Tag Manager and
Let Cookiebot automatically control all other cookies not set by Google Tag Manager, based on the consent given, typically cookies set by third party scripts that are embedded directly in your website.

Implementation

To achieve this, make sure that the Cookiebot script is not executed by Google Tag Manager. So either remove the Cookiebot CMP tag, pause it, or remove the trigger assigned to it.

Furthermore, for optimal results:

If you choose to use Google Consent Mode, ensure this script loads before the Google Tag Manager script does.
Mark up the Google Consent Mode and Google Tag Manager script tags with: data-cookieconsent="ignore"
This will ensure that these scripts can't unintentionally get blocked by the auto blocking feature.
Ensure that the following scripts are the first on the page to load, in this exact order:
- Google Consent Mode
- Google Tag Manager
- Cookiebot CMP (with automatic cookie blocking)

Here's an example of how this could look:

<!DOCTYPE html>
<html>
  <head>
    <title>Google Tag Manager & automatic cookie blocking</title>
    
    <!-- Google Consent Mode -->
    <script data-cookieconsent="ignore">
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments)
      }
      gtag("consent", "default", {
        ad_personalization: "denied",
        ad_storage: "denied",
        ad_user_data: "denied",
        analytics_storage: "denied",
        functionality_storage: "denied",
        personalization_storage: "denied",
        security_storage: "granted",
        wait_for_update: 500
      });
      gtag("set", "ads_data_redaction", true);
      gtag("set", "url_passthrough", true);
    </script>
    <!-- End Google Consent Mode-->
    
    
    <!-- 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-XXXX');</script>
    <!-- End Google Tag Manager -->
    
    
    <!-- Cookiebot CMP-->
    <script
      id="Cookiebot"
      src="https://consent.cookiebot.com/uc.js"
      data-cbid="abcdef12-3456-7890-abcd-ef1234567890"
      data-blockingmode="auto"
      type="text/javascript"
      data-consentmode-defaults="disabled"
    ></script>
    <!-- End Cookiebot CMP -->
    
    ...
    
  </head>
  <body>
  
  ...
  
  </body>
</html>

With this implementation you can conditionally fire tags using Google Consent mode, or using custom events.

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