Troubleshoot Consent Mode

Have more questions? Submit a request

If you want to check if Consent Mode is properly integrated and working for your website you can visit the Google website for more instructions on how to test it. 

Go to "Tag Assistant Consent Mode Debugging".

Here are some other options to check if consent mode is implemented properly.

There are 3 ways to check whether consent mode v2 is correctly implemented. 

1. In Google Tag Manager preview check the Consent Tab on the events where tags are firing. 

2. Check consent mode settings in the browser console by enabling Debug mode

3. Checking the dataLayer in browser console

1. Check consent mode settings in GTM

Open the website in the GTM preview mode. Then you can check for the Events of GTM. The Consent Default and Consent Update commands. Click on the Tab called Consent to check the status when this event fired. It is important that the Default commands run before tags are fired. 

 

2. Check consent mode settings in browser console

You can easily check whether consent mode commands are running by running the following code in the console of the browser. It will show you the Default settings, Update settings (if an update took place) and whether the defaults were set on time. 
!important: If you're using the CookieFirst gtm tag then you cannot just inspect the dataLayer. GTM handles the consent mode commands within GTM and is not pushing it to the dataLayer.

Opening the console and put in the script below. The output would be something like:

 

Enable the Debug Mode of the cookie banner will do the same:

 

Manually add Console script:

(function() {
  function statusText(status) {
    return status === undefined ? "" : status ? "granted" : "denied";
  }

  function statusColor(status) {
    return status === "granted" ? "color: #0C0" : "color: #C00";
  }

  if (!window["google_tag_data"]) {
    console.warn("No Consent Mode data found");
    return;
  }

  var consentEntries = "ics" in google_tag_data ? google_tag_data.ics.entries : null;
  var defaultStatus = "", updateStatus = "";
  var title = "%c" + "Google Consent Mode v2 Debugging:";
  
  console.log(title, "font-size: 1rem");

  for (var entry in consentEntries) {
    defaultStatus = statusText(consentEntries[entry]['default']);
    updateStatus = statusText(consentEntries[entry]['update']);
    if (defaultStatus === "" && updateStatus === "") continue;

    var message = "\t" + entry + ":" +
      (defaultStatus !== "" ? "\n\t\tDefault: %c" + defaultStatus : "%c") + "%c" +
      (updateStatus !== "" ? "\n\t\tUpdate: %c" + updateStatus : "%c");

    console.log(message, 
      defaultStatus !== "" ? statusColor(defaultStatus) : "", 
      "", 
      updateStatus !== "" ? statusColor(updateStatus) : "", 
      "");
  }

  if (defaultStatus === "") {
    console.log("No default Consent settings found");
  }

  var wasSetLate = google_tag_data.ics.wasSetLate;
  if (wasSetLate) {
    console.error("%cYour Consent Mode issue: %cA tag read consent before a Default was set. At least one of your Google Tags fired before the Consent Mode defaults were set. Read more: https://developers.google.com/tag-platform/security/guides/consent-debugging#default-consent or Contact support@cookiefirst.com",
      "color: red; font-weight: bold;", "color: red;");
  } else {
    console.log("%cConsent Mode defaults are correctly set in time.", "color: green;");
  }
})();

How to open the browser console in various browsers?

Google Chrome:

  • Keyboard Shortcut: Press Ctrl + Shift + J (Windows/Linux) or Cmd + Option + J (Mac).
  • Right-click Menu: Right-click anywhere on the webpage and select "Inspect" from the context menu. The console will appear in a side panel.

Safari:

  • Enable Develop Menu (if hidden): Go to Safari > Preferences > Advanced and check the box for "Show Develop menu in menu bar".
  • Menu Bar: Once enabled, go to Develop > Show Web Inspector.

Mozilla Firefox:

  • Keyboard Shortcut: Press F12.
  • Menu Bar: Click on the menu button (three horizontal lines) in the top right corner, then select "More Tools" > "Web Developer" > "Toggle Tools".

Microsoft Edge:

  • Keyboard Shortcut: Press F12.
  • Menu Bar: Click on the three dots menu in the top right corner, then select "More tools" > "Developer Tools". The console might be in a separate tab, so look for the "Console" tab.

3. Check the dataLayer values

Running the following code will print the dataLayer items in the browser console for inspection. Before consent there's the default commands and after update both default and CoMo update commands are visible. Run the following code.

(function(window, dataLayerKey, output) {
const dataLayer = window[dataLayerKey];
for (const item of dataLayer) {
output += JSON.stringify(item).replace(/\\"\d+":/g, "") + "\n";
}
console.log(output);
})(window, "dataLayer", "");

Articles in this section

Was this article helpful?
1 out of 1 found this helpful
Share