[Feat]: Google Consent Mode v2 #665

Rombecchi · 2024-03-21T17:50:28Z

Description

Due to Google's recent requirement to switch to Cookie Consent Mode V2, many users are requesting to switch to platforms certified by Google itself such as Iubenda, CookieBot, etc.
Is it possible to implement this functionality and be accredited as a Google certified platform?

Thank you for your attention

Proposed solution

Set up consent mode:
https://developers.google.com/tag-platform/security/guides/consent?consentmode=advanced#upgrade-consent-v2

I also found this certification form:
https://support.google.com/admanager/contact/cmp_certification_interest?hl=en&sjid=780032960389095808-EU

Additional details

No response

orestbida · 2024-03-21T21:06:07Z

See #523.

Rombecchi · 2024-03-25T10:51:03Z

Thank you for your response.
However, beyond the responsibility of becoming an IAB-accredited CMP, Google allows you to be able to set the consent status using asynchronous banner platforms with the "update" command

See https://developers.google.com/tag-platform/security/guides/consent?consentmode=advanced&hl=it#upgrade-consent-v2

Here is an example of how it can be handled:
https://developers.google.com/tag-platform/security/guides/consent?consentmode=advanced&hl=it#implementation_example

Would this be possible to implement?

FynnZW · 2024-03-27T12:13:08Z

I think so yes - here's how I did it, partly based on this comment:

Tag-Manager in <head>:

<script>
// Define dataLayer and the gtag function.
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

// Set default consent to 'denied' as a placeholder
// Determine actual values based on your own requirements
gtag('consent', 'default', {
  'ad_storage': 'denied',
  'ad_user_data': 'denied',
  'ad_personalization': 'denied',
  'analytics_storage': 'denied'
  'functionality_storage': 'denied',
  'personalization_storage': 'denied',
});
</script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID">
</script>
<script>
  gtag('js', new Date());
  gtag('config', 'TAG_ID');
</script>

Update-function in CookieConsent - callbacks:

CookieConsent.run({
	// ...
	onConsent: () => {
		updateGtagConsent();
	},
	onChange: ({ changedCategories }) => {
		updateGtagConsent();
	},
});


function updateGtagConsent() {
	gtag('consent', 'update', {
		'ad_storage': CookieConsent.acceptedCategory('advertisement') ? 'granted' : 'denied',
		'ad_user_data': CookieConsent.acceptedCategory('advertisement') ? 'granted' : 'denied',
		'ad_personalization': CookieConsent.acceptedCategory('advertisement') ? 'granted' : 'denied',
		'analytics_storage': CookieConsent.acceptedCategory('analytics') ? 'granted' : 'denied',
		'functionality_storage': CookieConsent.acceptedCategory('functional') ? 'granted' : 'denied',
		'personalization_storage': CookieConsent.acceptedCategory('functional') ? 'granted' : 'denied',
	});
}

Edit:
I'm not sure, but just connecting to the tag manager might be a breach of GDPR (I'm not a lawyer, might be overkill), so I also disabled that script source, unless the 'analytics' - category is accepted:

<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID" type="text/plain" data-category="analytics">
</script>

sunscreem · 2024-03-30T19:46:20Z

Hey @FynnZW the script I use to load Tag Manger looks very different yours. Have you had your implementation in for a long while? This is the code that google suggests I use:

<script type="text/plain" data-cookiecategory="performance">
  (function (w, d, s, l, i) {
    w[l] = w[l] || [];
    w[l].push({
      'gtm.start':

        new Date().getTime(), event: 'gtm.js'
    });
    var f = d.getElementsByTagName(s)[0],

      j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : '';
    j.async = true;
    j.src =

      'https://www.googletagmanager.com/gtm.js?id=' + i + dl;
    f.parentNode.insertBefore(j, f);

  })(window, document, 'script', 'dataLayer', 'TAG_ID');
</script>

sunscreem · 2024-04-01T10:54:43Z

Ignore that @FynnZW I hadn't worked out it was just a case of putting the gtag function before the gtag script itself loads. All working now.

orestbida · 2024-04-01T16:33:06Z

Going back to the main point of this issue: I don't plan on having any default embedded service in the plugin.

I can, however, add a dedicated section in the docs. on how to set up google consent mode v2.

mrleblanc101 · 2024-04-23T05:38:37Z

