Durch das Google Tag Manager einrichten hast du ein kostenloses und mächtiges Tool zur Hand, mit welchem du alle deine Online Marketing Tools ohne Programmierkenntnisse bequem auf deiner Webseite einbinden und administrieren kannst.
Denn über den Google Tag Manager lassen sich mit nur wenigen Klicks, vollkommen flexibel detaillierte Verhaltensdatendeiner Website Besucher erheben.
Anstatt also nur einfache Seitenaufrufe zu erfassen, kannst und solltest du auch komplexe Verhaltensdaten wie Scrolltiefen, Klicks, die Sichtbarkeit spezifischer Elemente, das Ansehen von Videos und vieles mehr auf deiner Website und innerhalb deiner Funnels tracken.
All diese erhobenen Daten kannst du dann anschließend zentral vom Google Tag Manager an alle deine Online Marketing Tools (wie beispielsweise Google Analytics 4, Google Ads, Meta, etc.) senden, um so:
- Die Customer Journey deiner Website Besucher in der Tiefe nachvollziehen zu können
- Conversions präzise zu tracken
- Die Algorithmen der Werbeplattformen effizient zu trainieren
- Und systematisch Optimierungspotenziale aufzudecken
Du merkst also schon, dass sich das Google Tag Manager einrichten für Unternehmen massiv lohnt und genau deshalb wirst du in diesem Artikel (alternativ im gleich folgenden Video) alles wichtige der Google Tag Manager Einrichtung Schritt-für-Schritt gezeigt bekommen.
Disclaimer: Dieser Artikel (bzw. das Video) stellt keine Rechtsberatung dar. Bei Unklarheiten solltest du in jedem Fall einen entsprechenden Fachanwalt konsultieren.
Inhaltsverzeichnis
1. Was wirst du in diesem Artikel lernen?
Da dieser Artikel sehr umfassend ist und wir das Google Tag Manager einrichten sehr ausführlich behandeln werden, möchte ich dir zunächst einen Überblick darüber geben, was du alles lernen wirst.
Im ersten Schritt werden wir uns ansehen, wie man einen Google Tag Manager Account erstellt.
Daraufhin werden wir gemeinsam einen Cookie Banner auf der Website einbinden, über welchen wir dann im nächsten Schritt den Google Tag Manager einrichten werden. Dadurch stellen wir sicher, dass der Tag Manager direkt korrekt mit dem Cookie Banner verbunden ist und auch die Google Consent Mode Integration von Beginn an aktiviert ist.
Nachdem wir diese Umsetzung erfolgreich getestet haben, wirst du die drei wichtigsten Grundbausteine des Google Tag Managers kennenlernen. Du wirst also lernen, was Tags, Trigger und Variablen sind.
Im Anschluss daran werden wir uns dem Google Tag Assistant widmen, welcher ein weiterer essenzieller Part für das Google Tag Manager einrichten darstellt. Dieser wird auch oft als Vorschau-Modus bezeichnet und ermöglicht uns, alle im Google Tag Manager umgesetzten Implementierungen noch vor der Veröffentlichung akribisch zu testen.
Nachdem du die wichtigsten Funktionalitäten des Google Tag Managers im Detail kennengelernt hast, werden wir abschließend noch in der Praxis einen beispielhaften Tag inklusive Consent Aussteuerung implementieren und zwar Google Analytics 4 (inklusive Consent Mode v2).
Du siehst also, wir haben einiges vor und nach diesem Artikel (bzw. alternativ dem oben eingebetteten Video) wirst du die grundlegende Arbeitsweise des Google Tag Managers verstehen und dazu in der Lage sein, eigenständig den Google Tag Manager einrichten zu können.
Solltest du keine Zeit oder Lust haben, dich umfassend in den Google Tag Manager einzuarbeiten, so kannst du auch einfach den DATENVERSIERT Implementierungsservice nutzen (du lehnst dich zurück und wir übernehmen die Arbeit für dich).
Spare dir Frust, Zeit & unnötige Fehler beim Thema Tracking.
Wir nehmen dir den technisch anspruchsvollsten Part im Online Marketing ab und bauen dir dein schlüsselfertiges Tracking Setup, das sofort perfekt funktioniert.
Falls du dich hingegen noch viel tiefer mit dem Thema auseinandersetzen möchtest, um das volle Potenzial des Google Tag Managers ausschöpfen zu können, dann wirf unbedingt einen Blick auf unser Google Tag Manager Expert Training:
Im Google Tag Manager Expert Training lernst du, wie du vollkommen flexibel detaillierte Verhaltensdaten deiner Website Besucher erheben und sie anschließend an alle deine Online Marketing Tools senden kannst.
Dadurch kannst du ein auf dein Unternehmen maßgeschneidertes Tracking Setup umsetzen!
2. Google Tag Manager einrichten - Account Erstellung
Um den Google Tag Manager zu nutzen, muss man sich zunächst ein kostenloses GoogleTag Manager Konto erstellen.
Hierzu gehen wir auf die URL tagmanager.google.com.
Auf der Seite angekommen ist schonmal eine Sache wichtig zu beachten. Und zwar wird der Google Tag Manager immer in Kombination mit einem Google Account erstellt.
Das heißt, falls du in deinem Browser noch NICHT in einen Google Account eingeloggt sein solltest, dann erscheint auf der Seite ein Formular, in welchem man aufgefordert wird, sich in seinen Google Account einzuloggen.
Du musst dich also zunächst in deinen Google Account einloggen oder dir alternativ über den Button „Konto erstellen“ einen Google Account anlegen (falls du noch keinen haben solltest). Sobald du eingeloggt bist, hast du folgende Ansicht vor dir, in welcher du direkt rechts oben auf den Button „Konto erstellen“ klickst:
Daraufhin landest du auf einer Seite, auf welcher du nun ein paar Angaben machen musst.
Zuerst müssen wir den sogenannten Kontonamen wählen. Hier gibst du also beispielsweise den Namen deines Unternehmens ein, auf welchen der Tag Manager Account läuft.
Wir haben uns für unsere Trainings die Demo Website freds-kochschule.com erstellt. Wir gehen also mal davon aus, dass unser Unternehmen Freds Kochschule heißt, weshalb ich diesen Namen hier nun eintrage. Wenn du gerade den Tag Manager Account für die Max Mustermann GmbH erstellst, dann schreibst du hier eben entsprechend Max Mustermann GmbH rein.
Daraufhin wählst du das Land aus, in meinem Fall Deutschland.
Das „Häkchen“ bei „Daten anonym an Google und andere weitergeben“ lasse ich leer. Wenn du möchtest, dass die Daten weitergegeben werden, ist dir natürlich freigestellt, das Häkchen entsprechend zu setzen.
Damit haben wir für die Account Erstellung an sich schon alles eingegeben:
2.1. Google Tag Manager Container konfigurieren
Als nächstes muss man nun noch einen sogenannten Container konfigurieren. Das heißt in einem Google Tag Manager Account, kann man potenziell mehrere Tag Manager Container haben.
Wenn du nur eine Website hast, dann wirst du wahrscheinlich auch nur einen einzigen Container benötigen. Es gibt aber auch größere Firmen die mehrere Websites haben oder Agenturen wie uns, die mehrere Websites verwalten und da arbeitet man dann für jedes Projekt in einem eigenen Tag Manager Container.
Falls du schonmal Google Analytics 4 genutzt hast, ist ein Container vergleichbar mit einer Property (das aber nur am Rande).
Hier geben wir als Namen einfach die URL von der Website an, auf der wir den Google Tag Manager einrichten wollen. In meinem Fall gebe ich also freds-kochschule.com ein.
Als Zielplattform wählen wir Web, da wir ja mit einer Website arbeiten möchten. Wenn du den Tag Manager in Kombination mit einer iOS App verwenden möchtest, kann man iOS auswählen, im Falle von Android Apps Android und dann gibt es auch noch die Optionen AMP und Server.
AMP steht für Accelerated Mobile Pages. Das ist ein alternatives Format zu HTML, welches entwickelt wurde, um mobile Seiten (also Seiten die über Smartphones aufgerufen werden) schneller laden zu können. Hierfür könnte man also auch einen Container erstellen.
Wenn du aber gar nicht weißt, was eine AMP ist, dann wirst du auch keine AMP haben und deshalb kannst du das einfach vergessen. In 99% der Fälle wirst du ohnehin die Zielplattform „Web“ auswählen müssen.
Die Auswahlmöglichkeit „Server“ ist für den serverseitigen Tag Manager relevant. Das ist aber auch erstmal uninteressant für diesen Artikel, da wir erstmal clientseitig den Google Tag Manager einrichten möchten. Was zu Beginn auch das einzig richtige ist.
Solltest du dich dann im Laufe der Zeit weiterentwickeln, so kannst du dann zukünftig auch noch eine serverseitige Implementierung hinzufügen, dazu dann aber an anderer Stelle mehr.
Daraufhin klickst du auf „Erstellen“:
Daraufhin öffnet sich ein Fenster, in welchem man noch die Nutzungsbedingungen bestätigen muss. Sobald du diese akzeptiert hast, hast du erfolgreich einen Google Tag Manager Account inklusive Container angelegt.
Und hier öffnet sich nun sofort ein Pop-up mit einem kryptisch aussehendem JavaScript Code Snippet:
Dieses müssen wir jetzt auf unserer Website installieren, damit der Google Tag Manager funktioniert.
3. Cookie Banner auf Website einbinden
Da wir uns im europäischen Wirtschaftsraum befinden und somit der DSGVO unterliegen, dürfen wir das Code Snippet jetzt aber nicht einfach wie hier vorgeschlagen direkt auf unserer Website einbinden. Denn wir müssen uns zuvor erst die Einwilligung der Nutzer einholen, bevor wir jegweilige Tracking Tools starten.
Und das machen wir mithilfe einer Consent Management Lösung, also in einfachen Worten: Mit einem Cookie Banner.
Auf dem Markt gibt es jetzt unterschiedlichste Cookie Banner Lösungen und im Endeffekt kannst du nahezu jede Lösung davon verwenden.
Wir empfehlen unteranderem darauf zu achten, dass du eine Cookie Banner Lösung verwendest, welche eine Google Consent Mode Integration implementiert hat. Nahezu jede Premium Cookie Banner Lösung hat dies zum heutigen Zeitpunkt aber bereits implementiert.
Bei den Cookie Banner Lösungen gibt es nun generell zwei Ansätze, wie diese technisch den Consent aussteuern.
Es gibt Cookie Banner Lösungen wie beispielsweise Real Cookie Banner, welche den Consent einzelner Services über die Google Consent Mode API aussteuern.
Und es gibt Cookie Banner Lösungen wie beispielsweise Borlabs Cookie 3, welche den Consent einzelner Services über Ereignisse, die in den DataLayer gepusht werden, aussteuern.
Beide Ansätze führen zum exakt gleichen Ergebnis, müssen aber technisch komplett anders umgesetzt werden. Wir werden in diesem Video die Cookie Banner Lösungen Real Cookie Banner nutzen, und somit die Consent Aussteuerung über die Google Consent Mode API erklären. Meiner Meinung nach ist dieser Ansatz nämlich intuitiver und eleganter.
Mit Cookie Banner Lösungen, die den anderen Ansatz verwenden, geht es aber wie gesagt genauso. Das sieht dann technisch nur etwas anders aus.
In unserem umfassenden Google Tag Manager Expert Training, erklären wir beide Ansätze Schritt-für-Schritt und super detailliert. Und zwar sowohl für Real Cookie Banner als auch für Borlabs Cookie 3 (zusätzlich zudem auch für Cookiebot). Das heißt nach diesem Training kannst du jede beliebige Cookie Banner Lösung verwenden, da du beide Ansätze anzuwenden gelernt hast.
>>> Über diesen Link gelangst du direkt zum Google Tag Manager Expert Training
3.1. Real Cookie Banner auf Website installieren
In den jetzt folgenden Abschnitten dieses Artikels werde ich dir nun meine favorisierte Methode zeigen, um den Google Tag Manager in Kombination mit einem Cookie Banner auf einer Website einzubinden. Und zwar werden wir hierfür das WordPress Cookie Banner Plugin Real Cookie Banner nutzen.
Das Plugin kostet derzeit 59 Euro pro Jahr, was ein mehr als fairer Preis für diese Cookie Banner Lösung ist.
Falls du bisher also noch KEINE Cookie Banner Lösung auf deiner Webseite implementiert hast ODER mit deiner bisherigen Lösung nicht zurecht kommst bzw. unzufrieden bist, dann investiere am besten die paar Euro in dieses Plugin und dann hast du mit den technischen Aspekten in Sachen Consent Management zukünftig auch keine Probleme mehr.
Verlieren wir keine Zeit und beginnen direkt mit der Umsetzung.
Um Real Cookie Banner auf deiner Website zu installieren, musst du zunächst eine Lizenz erwerben. Du gehst hierzu also auf die oben verlinkte Website, wählst eine für dich passende Lizenz und führst anschließend den Bestellprozess durch (mit dem Gutscheincode DATENVERSIERT erhältst du 20% Rabatt).
Nach dem erfolgreichen Kauf erhältst du eine Bestätigungsmail, in welcher sowohl dein Lizenzcode als auch der Download Link des Plugins enthalten ist.
Im nächsten Schritt loggst du dich nun auf deiner WordPress Website ein und klickst links im Menü auf „Plugins“. Und anschließend oben auf den Button „Installieren“:
Anschließend klickst du wieder hier oben auf den Button „Plugin hochladen“:
Und nun wählst du eben das zuvor heruntergeladene Plugin aus und lädst es hoch.
Daraufhin aktivierst du es im nächsten Schritt noch durch einen Klick auf den Button „Aktivieren“ und nun erscheint links im Menü ein neuer Menüpunkt, nämlich „Cookies“. Immer wenn du auf diesen klickst, gelangst du fortan in das Einstellungsmenü des Cookie Banners.
Wenn du das Erste Mal hierauf klickst, erscheint allerdings direkt ein Fenster, in welchem du gebeten wirst, deine Lizenz zunächst mit deinem Lizenzcode zu aktivieren:
Du gibst also den zuvor per E-Mail erhaltenen Lizenzcode ein und wählst als Installationstyp „Produktion“ aus. Daraufhin setzt du noch die entsprechenden Häkchen und klickst auf „Lizenz aktivieren & Fortfahren“.
Damit ist die Lizenz nun erfolgreich aktiviert worden und man befindet sich automatisch im Einstellungsmenü des Cookie Banners. Dort ist nun auch direkt eine Anleitung aufgelistet, um den Cookie Banner Schritt-für-Schritt auf der Website einzurichten.
Du kannst diese Anleitung Schritt-für-Schritt durcharbeiten. Wir fokussieren uns in diesem Artikel jetzt aber nur auf die wichtigsten Punkte.
Wir klicken also auf „Einstellungen“ und hinterlegen dann unser „Impressum“ und unsere „Datenschutzerklärung“ im Cookie Banner.
Zudem aktivieren wir ganz oben noch den Toggle Button bei „Cookie Banner/Dialog“, um den Cookie Banner auf der Website auch wirklich zu aktivieren und anzuzeigen. Daraufhin scrollen wir nach ganz unten und klicken auf den Button „Einstellungen speichern“.
Und damit ist der Cookie Banner nun auf der Website aktiv, was du ganz einfach testen kannst, indem du die Website erneut aufrufst:
Spare dir Frust, Zeit & unnötige Fehler beim Thema Tracking.
Wir nehmen dir den technisch anspruchsvollsten Part im Online Marketing ab und bauen dir dein schlüsselfertiges Tracking Setup, das sofort perfekt funktioniert.
4. Über den Cookie Banner den Google Tag Manager einrichten (inklusive Google Consent Mode v2)
Nachdem wir den Cookie Banner nun erfolgreich auf unserer Website aktivieren haben, können wir nun im nächsten Schritt über den Cookie Banner den Google Tag Manager einrichten.
4.1. Google Consent Mode aktivieren
Hierzu müssen wir zunächst den Google Consent Mode im Cookie Banner aktivieren. Damit sagen wir dem Cookie Banner nämlich, dass wir zukünftig alle Services, mit dem Google Tag Manager inklusive Google Consent Mode aussteuern möchten.
Hierzu gehen wir im WordPress Backend links im Menü auf den Menüpunkt „Cookies“, um in das Einstellungsmenü des Cookie Banners zu gelangen. Dort angekommen klicken wir anschließend auf „Einstellungen > Google Consent Mode“:
Und dann aktivieren wir über die Schaltfläche „Aktiviert“ den Google Consent Mode. Daraufhin erscheinen darunter nun weitere Einstellungsmöglichkeiten. Die Option „Google Tag Manager Integration“ aktivieren wir ebenfalls:
Die darauffolgenden anderen 4 Einstellungsoptionen belassen wir auf den Voreinstellungen. Und dann klicken wir auf „Einstellungen speichern“ um die Änderungen zu übernehmen.
Daraufhin wechseln wir nun nochmal über das Menü auf „Einstellungen > Allgemein“ und dort scrollen wir nach ganz unten, bis zum Menüpunkt „Lade Services nach Einwilligung mittels“:
Und hier sollte nun „Google Tag Manager mit Google Consent Mode“ eingestellt sein. Falls bei dir ein anderen Menüpunkt ausgewählt sein sollte, so wählst du das hier jetzt noch entsprechend korrekt an und klickst anschließend auf „Einstellungen speichern“. Wenn du aber den Instruktionen zuvor gefolgt bist (als wir den Google Consent Mode aktiviert haben), sollte das bereits korrekt bei dir voreingestellt sein.
4.2. Google Tag Manager einrichten
Nun haben wir alle notwendigen Grundeinstellungen getroffen und sind nun bereit, den Google Tag Manager über den Cookie Banner auf unserer Website einzubinden.
Hierfür ist jetzt eine Sache ganz wichtig: Falls du den Google Tag Manager zuvor bereits schonmal auf deiner Website eingebunden hattest, so musst du diesen erst entfernen. Denn es ist zwingend notwendig, dass wir den Google Tag Manager jetzt über den Cookie Banner einbinden, da die beiden Komponenten sonst nicht korrekt zusammenarbeiten. Ansonsten würde der Google Tag Manager nämlich auslösen, obwohl er möglicherweise gar keine Einwilligung vom Nutzer erhalten hat. Deshalb solltest du alle vorherigen Implementierungen entfernen und diesen nun genau wie jetzt gleich beschrieben einbinden.
Um den Google Tag Manager einzubinden klicken wir im Cookie Banner Menü auf „Services (Cookies)“. Hier können wir nun fortlaufend alle gewünschten Services einbinden, für die wir eine Einwilligung benötigen. Und diese Services sind standardmäßig in Cookie Gruppen gruppiert und da gibt es standardmäßig die Gruppen „Essenziell“, „Funktional“, „Statistik“ und „Marketing“.
Wir müssen also jeden Service, den wir zukünftig einbinden, in eine dieser Gruppen einsortieren. Denn der Nutzer kann später über den Cookie Banner auch ganze Cookie Gruppen an bzw. abwählen.
Der Tag Manager wird in der Regel in der Gruppe „Funktional“ eingegliedert und deshalb werden wir das jetzt ebenfalls hier eingliedern. Wir klicken also auf „Funktional“. Und dann auf den Button „Service hinzufügen“.
Das coole am Real Cookie Banner Plugin ist jetzt, dass wir für dutzende Services schon fertige Vorlagen haben, die wir eben verwenden können. So auch für den Google Tag Manager. Wir geben also in der Suchleiste „Tag Manager“ ein und wählen dann die Google Tag Manager Vorlage aus:
Und hier sehen wir nun schon vorausgefüllt zahlreiche Punkte, die eben im Cookie-Banner angegeben werden müssen. Wir müssen hier lediglich noch die Google Tag Manager Container-ID ergänzen.
Diese finden wir in unserem Google Tag Manager Account rechts oben:
Diese kopieren wir nun in die Zwischenablage und fügen sie im entsprechenden Feld in der Google Tag Manager Vorlage ein:
Anschließend scrollen wir nach ganz unten und klicken auf „Speichern“.
Und damit haben wir den Google Tag Manager jetzt erfolgreich eingerichtet!
Um nun zu prüfen, ob das auch tatsächlich funktioniert hat, kannst du dir jetzt eine kostenlose und sehr nützliche Chrome Erweiterung installieren. Und zwar heißt diese „Analytics/GTM/Pixel Debugger“.
Ich habe dir diese hier verlinkt: Zur Chrome Erweiterung
Diese Erweiterung installierst du nun in deinem Chrome Browser. Sobald du das getan hast, kannst du hier oben immer auf dieses Puzzle-Teil Symbol klicken und dort sind dann alle deine installierten Erweiterungen aufgelistet. Und den „Analytics/GTM/Pixel Debugger“ kannst du jetzt anpinnen, indem du auf das Stecknadel Symbol klickst und dann erscheint diese Erweiterung permanent für den Schnellzugriff direkt neben dem Puzzle-Teil Symbol.
Mit dieser Erweiterung werden wir nun gleich die korrekte Einbindung des Google Tag Managers prüfen.
Zuvor müssen wir aber die Cookies löschen. Wir gehen also auf unsere Website und klicken links oben neben der URL auf das Symbol und dann auf „Cookies und Websitedaten“.
Daraufhin klickt man auf „Websitedaten auf dem Gerät verwalten“ und dann auf das Mülltonnen Icon, um alle Cookies zu löschen.
Anschließend laden wir die Website neu und nun erscheint der Cookie Banner erneut.
Da wir gegenwärtig noch keinem Service zugestimmt haben, sollte der Google Tag Manager noch nicht aktiviert sein. Wir prüfen dies, indem wir auf unsere eben installiere Chrome Erweiterung klicken, und rechts oben den Toggle bei „GTM Tracking“ aktivieren:
Wie du siehst, erscheinen hier zwar schon ein paar Informationen zum Google Tag Manager, allerdings handelt es sich dabei nur um sogenannte DataLayer Updates. Der Tag Manager ist aber noch nicht richtig aktiviert, weil wir diesem ja auch noch nicht zugestimmt haben.
Wenn wir nun aber im Cookie Banner auf „Alle akzeptieren“ klicken und somit auch dem Google Tag Manager zustimmen, so sehen wir bei einem erneuten Blick in die Erweiterung, dass der Google Tag Manager nun korrekt aktiviert wurde:
Denn wir sehen hier unteranderem die Container-ID sowie die Ereignisse, die das Laden des Google Tag Managers beweisen.
Damit haben wir nun also verifiziert, dass das Google Tag Manager einrichten über den Cookie Banner erfolgreich gelungen ist.
Also ich denke du merkst schon, diese Chrome Erweiterung ist ein wahnsinnig nützliches Tool und das beste ist, dass wir damit nicht nur den Tag Manager sondern auch alle anderen Tracking Dienste sehen können, sobald wir sie dann eingebunden haben (beispielsweise Google Analytics).
In dem folgenden Video stelle ich dir diese Chrome Erweiterung im übrigen nochmal detaillierter vor, falls du diese ausführlicher kennenlernen möchtest:
5. Einwilligungsängerungs-Button in Website einbauen
Natürlich ist es jetzt so, dass du dem Nutzer auch noch die Option zur Verfügung stellen musst, seine Einwilligungsentscheidung nachträglich anzupassen. Man muss also auch eine Opt-out Möglichkeit zur Verfügung stellen.
Genau das möchten wir jetzt in diesem Abschnitt gemeinsam umsetzen. Hierzu klickst du im WordPress-Backend wieder auf den Menüpunkt „Cookies“, um in die Einstellungen des Cookie-Banners zu gelangen.
Anschließend klickst du auf „Einwilligungen > Rechtliche Links“. Und dann klickst du auf „Shortcode generieren (erweitert)“.
Nun erscheint links eine Spalte mit der Überschrift „Privatsphäre-Einstellungen ändern“. In dieser klicken wir nun auf „Button“, da wir die Änderungsmöglichkeit in Form eines Buttons darstellen möchten.
Dann scrollst du etwas nach unten und dort wir dann der entsprechende Shortcode angezeigt, den wir direkt in die Zwischenablage kopieren.
Diese kannst du nun an beliebigen Stellen auf deiner Website einfügen. Überall wo du diesen Shortcode einfügst, wird dann später ein Button erscheinen, über welchen der Nutzer den Cookie Banner erneut öffnen und seine Einwilligungseinstellungen anpassen kann.
Ich füge den Button nun im Footer meiner Website ein, sodass der Nutzer auf jeder Seite bequem über den Footer die Einwilligungseinstellungen nachträglich anpassen kann.
6. Die 3 wichtigen Grundbausteine des Google Tag Managers
Nachdem wir nun erfolgreich den Google Tag Manager einrichten konnten, möchte ich dir nun in diesem Abschnitt die grundlegende Funktionsweise des Google Tag Managers erläutern.
Der Google Tag Manager setzt sich nämlich aus drei wichtigen Bausteinen zusammen, nämlich den Tags, den Triggern und den Variablen.
6.1. Tags
Mit der Auswahl eines spezifischen Tags legt man fest, WAS man genau tun möchte.
Also möchte ich beispielsweise ein Ereignis wie einen page_view tracken und an Google Analytics senden? Dann muss ich das für diesen Use-Case passende Google Analytics Tag verwenden.
Oder möchte ich tracken, ob Website Besucher, die beispielsweise von einer Facebook Werbeanzeige kommen, sich in den Newsletter einschreiben oder ein Erstgespräch buchen? In solch einem Fall benötige ich einen Tag, das ein lead-Ereignis an Facebook sendet.
Im Falle von Freds-Kochschule (unserer Beispiel-Seite) könnte ich also beispielsweise tracken, ob ein Nutzer den Messerguide angefordert hat. Das ist auf der Website einfach nur ein sogenannter Lead-Magnet. Wir bieten also ein kostenloses und nützliches PDF-Dokument (den Messerguide) an und zwar im Austausch gegen die Kontaktdaten des Besuchers.
Und wenn ein Besucher den Messerguide erfolgreich angefordert hat, dann könnte ich ein lead-Ereignis an Facebook senden. Damit der Facebook Algorithmus weiß, ob er die richtigen Personen auf unsere Webseite schickt, wir unser Ziel mit unserer Werbemaßnahme also erreichen.
Ein Tag ist also einfach nur ein Code Snippet (also ein Stück Code), dass durch den Tag Manager an bestimmten Stellen auf deiner Website eingebunden wird und dann die gewünschte Funktionalität ausführt. Also zum Beispiel ein Code Snippet, dass an Facebook ein lead-Ereignis sendet.
Ich muss also dank des Tag Managers keine Programmierfähigkeiten mehr besitzen, um komplexe JavaScript Code Snippets an ganz bestimmten Stellen auf der Website einfügen.
Das entfällt, da ich diese Code Snippets im Tag Manager als sogenannten Tag zur Verfügung habe und diesen kann ich dann relativ simpel mit ein paar Klicks konfigurieren und der Tag Manager bindet den Tag dann an der passenden Stelle auf der Website ein.
Fürs erste reicht es, wenn du dir merkst, dass wir mit einem Tag sagen, WAS getan werden soll.
6.2. Trigger
Alleine zu sagen, WAS getan werden soll, reicht allerdings nicht. Denn im zweiten Schritt muss man definieren, WANN genau der Tag ausgelöst werden soll. Also welche Bedingungen müssen erfüllt sein?
Das kann man über sogenannte Trigger definieren, dem zweiten wichtigen Baustein im Google Tag Manager.
Über Trigger definieren wir also gewisse Bedingungen, die dem Tag Manager sagen, WANN ein Tag auf der Website ausgelöst werden soll. Dadurch weiß der Tag Manager dann also, wo auf der Website er den Tag (also das Code Snippet) einbinden muss.
Nehmen wir als Beispiel nochmal das lead-Ereignis, das an Facebook gesendet werden soll, wenn ein Besucher den Messerguide erfolgreich angefordert hat. Dafür gibt es im Tag Manager einen Facebook Tag, in welchem wir den Ereignisnamen eintragen können und das wird dann eben an Facebook gesendet.
Jetzt ist es natürlich wichtig, WANN der Tag Manager diesen Tag auslöst. Denn der Tag soll ja nur ausgelöst werden, wenn ein Besucher den Messerguide erfolgreich angefordert hat.
Und mit dem Trigger kann man nun also die Logik hierfür definieren. Indem man zum Beispiel sagt, dass der Nutzer eine ganz bestimmte Unterseite der Website geladen haben muss, beispielsweise die Dankeseite, die eben nur geladen wird, wenn ein Besucher gerade erfolgreich den Messerguide angefordert hat.
Bei Freds-Kochschule wäre es beispielsweise diese Dankseite (mit dieser speziellen URL):
Basierend auf dieser URL könnten wir also einen Trigger definieren. Wenn also jemand auf genau dieser URL landet, dann soll das lead-Ereignis an Facebook gesendet werden.
Fassen wir also nochmal kurz zusammen:
Mit Tags legen wir fest, WAS wir tun möchten (im Beispiel von eben: ein Ereignis mit dem Namen lead an Facebook senden).
Mit dem Trigger legen wir fest, WANN das geschehen soll. Also wann soll das lead Ereignis an Facebook gesendet werden? Im Beispiel von eben, wenn der Nutzer eine spezielle Dankeseite in seinem Browser geladen hat.
6.3. Variablen
Jetzt gibt es noch einen dritten wichtigen Baustein im Google Tag Manager, nämlich die sogenannten Variablen.
Darin werden zusätzliche Informationen zur Verfügung gestellt, die der Tag Manager benötigt, um die gewünschte Aktion auszuführen.
Bleiben wir beim Beispiel von eben.
Um dem Tag Manager zu sagen, dass der Trigger auslösen soll, wenn der Nutzer auf einer bestimmten Unterseite der Website ist, müssen wir die Information, auf welcher Seite sich der Nutzer gerade befindet, irgendwo abrufen können. Und dafür gibt es beispielsweise die Variable Page URL.
In der Variable ist immer die URL gespeichert, auf welcher sich der Nutzer gerade befindet. Ist er auf der Startseite, ist die URL der Startseite (also freds-kochschule.com) darin gespeichert. Wenn er hingegen auf der Dankeseite ist, so ist die URL der Dankeseite darin gespeichert.
Variablen sorgen also dafür, dass die Informationen, die wir benötigen um ein gewünschtes Ergebnis zu erreichen, verfügbar gemacht werden.
Im Beispiel von der Dankeseite nutzen wir also eine Variable, welche die URL der aktuellen Seite enthält. Es gibt aber unzählige weitere Variablen im Google Tag Manager.
Beispielsweise Variablen die den Wert beinhalten, wie tief in Prozent ein Nutzer auf der Seite gescrollt hat. Oder eine Variable welche den Text des Buttons enthält, auf welchen ein Nutzer geklickt hat.
Es gibt also unzählige Variablen, die wir uns alle im Google Tag Manager Expert Training im Detail ansehen.
Das soll ein Artikel sein, welcher dich ganz grundlegend mit den Basics des Google Tag Managers vertraut macht und dir das Google Tag Manager einrichten zeigt. In unserem Expert Training lernst du das Tool aber wirklich in der Tiefe kennen, sodass du danach wie ein Experte damit arbeiten kannst.
>>> Hier findest du alle Informationen zum Google Tag Manager Expert Training
6.4. Zusammenfassung
Abschließend möchte ich nochmal zusammenfassen, was du in diesem Abschnitt wichtiges gelernt hast.
Mit Tags definieren wir, WAS umgesetzt werden soll.
Mit Triggern definieren wir, WANN es umgesetzt werden soll.
Und Variablen liefern uns die benötigten zusätzlichen Informationen, damit das gewünschte Ergebnis umgesetzt werden kann.
Wenn wir mal einen Blick auf die Benutzeroberfläche, also das Interface des Google Tag Managers werfen, dann sehen wir die drei wichtigen Bausteine auch direkt prominent im linken Hauptmenü aufgelistet:
Denn du siehst dort die Menüpunkte „Tags“, „Trigger“ und „Variablen“. Wenn du diese einmal durch klickst, dann wirst du feststellen, dass dort gegenwärtig noch kaum bis gar nichts erscheint. Das liegt daran, weil wir diesen Tag Manager Container zu Beginn des Artikels erst frisch angelegt haben.
Im weiteren Verlauf dieses Artikels werden wir mit diesen Bausteinen aber noch arbeiten.
Spare dir Frust, Zeit & unnötige Fehler beim Thema Tracking.
Wir nehmen dir den technisch anspruchsvollsten Part im Online Marketing ab und bauen dir dein schlüsselfertiges Tracking Setup, das sofort perfekt funktioniert.
7. Der Tag Assistant (Vorschau Modus) erklärt
Im letzten Abschnitt habe ich dir bereits in der Theorie die grundlegenden Bausteine des Google Tag Managers vorgestellt, nämlich die Tags, die Trigger und die Variablen.
Wenn wir gleich im nächsten Abschnitt Google Analytics 4 auf unserer Beispielwebsite über den Google Tag Manager implementieren, wir also im Tag Manager hierzu Tags, Trigger und Variablen anlegen, dann sind diese Änderungen nicht direkt auf der Website live.
Also die Änderungen werden nicht direkt im Tag Manager Container auf der Website ausgespielt. Wir müssen sie immer erst mit einer sogenannten neuen Version live schalten, denn der Tag Manager hat ein integriertes Versionierungssystem, was du dann gleich im nächsten Abschnitt noch sehen wirst.
Bevor wir aber nur daran denken, etwas in einer neuen Version auf der Webseite live zu schalten, sollten wir alle Änderungen die wir im Container vornehmen, immer erst testen.
Und hierfür gibt es den Tag Assistant, welchen wir uns mal grundlegend in diesem Abschnitt ansehen möchten.
Man startet diesen, indem man im Google Tag Manager oben rechts auf den Button „In Vorschau ansehen“ klickt.
Dadurch öffnet sich jetzt der Tag Assistant in einem neuen Tab. Damit dieser korrekt funktioniert, ist es wichtig, dass du dir zuvor noch eine Chrome Erweiterung herunterlädst und zwar die Erweiterung „Tag Assistant Companion“.
>>> Über diesen Link gelangst du direkt zur Erweiterung
Du musst diese einfach nur kurz installieren und dann funktioniert der Tag Assistant vollwertig und sauber in deinem Google Chrome Browser.
Wenn du den Tag Assistant das erste Mal öffnest, dann erscheint in der Regel auch eine Meldung, die einen darauf hinweist, eben genau diese Erweiterung zuvor noch zu installieren. Sobald du das getan hast, kannst du hier nun die URL deiner Website eingeben, die du testen möchtest:
Auf dieser solltest du natürlich wie in einem der Abschnitte zuvor beschrieben, bereits den Google Tag Manager eingerichtet haben.
Unten links ist zudem noch ein Haken bei „inlcude debug signal in the URL“ gesetzt. Diesen lassen wir standardmäßig gesetzt. Denn das sorgt nur dafür, dass an die URL dann noch ein Parameter angehängt wird, der für Google Analytics relevant ist, nämlich um die GA4 DebugView zu starten.
Das ist aber für diesen Artikel nicht weiter relevant und wird genauer in unseren Expert Trainings beleuchtet.
Abschließend klicken wir auf „Connect“.
Dadurch öffnet sich jetzt ein neuer Tab mit der Website, die wir zuvor in das Eingabefeld eingetragen haben. Und rechts unten siehst du ein Kästchen vom Tag Assistant, dass zeigt, dass der Tag Assistant erfolgreich verbunden ist.
Auf dieser Website sind jetzt im Tag Manager Container alle Änderungen, die wir im Tag Manager vorgenommen haben (also neu erstellte Tags, Trigger, Variablen, etc.), aber noch nicht Live geschaltet haben, lokal integriert.
Das heißt, dass gegenwärtig nur wir innerhalb des Tag Assistants die Änderungen sehen können. Wenn jetzt gerade im Moment ein anderer Nutzer auf die Live-Website geht, dann ist dort noch die Tag Manager Container Version hinterlegt, die wir zuletzt mit einer Version live geschaltet haben.
Im anderen Tab sehen wir nun das eigentlich aktive Tag Assistant Tool. Hier wird uns nun ebenfalls eine Meldung angezeigt, dass der Tag Assistant erfolgreich verbunden wurde, was wir mit einem Klick auf „Continue“ bestätigen.
In diesem Tab können wir nun also alle Änderungen detailliert durchprüfen.
In der linken Seitenleiste sieht man immer die Summary. Dort steht ganz oben neben dem Ausklapp-Pfeil immer der Titel der Seite, die wir im anderen Tab geöffnet haben. In diesem Fall hat die Startseite von freds-kochschule.com den Titel „My WordPress“, was eben hier oben im Tab ersichtlich ist.
Rechts daneben sehen wir ganz oben auch die genaue URL sowie Details zum Tag Manager Container, der auf dieser URL integriert ist. Der Container Name ist freds-kochschule.com, die Container ID ist hier ebenfalls ersichtlich und zudem sind noch ein paar weitere technische Details hier einsehbar.
Darunter sehen wir eine Übersicht über alle Tags, die auf dieser spezifischen URL ausgelöst wurden. Da wir in diesem Google Tag Manager Container noch keine Tags erzeugt haben, sehen wir hier logischerweise auch noch nichts.
Rechts neben dem Tab „Tags“ sehen wir den Tab „Variablen“. Hier wirst du dann im weiteren Verlauf genau sehen können, welche Variablen in welchem Schritt welche konkreten Werte beinhalten.
Rechts neben Variablen sieht man den Tab „Data Layer“. Das ist ein Thema, dem wir uns in einem kompletten Modul im Google Tag Manager Expert Training dediziert und umfassend widmen werden. Fürs erste können wir das aber einfach mal nur zur Kenntnis nehmen.
Rechts daneben folgt der Tab „Consent“. In diesem sehen wir die Einwilligungen, die wir über die Consent Mode API an den Tag Manager weitergeben. Das diese Signale hier korrekt ankommen, haben wir beim Google Tag Manager einrichten in den Abschnitten zuvor bereits korrekt konfiguriert.
Und dann gibt es noch den Tab „Errors“, in welchem potenzielle Fehler angezeigt werden.
Weil wir hier gerade ganz oben links auf den Seitentitel geklickt haben, wird uns rechts in den eben durchgesprochenen Tabs eben angezeigt, was alles insgesamt auf der Seite passiert ist.
Viel spannender sind aber die Aufzählungen unter dem Seitentitel. Denn das sind alle einzelnen Ereignisse, die während unserer Sitzung der Reihe nach auf der Seite ausgelöst wurden.
Und diese sind auch so sortiert, wie sie tatsächlich beim Laden der Seite der Reihe nach aufgetreten sind (sogar mit Nummerierung).
Als erstes treten auf der Seite also „Set“ und „Consent“ Ereignisse auf. Das sind Ereignisse die hier erscheinen, weil wir den Tag Manager in Kombination mit dem Real Cookie Banner und dem Consent Mode implementiert haben. Das Cookie Banner Plugin sorgt also dafür, dass diese Ereignisse hier erscheinen (wenn du eine andere Cookie Banner Lösung verwendest, erscheinen bei dir wohlmöglich andere Ereignisse). Diese vier Ereignisse betreffen also Consent relevante Themen. Das schauen wir uns im nächsten Abschnitt aber noch im Detail an.
Darüber siehst du dann weitere Ereignisse wie „Container Loaded“, „DOM-Ready“ und „Window Loaded“.
Container Loaded bedeutet beispielsweise, dass ab diesem Zeitpunkt der Google Tag Manager Container vollständig geladen wurde.
Das Ereignis DOM Ready bedeutet, dass ab diesem Zeitpunkt das komplette HTML der Website vollständig vom Webbrowser geladen und verarbeitet wurde. Externe Ressourcen, wie beispielsweise Bilder, könnten zu diesem Zeitpunkt aber möglicherweise noch nicht vollständig geladen worden sein (das ist also in diesem Schritt noch nicht sichergestellt).
Aber beim Ereignis Window Loaded, denn wenn dieses Ereignis auftritt, ist die komplette Seite inklusive aller Ressourcen wie beispielsweise Bilder vollständig geladen und wird entsprechend im Browser Fenster angezeigt.
Diese ganzen Ereignisse treten also teilweise in wenigen Millisekunden nacheinander auf. Und dank dem Tag Assistant können wir hier jetzt schön aufbereitet nachvollziehen, was eben in welcher Reihenfolge auf der Website passiert ist.
Das wirklich coole ist aber, dass wenn wir hier jetzt einen einzelnen Schritt anklicken, sich das Menü rechts auch anpasst. Das heißt uns werden jetzt im rechten Bereich für jedes einzelne Ereignis (je nachdem welches wir gegenwärtig angeklickt haben), immer die genau zu diesem Zeitpunkt verfügbaren Informationen angezeigt.
Wenn man also beispielsweise auf das Ereignis „Container Loaded“ klickt, so werden einem rechts unter „Tags“ alle Tags angezeigt, die genau zum Zeitpunkt dieses Ereignisses ausgelöst wurden. Auch alle anderen Tabs beziehen sich dann immer auf den Zeitpunkt des entsprechend ausgewählten Ereignisses.
Da wir aktuell noch den Google Tag Manager einrichten und uns somit noch am Anfang befinden, sehen wir hier noch nicht wirklich etwas. Weil wir ja noch keine Tags, Trigger, Variablen, etc. implementiert haben.
Das wird sich im weiteren Verlauf des Artikels aber gleich noch ändern. Dann wirst du sehen, wie das in der Praxis dann aussieht und wieso dieses Tag Assistant Tool so ein wertvolles Tool ist, wenn es darum geht das Setup zu testen.
Sobald man alles fertig getestet hat, kann man die beiden Tabs (also den Tag Assistant und die Website) einfach wieder schließen und dann befindet man sich wieder im Google Tag Manager.
Und dann könnte man die Version über den „Senden“ Button rechts oben veröffentlichen und damit wären die Änderungen dann auf der Website für alle Nutzer live.
Nachdem du nun also auch die wichtigsten Basics des Tag Assistants kennengelernt hast, sind wir bereit, jetzt im nächsten Schritt Google Analytics 4 inklusive Google Consent Mode über den Cookie Banner mit dem Google Tag Manager einrichten.
8. Google Analytics 4 mit Google Consent Mode über den Google Tag Manager einrichten
In diesem Abschnitt werden wir nun Google Analytics 4 inklusive Google Consent Mode v2 über den Cookie Banner korrekt mit dem Google Tag Manager einrichten.
Um diesen Abschnitt durcharbeiten zu können, ist es wichtig, dass du alle Schritte die wir zuvor in diesem Artikel umgesetzt haben, 1 zu 1 genauso umgesetzt hast.
Als zweite Voraussetzung benötigst du lediglich noch ein kostenloses Google Analytics 4 Konto, in welchem du bereits einen Web-Datenstream erstellt hast.
Falls du noch kein Google Analytics Konto hast, gehe auf die Website analytics.google.com und erstelle dir dort ein Konto. Auf der Seite musst du lediglich den Instruktionen folgen und dich durchklicken und dann hast du innerhalb von 2 Minuten auch schon ein Google Analytics Konto erstellt.
Sobald du das Konto aktiviert hast, wirst du sofort darum gebeten einen Datenstream zu erstellen. Du kannst auch jederzeit wieder über das Google Analytics Menü zum Datenstream navigieren, indem du auf „Verwaltung > Datenstreams“ klickst. Und dort kannst du dir jetzt einen Web-Datenstream erstellen.
Hier musst du als erstes die Website URL eintragen, die du tracken möchtest (in meinem Fall freds-kochschule.com). Und bei Stream Name kannst du die gleiche URL einfach erneut eingeben. Anschließend klickst du auf „Stream erstellen“.
Und damit hat man nun den benötigten Web-Datenstream erstellt.
Sobald du diese beiden Voraussetzungen erfüllt hast, können wir mit der eigentlichen Implementierung starten.
8.1. Google Analytics 4 als Service hinzufügen
Im ersten Schritt müssen wir den Service „Google Analytics 4“ zu unserem Cookie Banner hinzufügen. Wir gehen also in die Einstellungen des Cookie Banners und klicken dort im Menü auf „Services > Statistik“ und fügen einen neuen Service hinzu.
In der Suche geben wir nun „Google Analytics“ ein und wählen die Vorlage „Google Analytics 4“ aus:
Da es sich um eine fertige Vorlage handelt, sind hier bereits alle wichtigen Informationen vorab ausgefüllt. Du könntest diese Daten natürlich noch anpassen, aber ich bin damit zufrieden und lasse alles so, wie es von der Vorlage vorgeschlagen wird.
Wenn man nun etwas weiter nach unten scrollt, sieht man, dass hier unten nun der Punkt „Angefragte Einwilligungsarten für Google Consent Mode“ erscheint:
Diese Option erscheint hier, wenn du wie ich es dir zuvor nochmal wiederholend gezeigt habe, in den Einstellungen „Lade Services nach Einwilligung mittels…“ auf „Google Tag Manager mit Google Consent Mode“ gesetzt hast.
Hier sind jetzt nämlich alle Einwilligungen aufgeführt, die entsprechend über die Google Consent Mode API an den Google Tag Manager übertragen werden, wenn der Nutzer diesem Service (also Google Analytics 4) im Cookie Banner zustimmt. Diese Einwilligungen haben wir dann also im Tag Manager zur Verfügung und können darüber dann den Consent korrekt aussteuern.
Wenn der Nutzer Google Analytics 4 zugestimmt hat, soll also getrackt werden. Und wenn er es über den Cookie Banner abgelehnt hat, dann soll eben KEIN Tracking erfolgen.
Das wirst du aber erst verstehen, wenn wir das gleich im Google Tag Manager einrichten. Deshalb nehmen wir das jetzt hier erstmal nur zur Kenntnis und behalten diese empfohlenen Einstellungen bei, die uns durch die Vorlage vorgegeben wurden.
Jetzt gibt es hier etwas weiter unten noch das Pflichtfeld mit der Measurement-ID:
Das heißt, wir können diese Vorlage nicht speichern, wenn wir hier nicht zuvor die Measurement-ID einfügen. Die Measurment-ID erhalten wir aus unserem Datenstream, denn wir zu Beginn dieses Abschnitts in Google Analytics angelegt haben.
Das heißt wir gehen zurück auf Google Analytics, klicken dort auf „Verwaltung > Datenstreams“ und öffnen den gewünschten Datenstream. Daraufhin wird uns rechts oben die Mess-ID angezeigt, die wir kopieren und dann entsprechend in der Vorlage einfügen.
An dieser Stelle ist nun eine Sache ganz wichtig zu verstehen. Eigentlich müssen wir die Mess-ID hier gar nicht einfügen, denn wir wollen das ja gleich über den Google Tag Manager einrichten und somit aussteuern. Das heißt, wir werden gleich im Tag Manager an einer bestimmten Stelle diese Mess-ID einfügen und dann über den Tag Manager das Skript laden, welches Google Analytics auf unserer Website aktiviert.
Jetzt kann es aber sein, dass je nachdem was der Nutzer im Cookie Banner akzeptiert, es später zu einem speziellen Sonderfall kommen kann. Aus diesem Grund muss man hier auch die Measurement-ID einfügen, die uns zuvor im Datenstream angezeigt wurde.
Sollte es zu diesem Sonderfall kommen, wir das Google Analytics Skript nämlich nicht über den Google Tag Manager, sondern stattdessen direkt über den Cookie Banner geladen. Und zwar das Skript, welches du im oberen Bild unter „Code bei Opt-in ausführen“ siehst. Damit das korrekt funktioniert, musst du den im Bild markierten Toggle Button noch auf aktiviert setzen.
Anschließend klickst du ganz unten auf „Speichern“. Damit haben wir den Service Google Analytics 4 jetzt zu unserem Cookie Banner hinzugefügt.
Dadurch fragen wir jetzt also schonmal über den Cookie Banner die Einwilligung des Nutzers zum Service Google Analytics 4 ab. Und die dort gegebenen oder auch nicht gegebenen Einwilligungen werden dann an den Google Tag Manager übertragen, sodass wir diese dann innerhalb des Google Tag Managers abfragen können.
8.2. Logik im Google Tag Manager einrichten
Alleine mit der Übermittlung der Einwilligungen passiert aber noch nichts. Denn jetzt müssen wir noch die ganze Logik im Google Tag Manager einrichten. Wir hinterlegen also genauer gesagt die Logik dafür, was passieren soll, wenn der Nutzer zu diesem Service Google Analytics eingewilligt hat und was passieren soll, wenn der Nutzer nicht eingewilligt hat.
Wenn der Nutzer die Einwilligung zu Google Analytics 4 gegeben hat, dann möchten wir einen Tag feuern, der das Tracking Skript für Google Analytics auf der Seite lädt. Und wenn der Nutzer nicht eingewilligt hat, soll kein Tracking Skript geladen werden, da wir die Entscheidung des Nutzers ja schließlich akzeptieren wollen und müssen.
Aus diesem Grund wechseln wir für die Umsetzung jetzt in den Google Tag Manager.
Du hast ja bereits gelernt, dass ein Tag einfach nur ein Code Snippet ist, dass vom Google Tag Manager auf unserer Website ausgeführt wird. In unserem Fall wird das ein Google Analytics Code Snippet sein, das dafür sorgt, dass an unsere Google Analytics Property Daten gesendet werden.
Und zwar genau dann, wenn der damit verknüpfte Trigger auslöst. Das heißt, der Trigger definiert die Bedingungen, unter welchen Umständen der mit dem Trigger verbundene Tag ausgelöst werden darf.
Wir erzeugen jetzt also erstmal den Tag, fügen dann einen Trigger hinzu und am Ende erkläre ich dir das alles nochmal Schritt-für-Schritt im Vorschau-Modus, damit du es von der Logik her nochmal leichtverständlich nachvollziehen kannst.
Beginnen wir also mit dem Tag. Wir klicken also auf „Tags“ und dann auf „Neu“. Und hier müssen wir nun einen sogenannten Tag und einen entsprechenden Trigger, der den Tag dann auslöst, hinterlegen.
Wir starten mit der Tag-Konfiguration, in dem wir auf „Tag-Konfiguration“ klicken. Daraufhin öffnet sich jetzt rechts ein Menü und in diesem müssen wir einen sogenannten Tag-Typ auswählen.
Und wie du auf den ersten Blick schon sehen kannst, gibt es jetzt Tag-Typen für unterschiedlichste Tools. Da wir gerade Google Analytics über den Google Tag Manager einrichten, klicken wir auf Google Analytics.
Und dann werden uns alle Tag-Typen angezeigt, die eben für das Tool Google Analytics existieren.
Zum Zeitpunkt der Artikel-Erstellung gibt es hier gegenwärtig vier Stück. Die unteren beiden beziehen sich auf eine ältere Google Analytics Version. Diese sind also komplett irrelevant für uns.
Uns interessieren nur die beiden oberen Tag-Typen, nämlich einmal der „Google Tag“ und einmal der Tag mit dem Namen „Google Analytics: GA4-Ereignis“.
Um Google Analytics auf unserer Website grundlegend aufzusetzen (also das Basis-Setup zu implementieren), was wir ja hier gerade auch machen wollen, benötigen wir jetzt den Google Tag. Wir klicken diesen also an.
Und daraufhin öffnet sich jetzt einfach nur eine Vorlage, in die wir nur noch unsere Mess-ID von unserem Datenstream einfügen müssen.
Wir gehen also wieder auf Google Analytics, klicken auf „Verwaltung > Datenstreams“, wählen den gewünschten Datenstream aus und kopieren rechts oben die Mess-ID in die Zwischenablage.
Und diese Mess-ID müssen wir jetzt nur noch im Feld Tag-ID einfügen:
Und das wars jetzt im Endeffekt auch schon.
In den drei Tabs darunter hat man jetzt noch weitere Einstellungsmöglichkeiten, nämlich für die „Konfigurationseinstellungen“, für die „Gemeinsamen Ereigniseinstellungen“ und für die „Erweiterten Einstellungen“.
Die erweiterten Einstellungen werden wir dann später gleich nochmal benötigen, dazu dann gleich mehr. Die restlichen Einstellungen sind für den Beginn erstmal komplett irrelevant. Sollten wir dann im weiteren Verlauf noch etwas von diesen Einstellungen benötigen, dann kommen wir einfach zurück und ändern das nachträglich. Bis dahin belassen wir das aber bei den Voreinstellungen.
Und damit wären wir jetzt soweit mit dem Google Tag durch. Wir mussten also lediglich die Mess-ID in der Vorlage einfügen und dieser Tag sorgt nun dafür, dass auf unserer Website das Google Analytics Tracking Skript eingebunden wird, welches die Tracking-Daten dann an unsere Google Analytics Property sendet.
An dieser Stelle möchte ich dir jetzt aber noch eine nützliche Sache zeigen. Und zwar haben wir gerade eben im Feld Tag-ID die Google Analytics Mess-ID eingetragen.
Diese Mess-ID identifiziert quasi unseren Google Analytics Account und dadurch weiß der Tag, wo er die gesammelten Daten hin senden soll.
Im weiteren Verlauf deiner Analytics Reise wirst du aber noch zahlreiche weitere Tags anlegen. Und ich kann schonmal vorweg nehmen, dass immer wenn wir etwas an Google Analytics senden möchten, wir erneut die Mess-ID benötigen werden.
Das heißt, wir müssen dann immer wieder in unser Google Analytics Konto, dort in die Datenstream Einstellungen und uns diese Mess-ID erneut kopieren. Das ist aufwendig und nervt.
Und genau deshalb gibt es im Tag Manager auch das Konzept von sogenannten Variablen. So eine Variable kann man sich als eine Art Behälter vorstellen, in welchen man einen Wert speichern kann.
Genau aus diesem Grund werden wir uns jetzt für diese Mess-ID noch direkt eine Variable erstellen und in diese die Mess-ID speichern. Das hat dann den Vorteil, dass immer wenn wir die Mess-ID erneut benötigen, wir einfach nur die Variable einfügen müssen und in dieser ist dann die Mess-ID bereits gespeichert. Damit sparen wir uns also zukünftig viel Arbeit, weshalb wir das jetzt auch direkt umsetzen werden.
Wir löschen jetzt also nochmal die Mess-ID aus dem Google Tag und klicken stattdessen rechts auf diesen „Lego“-Baustein. Das ist im Google Tag Manager nämlich das Symbol für Variablen.
Dadurch öffnet sich jetzt eine Übersicht über alle verfügbaren Variablen. Da wir eine neue Variable anlegen möchten, klicken wir rechts oben auf das Plus-Zeichen.
Daraufhin öffnet sich ein Fenster, in welchem wir nun eine neue Variable konfigurieren können. Und das geht denkbar einfach, indem wir auf „Variable konfigurieren“ klicken.
Daraufhin öffnet sich jetzt ein Menü, in welchem wir den gewünschten Variablen-Typ auswählen müssen. Von diesen Variablen-Typen gibt es ganz viele unterschiedliche, die wir uns ausführlich im Google Tag Manager Expert Training ansehen werden.
Wir benötigen an dieser Stelle jetzt den einfachsten Variablen-Typ, nämlich „Konstant“. Damit können wir nämlich einfach einen konstanten Wert speichern, der immer gleich bleibt.
In der sich daraufhin öffnenden Vorlage müssen wir jetzt einfach nur den Wert eingeben, der in dieser Variable konstant gespeichert werden soll. In diesem Fall ist das die Mess-ID, weshalb wir diese nun im Feld „Wert“ einfügen.
Anschließend müssen wir der Variable noch einen Namen geben. Für dieses Beispiel nenne ich diese „Konstant – GA4 – G-KNREGCFRX2“. Dadurch erkenne ich bereits am Namen auf einen Blick, was der Inhalt der Variable ist.
Sobald man nun auf „Speichern“ klickt, wird die eben erzeugte Variable nun direkt im Feld „Tag-ID“ hinterlegt. Das erkennt man auch der Schreibweise, denn eine Variable startet im Google Tag Manager immer mit zwei geöffneten geschweiften Klammern, dann folgt der Variablename und dann zwei geschlossene geschweifte Klammern.
Solltest du zukünftig also an irgendeiner Stelle beim Google Tag Manager einrichten die Mess-ID deines GA4 Kontos benötigen, so musst du diese nicht mehr manuell einfügen, sondern du kannst fortan einfach die eben erzeugte Variable hinterlegen.
Damit haben wir die Tag-Konfiguration des Google Tags also abgeschlossen. Wir mussten also nur die Mess-ID einfügen.
Als nächstes müssen wir dem Tag einen Namen geben. Ich nenne diesen „GA4 – Config & page_view“. Ich würde dir empfehlen, diesen auch so zu nennen, denn das ist der Grund-Konfigurations-Tag, welcher eben die ganze Grundkonfiguration für uns übernimmt und alle page_views, also Seitenaufrufe, trackt.
Abschließend müssen wir jetzt noch einen Trigger auswählen, der angibt, wann dieser Tag auf unserer Website ausgelöst werden soll. Wir möchten, dass der Tag auf JEDER Unterseite unserer Website auslöst, also auf allen Seiten. Denn wir möchten die Nutzer ja schließlich auf jeder Seite tracken.
Wir klicken also auf das Trigger Feld, wodurch nun eine Liste mit allen bereits durch den Google Tag Manager standardmäßig zur Verfügung gestellten Triggern erscheint. Da wir möchten, dass der Tag auf allen Seiten auslöst, wählen wir den bereits standardmäßig verfügbaren Trigger „All Pages“ aus.
Dieser Trigger löst nämlich auf jeder Seite aus, die man lädt. Im Anschluss daran speichern wir den kompletten Tag noch.
Wiederholen wir an dieser Stelle nochmal kurz, was wir gerade angelegt haben. Wir haben soeben einen Google Tag erzeugt, bei welchem wir die Mess-ID unserer Google Analytics Property hinterlegt haben. Das heißt, der Google Tag Manager baut diesen Tag bei uns auf der Website ein und dann werden dank des Tags Daten an unsere Google Analytics Property gesendet.
Wann löst der Tag aus? Standardmäßig auf allen Seiten, da wir den „All Pages“ Trigger verwenden.
8.3. Consent Aussteuerung im Google Tag Manager einrichten
Wir wären an dieser Stelle schon fertig, wenn da nicht die Thematik mit dem Consent wäre. Denn das Problem an der aktuellen Konfiguration besteht noch darin, dass der Consent, welchen wir über den Cookie Banner einholen, noch zu keiner Sekunde beachtet wird.
Das heißt, egal ob der Nutzer gegenwärtig auf dem Cookie Banner Google Analytics 4 zustimmt oder nicht, Google Analytics wird immer eingebunden. Und zwar auch wenn der Nutzer dem Tracking aktiv widerspricht. Weil wir mit dem Trigger gegenwärtig ja definiert haben, dass dieser Tag einfach ohne weitere Bedingung auf allen Seiten gefeuert werden soll.
Und das wollen wir nicht, denn wir wollen den Consent ja berücksichtigen und korrekt aussteuern. Das bedeutet für uns, dass wir zukünftig bei jedem Tag auch noch zusätzlich die Consent Einstellung hinterlegen müssen. Und dank der Google Consent Mode Integration unseres Cookie Banners geht das super einfach.
Denn wir müssen jetzt lediglich auf den gewünschten Tag gehen, in diesem Fall der eben angelegte „GA4 – Config & page_view Tag“. Dort klicken wir erneut auf „Tag-Konfiguration“. Dann klicken wir auf „Erweiterte Einstellungen“ und da ganz unten auf „Einstellungen zur Nutzereinwilligung“. Und dort klicken wir auf „Zusätzliche Einwilligung zur Auslösung des Tags erforderlich“. Und dann klicken wir noch auf den erscheinenden Button „Erforderliche Einwilligung hinzufügen“.
Und hier müssen wir jetzt den eindeutigen Bezeichner des Google Analytics Services aus dem Cookie Banner hinterlegen.
Diesen Bezeicher findest du im Cookie Banner im Google Analytics Service beim Punkt „Angefragte Einwilligungsarten für Google Consent Mode“ ganz oben ausgegraut dargestellt.
In diesem Fall lautet dieser „google-analytics-analytics-4“. Durch einen Klick kannst du diesen in die Zwischenablage kopieren. Und diesen fügst du nun im Google Tag Manager noch entsprechend ein:
Dann klickst du rechts oben erneut auf „Speichern“ und damit hast du den Tag nun inklusive Consent korrekt konfiguriert.
Wir haben in diesem Abschnitt also soeben Google Analytics 4 über den Google Consent Mode und den Tag Manager auf unserer Seite eingebunden. Und zwar so, dass auch die Einwilligungen der Nutzer, die sie im Cookie Banner treffen, entsprechend beachtet werden.
9. Implementierung über Tag Assistant testen
Wie du bereits gelernt hast, können wir diese Änderungen jetzt über den Vorschau-Modus testen, bevor wir sie live schalten. Damit man auch sicher gehen kann, ob es tatsächlich so funktioniert, wie man sich das vorstellt.
Wichtiger Einschub: Gerade das Testen ist in Textform nur sehr schwer darstellbar. Aus diesem Grund empfehle ich dir, diesen Teil auch nochmal im ganz oben verlinkten Video nachzuvollziehen, da ich darin auf alle Schritte nochmal wesentlich genauer eingehe und es auch visuell Schritt-für-Schritt zeige.
Wir klicken also auf „In Vorschau ansehen“. Damit öffnet sich der Tag Assistant, in welchem wir jetzt die URL unserer Website eingeben müssen, die wir testen möchten. Wir fügen hier also die URL unserer Startseite ein und klicken auf „Connect“.
Daraufhin öffnet sich nun in einem weiteren Tab die Website und wenn wir in den Tab von eben zurückwechseln, so sehen wir, dass die Verbindung mit dem Tag Assistant erfolgreich hergestellt wurde (dies bestätigen wir mit einem Klick auf „Continue“).
Nun können wir die Implementierung detailliert testen. Und zwar einmal mit erteiltem Consent im Cookie Banner und einmal ohne erteilten Consent im Cookie Banner. Um so eben zu prüfen, ob die Aussteuerung des Consents korrekt funktioniert.
Beginnen wir mit dem Fall, dass der Nutzer dem Tracking über den Cookie Banner zugestimmt hat. Wir gehen also auf der Website in die Cookie Banner Einstellungen und sorgen dafür, dass sowohl dem Google Tag Manager als auch dem Google Analytics 4 Tracking zugestimmt ist.
Daraufhin wird im Tag Assistant nun die Seite erneut geladen. Wenn wir nun links im Menü auf das Ereignis „Container Loaded“ klicken, sehen wir rechts daneben, dass der Tag „GA4 – Config & page_view“ erfolgreich gefeuert wurde. Diesen klicken wir nun an, um weitere Detail-Infos zu erhalten:
Und hier sehen wir nun ganz unten, dass der Tag aufgrund von zwei Bedingungen gefeuert wurde. Zum einen hat der „All Pages“ Trigger ausgelöst. Zum anderen ist auch der zusätzliche Consent „google-analytics-analytics-4“ gegeben.
Und das dieser zusätzliche Consent für Google Analytics gegeben ist, sehen wir auch, wenn wir das Fenster nochmal schließen und stattdessen in den Tab „Consent“ wechseln.
Hier sieht man nämlich nun ganz unten, dass der „Current State“ für „google-analytics-analytics-4“ auf „Granted“ gesetzt ist.
Das ist also beim Google Tag Manager einrichten das Geheimnis hinter der Consent Aussteuerung.
Damit haben wir schonmal den Fall der Zustimmung erfolgreich getestet.
Jetzt müssen wir natürlich auch noch den Fall prüfen, was passiert, wenn der Nutzer dem Google Analytics Tracking nicht zustimmt.
Wir öffnen also erneut über den Footer die Einstellungen des Cookie Banners und wählen die Statistik Gruppe und somit auch Google Analytics ab. Damit simulieren wir nun also, dass der Nutzer der Consent für Google Analytics NICHT erteilt.
Und im Tag Assistant siehst du nun beim Ereignis „Container Loaded“, dass der Tag „GA4 – Config & page_view“ korrekterweise NICHT gefeuert wurde.
Da wir jetzt in diesem Vorschau bzw. Debug-Modus validiert haben, dass alles so läuft wie wir uns das vorstellen, können wir die Änderungen nun live schalten. Wir schließen also alle Tabs die den Tag Assistant betreffen und klicken im Google Tag Manager rechts oben auf „Senden“.
Daraufhin geben wir der Version noch einen Namen und hinterlegen bei Bedarf Notizen. Und dann klicken wir auf „Veröffentlichen“. Und damit sin die Änderungen nun auf unserer Website live.
Im nächsten Schritt empfehlen wir immer, auch auf der Live Website nochmal genauer zu prüfen, ob alles so funktioniert, wie es funktionieren soll. Und vor allem auch in Google Analytics via DebugView zu prüfen, ob die Ereignisse auch wie gewünscht ankommen. Das würde den Rahmen dieses Artikels aber sprengen. Wie das alles im Detail funktioniert, lernst du aber natürlich in unseren umfassenden Expert Trainings.
Wir haben in diesem Artikel nun also erfolgreich den Google Tag Manager einrichten können. Genauer gesagt haben wir Google Analytics 4 in der sogenannten Basic Mode Variante korrekt über den Google Tag Manager auf unserer Website eingebunden. Was der sogenannte Basic Mode ist, erfährst du unserem umfassenden Artikel zum Google Consent Mode.
An dieser Stelle kann ich dir nun erstmal gratulieren, denn damit hast du nun ein GA4 Grund-Setup professionell auf deiner Website aufgesetzt.
Um Google Analytics 4 nun zielführend in deinem Unternehmen einzusetzen, musst du es aber unbedingt noch auf dein Unternehmen und deine Anforderungen maßschneidern. In unseren Expert Trainings wird dir dies Schritt-für-Schritt gezeigt. Und falls du nicht die Zeit hast, dich selbst tief in die Tools einzuarbeiten, dann kannst du gerne auch uns kontaktieren, sodass wir die Umsetzung komfortabel für dich übernehmen.
Spare dir Frust, Zeit & unnötige Fehler beim Thema Tracking.
Wir nehmen dir den technisch anspruchsvollsten Part im Online Marketing ab und bauen dir dein schlüsselfertiges Tracking Setup, das sofort perfekt funktioniert.
Im Google Tag Manager Expert Training lernst du, wie du vollkommen flexibel detaillierte Verhaltensdaten deiner Website Besucher erheben und sie anschließend an alle deine Online Marketing Tools senden kannst.
Dadurch kannst du ein auf dein Unternehmen maßgeschneidertes Tracking Setup umsetzen!
*Affiliatelink