Configuring GTM Consent Mode with Cookie Control

As we’ve written about in the past, we’re huge fans of Google Tag Manager (GTM) for managing your data collection. Few tools are as effective at enabling your marketing and data teams via fast updates, flexible capabilities, and ease of use.

In recent years, one of the most important features introduced by GTM is its new Consent Mode toolset. In a world where more and more websites are impacted by privacy regulations such as GDPR and CCPA, GTM’s built-in tools for controlling when tags are and are not allowed to fire, along with its useful testing interface, make it easier than ever to ensure that your business is complying with the relevant guidelines.

That said, because sites use a multitude of different Consent Management Platforms, knowing how to configure GTM to work with your platform can be a challenge. In this guide, we’ll walk you through the steps required to integrate GTM with Cookie Control. Although they offer documentation on their website, and overall have one of the easier setup processes we’ve interacted with, we recommend making a couple of modifications to ensure the best possible data collection.

Variable Setup

Cookie Control Cookie

• Description: This variable will allow you to read the cookie set by Cookie Control once consent settings have been established. We’ll use this to help set our default consent state.

• Variable Type: 1st Party Cookie

• Cookie Name: CookieControl

• URI-decode cookie: Enabled

Cookie Control Consent Status - Analytics and Marketing

• Description: These are actually two separate variables: one for analytics, and one for marketing. These variables define the default consent state—defaulting to denied when a user is yet to interact with the consent banner, and then parsing the selected status once the CookieControl cookie has been set. These are used to set the default consent states on the tag and to build our triggers that read when consent has changed.

• Variable Type: Custom JavaScript

• Custom Javascript:

function () {
  var consentStatus =  "denied";
  var cookieControl = {{Cookie Control Cookie}};
// Parse the cookie JSON object
  if (cookieControl) {
  var cookieData = JSON.parse(cookieControl);
// Check if the 'optionalCookies' field contains analytics info
  if (cookieData.optionalCookies && cookieData.optionalCookies.Analytics) {
     consentStatus = "granted";
   }
  } else {
     consentStatus = "denied";
  }
  return consentStatus
}