@FynnZW Hi, when using the Tag Inspector with your solution, I see some problems.
On first visit, the consent will set to the default value, which is Denied in my case; no problem here.

In Tag Inspector, if the user grant consent by clicking Accept all, on next page load I see the Consent event with Granted for all categories after the Container load event.

Which means for exemple that my Facebook Pixel is blocked, because the consent is still the default Denied when the container was initialized.

How would I make sure the consent from orestbida/cookieconsent (vanilla-cookieconsent) is read from the cookie before my containers are loaded ?

Charissa24 · 2024-05-01T14:03:26Z

Going back to the main point of this issue: I don't plan on having any default embedded service in the plugin.

I can, however, add a dedicated section in the docs. on how to set up google consent mode v2.

Something like this article would be very helpful. The article uses v2.9, an update for 3 would be great.

amitsarkerr · 2024-05-16T22:10:03Z

Looking forward to implement the cookie consent in version 3.

Giannisssss · 2024-05-17T19:49:54Z

Hello everyone, I think this article is still very useful.
I hope I have understood correctly but for Consent Mode v2, compared to what is written in the article, it should only be necessary to add management for the new parameters ad_user_data and ad_personalization. I was doubtful whether it was necessary to insert two extra flags into the CookieConsent (thanks Orestbida, fantastic work!).
However, it seems that services like Cookiebot make the two parameters fall into the Marketing category so I use the flag that manages ad_storage by setting {{Consent - Targeting}} also for the two new entries in the "Consent Mode | Update Consent" Tag (as per the article) .
I hope I'm not wrong and that my thoughts can be useful.

danwie · 2024-09-18T16:39:56Z

I think so yes - here's how I did it, partly based on this comment:

Tag-Manager in <head>:

<script>
// Define dataLayer and the gtag function.
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

// Set default consent to 'denied' as a placeholder
// Determine actual values based on your own requirements
gtag('consent', 'default', {
  'ad_storage': 'denied',
  'ad_user_data': 'denied',
  'ad_personalization': 'denied',
  'analytics_storage': 'denied'
  'functionality_storage': 'denied',
  'personalization_storage': 'denied',
});
</script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID">
</script>
<script>
  gtag('js', new Date());
  gtag('config', 'TAG_ID');
</script>

Update-function in CookieConsent - callbacks:

CookieConsent.run({
	// ...
	onConsent: () => {
		updateGtagConsent();
	},
	onChange: ({ changedCategories }) => {
		updateGtagConsent();
	},
});


function updateGtagConsent() {
	gtag('consent', 'update', {
		'ad_storage': CookieConsent.acceptedCategory('advertisement') ? 'granted' : 'denied',
		'ad_user_data': CookieConsent.acceptedCategory('advertisement') ? 'granted' : 'denied',
		'ad_personalization': CookieConsent.acceptedCategory('advertisement') ? 'granted' : 'denied',
		'analytics_storage': CookieConsent.acceptedCategory('analytics') ? 'granted' : 'denied',
		'functionality_storage': CookieConsent.acceptedCategory('functional') ? 'granted' : 'denied',
		'personalization_storage': CookieConsent.acceptedCategory('functional') ? 'granted' : 'denied',
	});
}

Edit: I'm not sure, but just connecting to the tag manager might be a breach of GDPR (I'm not a lawyer, might be overkill), so I also disabled that script source, unless the 'analytics' - category is accepted:

<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID" type="text/plain" data-category="analytics">
</script>

Do I need to do anything inside Google Tagmanager also, or is the code above sufficient? It seems pretty straightforward.

Almusamim · 2024-09-19T11:38:48Z

I think so yes - here's how I did it, partly based on this comment:
Tag-Manager in <head>:

<script>
// Define dataLayer and the gtag function.
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

// Set default consent to 'denied' as a placeholder
// Determine actual values based on your own requirements
gtag('consent', 'default', {
  'ad_storage': 'denied',
  'ad_user_data': 'denied',
  'ad_personalization': 'denied',
  'analytics_storage': 'denied'
  'functionality_storage': 'denied',
  'personalization_storage': 'denied',
});
</script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID">
</script>
<script>
  gtag('js', new Date());
  gtag('config', 'TAG_ID');
</script>

Update-function in CookieConsent - callbacks:

