Triggering a dataLayer event when the user accepts cookies with Cookiebot

Cookiebot is one of the most popular cookie consent managers.
It does its job generally fine, but it severely lacks integration when used together with Google Tag Manager which I find a pretty significant oversight considering that GTM is by far the most popular tag management system.

While Cookiebot has a nice JavaScript API, it doesn’t offer a built-in event that really only fires when the user has actively clicked the “Allow all cookie” or “Allow selection” button.

The CookiebotOnAccept event and the CookiebotCallback_OnAccept callback function may sound like they do that, but they are also triggered when an already-consented user loads the page which didn’t fit my particular use case.

So here’s how to trigger a dataLayer event when the user accepts cookies with Cookiebot:

<script>
;(function(){
    window.addEventListener("CookiebotOnAccept", function (e) {
        if (window.Cookiebot.changed) {
            window.dataLayer = window.dataLayer || [];
            window.dataLayer.push({
                event: "cookiebot_accept"
            });
        }
    });
})();
</script>

This will fire a cookiebot_accept event in the dataLayer when the user

• newly consents to all cookies
• newly consents to the “current selection” with at least one available consent level active

It will not fire when the user

• already consented to some or all cookies and simply loads the page
• newly consents to the “current selection” with all consent levels inactive
• declines or has declined all cookies

Use this at your own risk, considering that the window.Cookiebot.changed property is undocumented and may change at any time.