• Notes:

  • Please note that the above code sample is for the Analytics version of the variable. To create the Marketing version, copy/paste the same code, but change the if (cookieData.optionalCookies && cookieData.optionalCookies.Analytics) { line to if (cookieData.optionalCookies && cookieData.optionalCookies.marketing) { . All other lines of the code should be the same.

Trigger Setup

Consent Granted - Analytics & Marketing

• Description - These are actually two separate triggers: one for analytics consent and one for marketing consent. These are used to fire tags that may not have been sent due to a denied consent status. For example, if a pageview-based tag didn’t fire due to a default consent status of denied, this trigger can be added to the tag to ensure that it will fire as soon as consent is granted.

• Trigger Type: Custom Event

• Event Name: analytics_accept

• Conditions:

  • Some Custom Events

  • Cookie Control - Analytics Consent Status equals denied

• Notes:

  • For the marketing version of this trigger, the event should be marketing_accept

  • For the marketing version of this trigger, the condition should be Cookie Control - Marketing Consent Status equals denied

  • In these examples, the Cookie Control - XXX Consent Status variables referenced in the conditions are the variables you created earlier in this guide.

  • The condition is added to this trigger because Cookie Control will fire the analytics_accept and marketing_accept events on every page once consent is granted. This condition ensure that this trigger doesn’t cause tags to fire multiple times on a single page as a result.

Tag Setup

Cookie Control Consent Template

• Description: Conveniently, Cookie Control has built a GTM tag template that does most of the remaining work for you. Refer to their documentation here for the download link and the steps you should take to import this template. Once this is complete, we’ll need to make a couple of modifications to the template.

• Modification Instructions:

  • Inside the Template Editor, navigate to the Fields tab

  • Expand default_consent_mode_settings, then expand analytical and marketing

  • Enable Include variables for both fields

• Notes:

  • The modifications to the template allow us to use the variables we created earlier to set the default consent status. This is important because of how Cookie Control sends status indications. Once consent has been granted, Cookie Control will send the marketing_accept and analytics_accept data layer events on every page. However, it is possible for other data layer events to be sent prior to these events being received, which could result in tags not firing due to the denied default consent status.

Cookie Control

• Description: This tag installs Cookie Control on your site, and also sets the default consent state.

• Tag Type: Cookie Control Template

• apiKey: Refer to your Cookie Control account for this information.

• product: Refer to your Cookie Control subscription for this information.

• Default Consent Mode settings:

  • Analytical cookies: {{Cookie Control - Analytics Consent Status}}

  • Marketing cookies: {{Cookie Control - Marketing Consent Status}}

  • Wait for Update: 500 milliseconds

• Firing Triggers: Consent Initialization - All Pages

Existing Tag Changes

Once you have consent mode set up, you’ll want to check your existing analytics and marketing tags to confirm that they’re configured properly to take advantage of Consent Mode.

Google Tags

• One of the key benefits of GTM consent mode is that Google tags feature built-in consent checks, enabling them to send cookieless pings when consent has not been granted.

• As such, these tags do not need any additional configuration to take advantage of this functionality. Just ensure that under Advanced Settings > Consent Settings, Additional Consent Checks is set to “Not Set”.

• This feature impacts tags for the following products:

  • Google tag

  • Google Analytics

  • Google Ads

  • Floodlight

  • Conversion Linker

Marketing Tags

• Unlike Google tags, any third-party tags used for marketing/advertising products must be updated to ensure that they only fire once consent has been granted.

  • This may include tags for products such as Facebook Ads, Microsoft Ads, and more.

• For each of these tags, ensure that under Advanced Settings > Consent Settings, Additional Consent Checks is set to “Require additional consent for tag to fire”, with a type of ad_storage

• For any tags that should fire on pageview, we also recommend adding the Consent Granted - Marketing trigger we created earlier. This ensures that if these tags were initially blocked by the default consent state, they will fire as soon as consent is granted.

Analytics Tags

• Tags for third-party analytics tools (such as Hotjar, Adobe Analytics, and more) must also be updated to ensure that they fire only once consent has been granted.

• For each of these tags, ensure that under Advanced Settings > Consent Settings, Additional Consent Checks is set to “Require additional consent for tag to fire”, with a type of analytics_storage.

• For any tags that should fire on pageview, we also recommend adding the Consent Granted - Analytics trigger we created earlier. This ensures that if these tags were initially blocked by the default consent state, they will fire as soon as consent is granted.

Testing

To ensure that your setup is working as expected, we recommend following these steps:

• Google Tag Manager: Enter Preview mode

• Preview Window: Ensure that the CookieControl cookie is not set in your browser. If it is, delete it and refresh the page.

• Tag Assistant: Click on Consent Default in the event column for the current page.

• Tag Assistant: Open the Consent tab and confirm that the default consent state is denied.

• Tag Assistant: Click on Container Loaded in the event column and confirm that the relevant tags are listed under “Tags Blocked by Consent Settings”.

• Preview Window: Accept cookies via the modal on the website.

• Tag Assistant: Confirm that analytics_accept and marketing_accept have appeared in the event column. Click on each, confirming that the consent status has been properly updated in the Consent tab, and that any relevant tags have fired.

• Preview Window: Navigate to another page.

• Tag Assistant: Once page has loaded, click into Consent Default and confirm that the correct consent status has been persisted, then confirm all tags have fired as expected.

• We recommend clearing your CookieControl cookie and repeating these steps, but denying consent (or modifying your consent settings), so that you can confirm that all components work as expected in the relevant situations.

Conclusion

We hope this guide has been helpful! If you have any questions or need additional assistance, please reach out to us directly via the contact link below!