CookieConsent.run({
	// ...
	onConsent: () => {
		updateGtagConsent();
	},
	onChange: ({ changedCategories }) => {
		updateGtagConsent();
	},
});


function updateGtagConsent() {
	gtag('consent', 'update', {
		'ad_storage': CookieConsent.acceptedCategory('advertisement') ? 'granted' : 'denied',
		'ad_user_data': CookieConsent.acceptedCategory('advertisement') ? 'granted' : 'denied',
		'ad_personalization': CookieConsent.acceptedCategory('advertisement') ? 'granted' : 'denied',
		'analytics_storage': CookieConsent.acceptedCategory('analytics') ? 'granted' : 'denied',
		'functionality_storage': CookieConsent.acceptedCategory('functional') ? 'granted' : 'denied',
		'personalization_storage': CookieConsent.acceptedCategory('functional') ? 'granted' : 'denied',
	});
}

Edit: I'm not sure, but just connecting to the tag manager might be a breach of GDPR (I'm not a lawyer, might be overkill), so I also disabled that script source, unless the 'analytics' - category is accepted:

<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID" type="text/plain" data-category="analytics">
</script>

Do I need to do anything inside Google Tagmanager also, or is the code above sufficient? It seems pretty straightforward.

I would also like to know if we have to do anything else to handle for example Google Analytics and Google Ads in GTM
Would GTM block them automatically based on the consent ?

FynnZW · 2024-09-19T12:01:25Z

You still need to configure in GTM, which consent categories are associated with which tags.
This article & video explains it pretty well:
https://support.google.com/tagmanager/answer/10718549?hl=en

danwie · 2024-09-20T09:36:24Z

You still need to configure in GTM, which consent categories are associated with which tags. This article & video explains it pretty well: https://support.google.com/tagmanager/answer/10718549?hl=en

Thanks. From what I understand: in our scenario we're only using Google Analytics, and the analytics_storage tag. According to the video "google tags are already aware of consent mode and are already working". Google Tag Manager is only needed for additional settings. The Consent Settings that is mentioned in the video is not available for me. I've used the preview in Google Tag Manager and it seems the analytics_storage tag is connected to Cookie Consent.

Rombecchi added enhancement New feature or request triage yet to be reviewed labels Mar 21, 2024

orestbida removed the triage yet to be reviewed label Mar 21, 2024

orestbida closed this as completed Apr 1, 2024

orestbida mentioned this issue Apr 1, 2024

[Docs]: how to configure google consent mode #669

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Feat]: Google Consent Mode v2 #665

[Feat]: Google Consent Mode v2 #665

Rombecchi commented Mar 21, 2024

orestbida commented Mar 21, 2024

Rombecchi commented Mar 25, 2024

FynnZW commented Mar 27, 2024 •

edited

Loading

sunscreem commented Mar 30, 2024

sunscreem commented Apr 1, 2024

orestbida commented Apr 1, 2024

mrleblanc101 commented Apr 23, 2024 •

edited

Loading

Charissa24 commented May 1, 2024

amitsarkerr commented May 16, 2024

Giannisssss commented May 17, 2024 •

edited

Loading

danwie commented Sep 18, 2024

Almusamim commented Sep 19, 2024

FynnZW commented Sep 19, 2024

danwie commented Sep 20, 2024

[Feat]: Google Consent Mode v2 #665

[Feat]: Google Consent Mode v2 #665

Comments

Rombecchi commented Mar 21, 2024

Description

Proposed solution

Additional details

orestbida commented Mar 21, 2024

Rombecchi commented Mar 25, 2024

FynnZW commented Mar 27, 2024 • edited Loading

sunscreem commented Mar 30, 2024

sunscreem commented Apr 1, 2024

orestbida commented Apr 1, 2024

mrleblanc101 commented Apr 23, 2024 • edited Loading

Charissa24 commented May 1, 2024

amitsarkerr commented May 16, 2024

Giannisssss commented May 17, 2024 • edited Loading

danwie commented Sep 18, 2024

Almusamim commented Sep 19, 2024

FynnZW commented Sep 19, 2024

danwie commented Sep 20, 2024

FynnZW commented Mar 27, 2024 •

edited

Loading

mrleblanc101 commented Apr 23, 2024 •

edited

Loading

Giannisssss commented May 17, 2024 •

edited

Loading