Einrichten des GoogleTagManagers


Zum Hintergrund: seit kurzem verwenden wir den GoogleTagManager(GTM) bei den Hörnerdörfern. Ziel ist es die diversen Analytics Accounts die hier verwendet werden (Bolsterlang, Fischen etc.) unter einen Hut zu bringen. Hierzu kann man im Tagmanager Profil Regeln und Tags erstellen, anhand derer das Tracking dann ausgeführt wird (dazu später mehr).

Ermöglicht  wird das Ganze über Einbindung eines GTM-Containers im Code, der den sehr ähnlichen GA-Code ersetzt. Der Container sorgt dafür, dass das ‚gmt.js‘ eingebunden wird, welches dafür sorgt, dass die konfigurierten Tags und Regeln vom Browser erkannt werden.

Das Zusammenspiel von Tags und Regeln ist denkbar simpel: solange die Regeln eingehalten werden, werden entsprechend Tags eingebunden, oder eben nicht. Als Tags werden in unserem Fall Google Analytics Ids hinterlegt (Wichtig: Beim anlegen im Tag Manager daran denken unter „weitere Einstellungen->Grundkonfiguration“ das Häkchen bei „IP-Adresse anonymisieren“ zu setzen).

Damit die tags dann auch da ausgespielt werden wo sie sollen, müssen Regeln definiert werden. z.B. soll bei den Hörnerdörfern der Tag der das GA-Tracking für „www.fischen.de“  enthält natürlich nur unter den Seiten ausgespielt werden die auch zu fischen gehören. Um das zu erreichen hinterlegen wir Regeln nach folgendem Schema: „URL enthält ‚://www.fischen.de‘ „. Alles was wir hierfür tun müssen, ist eine Neue Regel zu erstellen, im Dropdown „URL“ und „enthält“ auszuwählen und dann die Regel dem entsprechendem Tag zuweisen.

Um das Ganze zu testen müssen wir unseren googleTag jetzt noch veröffentlichen, dann kann man im Chrome beim Aufruf der gewünschten Seite(aktualisieren mit strg +F5) mit den Developertools (öffnen mit F12) zu Sources navigieren, wo nun „www.googletagmanager.com“ zur Auswahl stehen sollte. Darunter liegt das gmt.js, das alle Informationen enthalten sollte, die wir soeben angelegt haben (Regeln und Tags), wenn nicht haben wir was falsch gemacht. Interessierte können sich also das gmt.js kopieren und der Übersicht halber z.B. in notepad++ einfügen. Dort dann einfach nach der Analytics Id suchen, so kommt man zu den Regeln und Tags. (es treten hier alle GA-Ids auf die mit dem Account verknüpft sind, allerdings sorgen die hinterlegten Regeln dafür, dass immer nur die Erwünschten ausgelesen werden).

 

 

Kommentare

Selber kommentieren:






Weitere Beiträge zum Thema Technologie


OOP 2014 – Martin Fowler: „Not just code monkeys“

Autor*in: Marc Kurzmann


Technologie // Über den Tellerrand


Ein Thema, welches mir persönlich sehr am Herzen liegt: jeder sollte sich seiner sozialen/ethischen Verantwortung bewusst sein. Dazu passt der Vortrag von Martin Fowler auf der OOP 2014. „Einer der Keynote-Speaker war Martin Fowler. Er hielt einen eindrucksvollen Vortrag, in dem er auch auf die soziale Verantwortung von Software-Entwicklern einging. Seine Botschaft „Not just code …


Beitrag lesen
10
FEB
14

WebKit Sibling Bug

Autor*in: Benjamin Hofmann


Technologie // User Experience & Design


Bei kleineren Anpassungen in einem unserer Projekte ist heute im alten Standard-Browser von Android ein Bug[1] aufgefallen, der dazu führte, dass die Listenelemente mit initial verstecktem Inhalt diesen beim Anklicken nicht anzeigten. Nach einer kurzen Recherche bin ich hier auch auf die Lösung gestoßen, den Checkbox Hack on Mobile Webkit[2]. Klingt fies, ist aber nur …


Beitrag lesen
13
MRZ
15

lory

Autor*in: Benjamin Hofmann


Technologie // User Experience & Design


Und schon wieder habe ich eine kleine schöne Javascript-Library gefunden: lory. Diesmal ist es keine Lightbox-Lösung wie PhotoSwipe gestern, sondern ein simpler Slider. Auch dieses Skript ist auf den mobilen Anwendungsfall ausgelegt und kann von Haus aus mit Swipes umgehen. Auch das sogenannte Infinite-Sliding ist möglich und auch dieses Skript lässt sich über RequireJS nutzen …


Beitrag lesen
23
SEP
16

JavaScript, HTML5 & Angular Days 2016

Autor*in:


Technologie // Über den Tellerrand // User Experience & Design


Einige von uns Portalentwicklern waren im Oktober in Berlin auf den JavaScript, HTML5 & Angular Days 2016. Hier nachträglich noch kurz meine und Bennis Highlights: „Dem Benedikt seine Highlights“ CSS3 Flexbox Der Style „display: flex;“ ist ein unglaublich flexibles und simples Werkzeug, um Responsivität in die kleinsten Module zu bringen. Wo wir heute noch mit Style-Hacks arbeiten, …


Beitrag lesen
28
NOV
16