Der Tag Manager von Google ist eine sehr gute Lösung, um die Integration von Tracking-Pixeln auf der eigenen Webseite umzusetzen. In diesem Artikel möchte ich zeigen, wie der Tag Manager eingerichtet und darüber der Google Analytics Trackingcode in die Webseite migriert wird.
Anwendungsbeispiele für Google Tag Manager
Über den Tag Manager kann das Webseite-Tracking umgesetzt werden. Dabei ist es egal, ob Piwik oder Google Analytics oder eine andere Software zum Tracking eingesetzt werden soll. Es können aber auch das Conversion Tracking, Remarketing, der Facebook-Pixel und viele weitere Codes schnell und einfach in die Webseite integriert werden.
Der von mir favorisierte Anwendungsfall ist das Event-Tracking, welches mit dem Tag Manager sehr einfach umgesetzt werden kann. Ich möchte in vielen Fällen wissen, ob User einen bestimmten Button geklickt haben. Früher musste ich dafür immer einen onclick-Code in das HTML des Buttons setzen. Das geht mit dem Google Tag Manager allerdings sehr viel einfacher.
Google Tag Manager Konto einrichten
Der Tag Manager ist ein kostenloses Tool von Google. Zur Nutzung des Tag Managers ist lediglich ein vorhandenes Google-Konto notwendig.
Im Setup-Prozess wird zwischen „Konto“ und „Container“ unterschieden. Das Konto ist übergeordnet, hier kann man z.B. seinen Namen oder Firmennamen eintragen. Die Projektebene heisst „Container“. Ein Konto kann mehrere Container beinhalten, die man sich als Ordner vorstellen kann. Wenn man mehrere Webseiten verwaltet, dann könnte man für jedes Webprojekt einen eigenen Container anlegen.
Von daher macht es Sinn, als Containernamen den Namen der Webseite oder die Webseiten-URL zu wählen. Außerdem muss ausgewählt werden, ob man eine Webseite, eine iOS oder eine Android-App oder eine AMP-Page tracken möchte.
Im nächsten Schritt erhält man zwei JavaScript-Codes, die in die Webseite (oder App) einzubinden sind.
- Den ersten Code im < head > einfügen: Diesen Code sollte man sehr weit oben im Source-Code einfügen. Am besten man kopiert ihn in die header.php
- Den zweiten Code im < body > einfügen: Diesen Code im Content-Bereich einfügen, z.B. in der footer.php
Ein Tipp: in vielen WordPress-Themes gibt es Möglichkeiten (z.B. in den Theme-Options), Code direkt im Header und Footer zu plazieren. Hier spart ihr Euch dann den manuellen Eingriff in die entsprechenden php-Dateien. Wenn Euer Theme diese Option nicht mitbringt und ihr nicht direkt im Code arbeiten möchtet, dann kann ich das Plugin „Insert Headers and Footers“ empfehlen.
Nun ist der Google Tag Manager im Source-Code der Webseite verankert. Alle weiteren Schritte können im Tag Manager vorgenommen werden. Der Webseite-Code muss nicht mehr angefasst werden.
Google Analytics in den Tag Manager integrieren
Die Integration von Googe Analytics ist der häufigste Anwendungsfall bei der Tag Manager Konfiguration. Im folgenden gehe ich davon aus, dass bereits ein Google Analytics-Konto existiert.
- Zunächst ist im Tag Manager der „Arbeitsbereich“ auszuwählen
- Dann auf den Punkt „Variablen“ klicken
- Und mit der Schaltfläche „Neu“ eine „Benutzerdefinierte Variable“ hinzufügen
- Bei „Variable Konfigurieren“, einfach nur reinklicken
Es öffnet sich ein Auswahlmenü, über das der Variablentyp gesucht werden kann. Hier etwas nach unten scrollen und unter „Dienstprogrammen“ nach den „Google Analytics Einstellungen“ suchen.
An dieser Stelle benötigen wir die ID unserer Google Analytics-Property. Dafür in den Google Analytics Account wechseln. Dort in den Bereich „Verwaltung“ gehen und unter „Tracking Informationen“ die „Tracking-ID“ suchen. Dieese fängt mit UA-……. an.
Nun arbeiten wir weiter im Google Tag Manager. Im Bereich der Variablen-Konfiguration muss die Tracking-ID eingegeben werden (vollständig, also mit UA) und weil wir nach den Regeln der Datenschutzgrundverordnung auch keine IP-Adressen an den Google-Server übermitteln wollen, müssen wir noch die IP-Anonymisierung aktivieren. Dazu in dem Formular unten auf „Weitere Einstellungen“ klicken. Dann „Festzulegende Felder“ und dort im Dropdown „anonymizeip“ auswählen. Nun noch unter „Wert“ das Wort „true“ eingeben und dann rechts oben auf den blauen Button „Speichern“ Jetzt kann die Variable in allen Tags verwendet werden.
An der Stelle sind wir dann mit der Einrichtung fast fertig! So müsste es jetzt bei Euch aussehen
Jetzt müssen wir in den Bereich „Tags“ wechseln und ein neues Tag hinzufügen.
Für jedes Tag gibt es zwei Abschnitte
- Tag-Konfiguration: Was für ein Tag soll abgefeuert werden?
- Trigger: Welches Ereignis soll das Tag triggern?
Zuerst klicken wir auf die „Tag-Konfiguration“ und wählen als Tag-Typ „Google Analytics: Universal Analytics“ aus. Die Konfiguration hat dann schon den Tracking-Typ „Seitenaufruf“ voreingestellt. Wir müssen dann aber noch in dem Dropdown unter den „Google Analytics-Einstellungen“ die eben angelegte Variable auswählen. Ich habe diese ebenfalls „Google Analytics-Einstellungen“ genannt.
Dann im zweiten Schritt auf das Feld „Trigger“ darunter klicken und „All Pages“ auswählen. Das bedeutet, dass jeder Seitenaufruf den Google Analytics-Tag auslösen soll.
Nachdem das Tag und der Trigger konfiguriert wurde, müssen die Änderungen noch an das Projekt gesendet werden. Dafür oben rechts den blauen Button „Senden“ betätigen.
Jetzt sollten unten die „Änderungen im Arbeitsbereich“ vom Typ „Tag“ und vom Typ „Variable“ zu sehen sein. Diese müssen nun noch „Veröffentlicht“ werden. Dafür wieder oben rechts den blauen Button „Veröffentlichen“ klicken.
Fertig! Nun wird der Google Analytics Code bei jedem Webaufruf abgefeuert und die Ergebnise sollten in Google Analytics selbst zu sehen sein. Testen kann man dies z.B. über den Bereich „Echtzeit“ innerhalb von Google Analytics oder über den Tag Manager selbst.
Implementierung testen
Dafür den „Arbeitsbereich“ aufrufen und „In Vorschau ansehen“ anklicken.
Nun die Webseite aufrufen, bei der die Google Analytics Integration überprüft werden soll. Ggf. mit „F5“ die Seite nochmal neu laden. Unterhalb der Webseite öffnet sich jetzt ein weiterer sichtbarer Bereich, in dem der Tag Manager eine Einblendung macht. Unter „Tags fired on this Page“ sollte der Google Analytics Tag zu sehen sein.
Nach dem durchgeführten Test die Vorschau unbedingt wieder beenden -> „Vorschaumodus beenden“.
Nun ist der Google Tag Manager eingerichtet und das Google Analytics Tracking darüber umgesetzt. Wer jetzt zum Beispiel noch ein Event- oder Ereignistracking umsetzen möchte, kann dies tun ohne in den Code der Webseite eingreifen zu müssen. Im folgenden Artikel habe ich das Tracking von ausgehenden Links im Zusammenspiel von Google Tag Manager und Google Analytics näher erläutert.
