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 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:
- Make sure that Google Tag Manager is the very first script to load on your website.
- Mark your Google Tag Manager script tag with: data-cookieconsent="ignore"
This will ensure that Google Tag manager will always be allowed load. - Insert the Cookiebot script with automatic cookie blocking immediately after Google Tag Manager script.
Here's an example of how this could look:
In Google Tag Manager, to control your tags, implement a trigger for each of the three categories.
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 here:
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
Comments
5 comments
When would you use this installation mode versus the other one outlined here: https://support.cookiebot.com/hc/en-us/articles/360003793854
We are having issues of Pardot tracking working with Cookiebot -- will changing the deployment help with that?
Great guide, thanks! With this implementation I found that the GTM Preview & Debug Mode stops working as it seems to block the GTM preview JS library from loading in the browser. What do you recommend?
Same issue :(
Plus when i agree with the cookies and go back to the page with the video, it doesnt show up anymore?
As pointed out above, this setup seems to break GTM's "Preview and Debug mode". The debug panel seems to open, but it remains an empty box.
In the browser's dev-tools, it seems the loading of the "https://tagmanager.google.com/debug/debuguiApp-bundle.js" script is cancelled, and I am guessing this is due to Cookiebot's automatic blocking behaviour?
Since that script is loaded by GTM behind the scenes, it is not possible to allow it with the `data-cookieconsent="ignore"` attribute. Is there any other way to add exceptions to Cookiebot's automatic blocking ? Or can automatic blocking with GTM be implemented in another way, that does not break the preview and debug mode?
Using this implementation as far as I can tell only fires your tags after the consent dialog is submitted (only on the first page the consent is provided on). In my tests, if you set your cookie preferences and then navigate to another page the cookie_consent_ events don't fire. Am I missing something?
I got around this by adding the following code after my cookiebot script on each page
<script>
function CookiebotCallback_OnAccept() {
if (Cookiebot.consent.preferences)
dataLayer.push({'event':'cookie_consent_preferences'});
if (Cookiebot.consent.statistics)
dataLayer.push({'event':'cookie_consent_statistics'});
if (Cookiebot.consent.marketing)
dataLayer.push({'event':'cookie_consent_marketing'});
}
</script>
Please sign in to leave a comment.