Google Consent Mode Explained

TL;DR

Consent Mode became a required solution when using GA4 or Google Ads with traffic from European Economic Area. It works out-of-the-box with Google Tags for mentioned services, but it can be adapted to other platforms like Facebook/Meta Pixel. It does not replace generic Consent Management Platforms, but when implemented correctly it can be the only, lightweight consent solution that does not require tricky blocking techniques.

If you are interested in getting this simple solution consider our Consent Mode Banner offering.

What is Consent Mode?

Consent Mode is an extension on top of datalayer which is a core part of all Google tracking scripts (both Google Tag Manager and Google Tags). It contains two dedicated actions and standard parameters called consent types that has special meaning for Google services and work like additional trigger that can be applied to any tag in Google Tag Manager.

Quick Example:

window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('consent', 'default', { ad_storage: 'denied' });

Actions:

• default - sets default values for consent types

• update - should be set as soon as user consent is provided

Consent types:

• analytics_storage - storage of user identifiers (cookies, localStorage, device identifiers) related to analytics purposes

• ad_storage - storage related to advertising purposes

• ad_user_data

• ad_personalization

• functionality_storage

• personalization_storage

• security_storage

Each consent type state can be set to either "granted" meaning user agreed for certain type of data storage and processing or "denied" which is the opposite.

As a result the most basic consent mode entry in dataLayer can look like this:

[ 
  'consent',
  'default',
  { ad_storage: 'granted', analytics_storage: 'denied' }
]

First parameter is always set to "consent", second indicated wheter is it the "default" state or user's provided ("update") and then javascript object with consent types and their state.

That's it!

What is Consent Mode v2?

In November 2023 Google released an upgrade to their Consent Mode framework called v2 that became mandatory when using their advertising platform.

While it sounds as a significant update (second major version one could say) it basically means adding two ads related consent types (which we already listed above):

• ad_user_data

• ad_personalization

Those new consent types can be seen as more specific and precise way to tell Google APIs how to process user data in regards to advertisting purposes.

Like in many other platforms you can opt-i for personalised ads if you agree for more precise tracking. If you don't agree you still would see ads but just possibly less relevant. Before Consent Mode v2 this fine grain control was not possible to express.

How does it work?

There are two things that Consent Mode does for you:

Change Google Tags behavior

This happens magically as soon as you implement Consent Mode on your website. It only impact Google Tags - Google Analytics 4 and Google Ads no matter if you implemented those directly or via Google Tag Manager. It won't work like this for any other tracking tag like Facebook Pixel

Introduce Consent Checks

Consent Mode introduced dedicated UI elements in GTM workspace.

First is hidden in advanced section in tag configuration screen. It allows you to decide if tag should only fire after certain consent type is granted - they will work like special type of triggers.

Second part of that new UI needs to be enabled in GTM workspace admin section and is called Consent Overview. It is a new view of all tags present in the workspace with consent checks information visible and a way to quickly apply new consent checks to one or more tags in bulk action.

How it does not work?

Google Consent Mode does not interact directly with any cookies nor it handles complex tags firing sequences. It means you can implement Consent Mode and get it somewhat working but still be either completely non-compliant with cookies related privacy regulations or have tags not firing in correct order and losing all data as a result.

Consent User Interface

Before going into more complex topics of cookies handling and tags sequencing it is important to say that Consent Mode as a datalayer extension does not expose any user interface.

In other words it does not include any Consent or Cookies banner that could actually capture user consent. It is on your end to create or install such banner and wire it together with consent mode.

If you need a lightweight (~3kB), basic banner for that we have open-sourced one:

https://github.com/tagconcierge/consent-banner-js/

Cookies creation and deletion

In contrast to most Consent Management Platforms on the market Consent Mode is just a low-level framework passing additional trigger-like data to datalayer, it does not know or do anything related to cookies. But if correct consent checks are applied to all relevant GTM tags and those won't fire before required consents are provided then cookies won't be created.

You can learn more how to configure Consent Mode to ensure all tags are blocked when necessary:

How to configure GTM Consent Mode?

One thing that cannot be accomplished in GTM though is cookies deletion if user decides to revoke their consent at some point. It means consent was initially granted, tags fired and cookies were created. If you want to delete those cookies you need dedicated solution that will handle it.

Tags firing sequence

In eCommerce context or Single Page Applications many events can be tracked within single Page View. Google Tags will handle that relatively well if only built-in consent checks are used, all events before consent is provided will be dropped and any consecutive event after consent is provided will be sent.

In case of non-Google tags like Meta Pixel or when blocking Google Tags entirely that can be a little bit more tricky to handle. Typical setup is to load base Meta Pixel JS SDK (snippet installing pixel) on Page Load event as this needs to happen before any actual event is tracked. If consent was not known at the page load time (user visits the page for the first time) it won't fire again during this page visit thus other tags will fail (they will try to use the pixel that was not loaded).

To handle this scenario we have created dedicated preset for users of our GTM plugins, see this documentation for details:

How to use Consent Mode Triggers preset?

How to install it?

There are two methods of installing Consent Mode:

Google Tag

This way is useful if:

• you are not using Google Tag Manager and you are embedding GA4 and Google Ads snippets directly

• or you can easily add custom code to your website content

It requires defining gtag function that is a wrapper on top of dataLayer and then you can call it for settings "default" and "updated" consent state:

window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

gtag('consent', 'default', { ad_storage: 'denied' });

// when user's consent is provided
gtag('consent', 'update', { ad_storage: 'granted' });

The most important part in this method is to call those functions as early in the page loading sequence or within HTML as possible. Default consent state should be set before loading any Google tag, otherwise you can face this error:

Google Tag Manager

Installing Consent Mode via Google Tag Manager sounds like a no-brainer if you are already using GTM. It is a little bit more complex that we would hope for since you can only interact with Consent Mode from within GTM using special Consent Mode API functions. Those functions are only available in tags templates, so you either need to create a custom template which is not very convenient if you want to repeat that across many GTM workspaces or use one of existing Consent Mode templates, but in most cases those available in their templates gallery will be related to some SaaS Consent Management Platforms.

If you decide to write your own template this is what you need to start with:

const setDefaultConsentState = require('setDefaultConsentState');
const updateConsentState = require('updateConsentState');

// as early as possible:
setDefaultConsentState({ ad_storage: 'denied' });

// as soon as user's consent is provided
updateConsentState({ ad_storage: 'granted' });

Obviously your final code will be much more complex than that because you need to pass the actual consent state around, get it from some consent banner, store in a cookie or localStorage etc. When doing that your code can actually became asynchronous so Google introduced special parameter called "wait_for_update" that will tell GTM container to wait specified number of milliseconds before actually running anything so that asynchronous "updateConsentState" call can happen.

If you want to see working example check our our basic Consent Mode template that you can use without any CMP account or subscription. It is also available in GTM templates gallery so you can install it directly from GTM UI:

https://github.com/tagconcierge/tagconcierge-gtm-cookies-template

Summary

We think that Consent Mode is pretty elegant yet robust way of handling information about users' privacy preferences. This information is very actionable when using correct GTM features, but it still requires some manual configuration or coding that can be a bit more time consuming or harder to maintain.

That's why we came up with dedicated solution for eCommerce platforms to deploy complete Consent Mode to your website or webstore with few simple steps:

Consent Mode Banner