1. Sie sind hier:
  2. Home
    3. |
  3. Know How
    4. |
  4. Google Consent Mode V2

Google Consent Mode V2 mit WCM

Letzte Änderung:

Der Google Consent Mode ist eine Technologie von Google, die es Websites ermöglicht, datenschutzfreundlich und dennoch effektiv mit den Diensten von Google wie Google Analytics, Google Ads und anderen zu arbeiten. Der Consent Mode ermöglicht es, das Verhalten von Google-Tags (z. B. für Tracking, Werbung oder Conversion-Tracking) basierend auf der Zustimmung des Nutzers zu steuern.

Die Version 2 des Google Consent Mode wurde eingeführt, um die Funktionsweise des Consent Mode weiter zu verbessern und an die sich ändernden Datenschutzbestimmungen, insbesondere der DSGVO (Datenschutz-Grundverordnung) und anderer internationaler Datenschutzgesetze, anzupassen.

Der folgende Artikel beschreibt, wie man mit der TYPO3 Extension WACON Cookiemanagement den neuen Einwilligungsmodus Google Consent Mode V2 am Besipiel von Google Analytics umsetzt.

Es gibt 2 mögliche Implementierungsmodi:

  • Basic Mode: Hier werden erst dann Daten an Google geschickt, wenn der User dem ausdrücklich zugestimmt hat.
  • Advanced Mode: Hier werden auch ohne User-Zustimmung bestimmte Daten an den Google-Server weitergeleitet. Sie dienen u.a. einer (KI-basierten) Modellierung des Verhaltens der User, die nicht zugestimmt haben und bieten damit bessere Analysemethoden.

Wir erläutern im Folgenden die Implementierung beider Modi empfehlen aus Datenschutzgründen aber den Basic Mode. 

Google Tag Manager einrichten

1.  Zunächst muss unter Verwaltung → Containereinstellungen die “Einwilligungsübersicht” aktiviert werden:

Consent Mode 2 in GTM aktivieren
Consent Mode 2 in GTM aktivieren

2. Dann muss für jedes Analytics-relevante Tag die Einstellung zur Nutzereinwilligung auf “storage_analytics” gestezt werden:

Tag-Properties für Consent Mode 2 definieren
Tag-Properties für Consent Mode 2 definieren

Einbinden des GTM-Codes in die WCM-Extension (bisherige Methode)

Um den Google Tag Manager nutzen zu können, muss auf der Website jeweils ein JavaScript-Codesnippet im HEAD- und BODY-Bereich ausgespielt werden. Zu finden ist der Code unter Verwaltung → Kontoeinstellungen → “Google Tag Manager installieren”.

 

Code Snippet für Google Tag Manager
Code Snippet für Google Tag Manager

Einbinden des HEAD-Codes

Für Inhalte die im HTML-HEAD ausgegeben werden sollen, wird eine eigene Seite erstellt (im Beispiel “Cookie Scripte Header” mit der ID 320). Hier wird als Inhaltselement das Plugin “WCM Include external resource” eingefügt. Als zu bestätigendes Cookie muss das hinterlegte Google Tag Manager-Element verwendet werden(hier “GTM”). Im Feld Script kommt das Code-Snippet für den Head rein: 

WCM Headerscript einbinden
Headersripte mit WCM einbinden

Der TYPOSCRIPT-Code sieht dann in etwa so aus:

 

page.headerData {
   938 = CONTENT
   938 {
       table = tt_content
       select {
           pidInList = 320
       }
   }
}

Einbinden des BODY-Codes

In der gleichen Weise wird hier ebenfalls eine Seite erstellt (im Beispiel 319) und ein entsprechendes PlugIn-Inhaltselement eingefügt. Im Feld “Script” wird das Code-Snippet für den BODY-Bereich eingefügt.

Das Inhaltselement wird dann - z.B. mit dem lib-Objekt - auf jeder Seite eingefügt:

 

lib.cookiescripte < styles.content.get
lib.cookiescripte.select.pidInList = 319

Basic Mode in WCM konfigurieren

Wenn der Basic Mode verwendet werden soll, muss an den GTM-Code, der mit dem PlugIn “WCM Include external resource” eingefügt wird, nur noch folgendes Snippet angehängt werden (<IHRE-TAG-ID> entsprechend austauschen):

 

<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'
 });
</script>

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GTM-<IHRE-TAG-ID>"></script>
<script>
 window.dataLayer = window.dataLayer || [];
 function gtag(){dataLayer.push(arguments);}

 

    gtag('consent', 'update', {
   'ad_user_data': 'granted',
   'ad_personalization': 'granted',
   'ad_storage': 'granted',
   'analytics_storage': 'granted'
 });

 

 gtag('js', new Date());
 gtag('config', 'GTM-<IHRE-TAG-ID>');
</script>
<!-- End Google Tag Manager -->

 

 

Advanced Mode in WCM konfigurieren (Google Analytics und Ads)

Im Advanced Mode werden drei Elemente im Head geladen. Die Reihenfolge ist dabei unbedingt zu beachten:

Das erste ist ein HTML-Element, das immer ausgespielt wird. Das Snippet bindet das GTM-Tag(s.o.) ein setzt vier Properties auf “disabled” (verbietet also jegliches Tracking):

 

<!-- Google Tag Manager -->
<script>(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','GTM-<IHRE-TAG-ID>');</script>
<!-- End Google Tag Manager -->

 

<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'
 });
</script>

 

Das zweite Inhaltselement ist das oben bereits beschriebene Plugin vom Typ “WCM Include external resource”. Hier werden mit folgenden JavaScipt-Codezeilen die Properties - und damit das Tracking - erlaubt ("granted": 

 

<script>
   gtag('consent', 'update', {
   'ad_user_data': 'granted',
   'ad_personalization': 'granted',
   'ad_storage': 'granted',
   'analytics_storage': 'granted'
 });

</script>

 

Das dritte Inhaltselement ist wieder vom Typ HTML und wird ebenfalls immer ausgespielt. Es sendet die Properties-Einstellungen an Google:

 

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

 

 gtag('js', new Date());
 gtag('config', 'GTM-<IHRE-TAG-ID>');
</script>

 

Das Ganze sieht dann in etwa so aus: