google tag manager advanced - seocampixx 2016
TRANSCRIPT
Google Tag Manager AdvancedJan Berens / Thomas Czernik
Jan Berens
➔ Administrator Tracking & Webanalyse
➔ bei der Parfümerie Douglas GmbH in Köln
➔ Freizeit - SEO, - Affiliate, - Techie
➔ bloggt ein bisschen auf www.janberens.de
➔ über Web Tech- , SEO- , Tracking- und Affiliate- Zeugs
Thomas Czernik
➔ pixelart GmbH
➔ Online Marketing Manager
➔ @mindbreak | wrel.de | [email protected]
Inhalt
➔ Häufige Fehler mit dem GTM➔ Best Practice Setup GTM➔ Google Event Tracking Advanced➔ GTM Hacks
Häufige GTM Fehler
• Aktivieren bei… / Auslösen bei…• Vorschau Reloading• dataLayer Initialisierung
Aktivieren bei… / Auslösen bei…
Aktivieren bei… Auslösen bei…
Wann soll der Trigger aktiviert werden bzw. wann soll der EventListener aktiviert werden.
Bei welcher Aktion soll mein Trigger ausgelöst werden.
Aktivieren bei… / Auslösen bei…
Hier soll mein Trigger aktiviert werden.
Hier soll mein Trigger ausgelöst werden.
Vorschau Reloading
Vorschau Modus aktiviertÄnderungen durchgeführtÄnderungen werden nicht in der Debug Console
angezeigt?
dataLayer Initialisierung
<body>
dataLayer
GTM Code
Quelle: https://developers.google.com/tag-manager/devguide
</body>
dataLayer Initialisierung
GTM Code
Quelle: https://developers.google.com/tag-manager/devguide
<body> <script> dataLayer = [{
'loggedin': 'true' }];</script>
<!-- Google Tag Manager --><noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-577WGR"height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><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='//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-577WGR');</script><!-- End Google Tag Manager -->
</body>
dataLayer
dataLayer
GTM Code
dataLayer Initialisierung
<body>
</body>
dataLayer Initialisierung
GTM Code
<body> <script>
<!-- Google Tag Manager --><noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-577WGR"height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><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='//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-577WGR');</script><!-- End Google Tag Manager --> dataLayer = [{
'loggedin': 'true' }];</script>
</body>
dataLayer
● Tag Manager initialisiert dataLayer Variable
● GTM initialisiert diverse EventListener für den dataLayer
● dataLayer wird neu gesetzt
dataLayer Initialisierung
GTM Code
Google Tag Manager ist unbrauchbar
dataLayer.push
GTM Code
<body> <script>
<!-- Google Tag Manager --><noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-577WGR"height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><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='//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-577WGR');</script><!-- End Google Tag Manager --> dataLayer.push({
‘event': 'emailClick' });</script>
</body>
dataLayer
dataLayer.push
<body> <script>
<!-- Google Tag Manager --><noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-577WGR"height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><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='//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-577WGR');</script><!-- End Google Tag Manager → window.dataLayer = window.dataLayer || [];dataLayer.push({
‘event': 'emailClick' });</script>
</body>
dataLayer
Noch besser
Best Practice
• Naming Convention• Ordner• Cleanup• Environments
Naming Convention
Naming Convention
Naming Convention
• Ab 20 Tags ist es schwer den Überblick zu bewahren
• Naming Conventions bei den Tags, Triggers und Variablen
• Englisch
Naming Convention - Tag
Wer Was Wo
Tool / Service PDF DownloadVerkauf
Dankesseite
Naming Convention - Tag
Wer Was Wo
GA - Pageview - All PagesGA - PDF Download - on PDF click
GA ET - ecommerce transaction - thank you page
Naming Convention - Variablen
Selbsterklärende VariablenbezeichnungGA Tracking CodeLogin Status...
Cleanup
Gleiche Tags / Triggers Variablen in Ordner gruppieren
Unbenutzte Trigger löschen
Cleanup
Ungenutzte Variablen deaktiveren / löschen
Wie kann ich das testen?
Versionen
Versionen
• Was wurde bei welcher Version geändert?• Bei mehreren Bearbeitern ⇒ kaum Überblick• Wann wurde was online gestellt?
Keine Veröffentlichung ohne Umbenennung und Notiz
Versionen
Environments
• Verschiedene Umgebungen: Development, Staging, Live
• Mehrere Änderungen können veröffentlicht werden
• Vorschaulink für QA oder PMs
• Zugriffskontrolle
• “Umgebungsspezifische” Einstellungen
Environments - Setup
Environments - Setup
Environments
Version 1
Version 3
Version 2
LIVE
Development
LIVE
Environment - Unterschiedliche GA Codes
Environment - Unterschiedliche GA Codes
Tracking Outbound Links
als Google Analytics Event
Neue Variable „ElementDomain“ anlegen
Trigger einrichten
Trigger auf allen URLs aktivieren
Trigger fertig einrichten
Google Analytics Event Tag anlegen
Event Kategorie / Aktion / Label festlegen
Trigger und Tag zusammenführen
Tracking mailto Links
als Google Analytics Event
Trigger anlegen
Google Analytics Event Tag anlegen
Event Kategorie / Aktion / Label festlegen
Trigger und Tag zusammenführen
Tracking File Downloads
als Google Analytics Event
JavaScript Variable anlegen
JavaScript Code
function() {return {{Click URL}}.split(".").pop();
}
Trigger anlegen
Google Analytics Event Tag anlegen
Event Kategorie / Aktion / Label festlegen
Trigger und Tag zusammenführen
GTM Hack: Facebook Targeting an Adwords
im Facebook Ad Manager / Powereditor
➔ FB Targeting erstellen➔ z.B.: nur Männer, im Alter 18 – 35, Interesse
Porsche 911➔ Parameter an Landingpage URL hängen➔ z.B.: fbtarget=m1835porsche911
im Google Adwords Konto
➔ Adwords Remarketinglisten analog zu FB Audiences
➔ Parameter für GTM kopieren➔ Conversion-ID➔ Conversion-Label
Variable anlegen
Suchanfrageschlüssel = URL Parameter
Trigger erstellen
Tag anlegen
Trigger und Tag zusammenführen
GTM Hack: Tracking- / Cookie-Weiche
Trigger „Landingpage Tag“ anlegen
„Landingpage Tag“ anlegen
JavaScript Code – Teil 1
<script language="javascript" type="text/javascript"> var query = window.location.search.substring(1); var vars = query.split("&"); for (var i=0;i<vars.length;i++) { var pair = vars[i].split("="); if(pair[0] == "saleschannelid") { var d = new Date(); d.setTime(d.getTime() + (30*24*60*60*1000)); var expires = "expires="+d.toUTCString(); document.cookie = "saleschannel=" + pair[1] + "; path=/; " + expires; } }
JavaScript Code – Teil 2
if(typeof pair[1] == "undefined") { var ref = document.referrer.split('/')[2]; if (ref == "www.google.de" || ref == "www.bing.com" || ref == "r.search.yahoo.com") { var d = new Date(); d.setTime(d.getTime() + (30*24*60*60*1000)); var expires = "expires="+d.toUTCString(); document.cookie = "saleschannel=seo; path=/; " + expires; } }</script>
Trigger und Tag zusammenführen
First-Party-Cookie Variable erstellen
Trigger „Conversion Tag“ anlegen
„Conversion Tag“ erstellen
Trigger und Tag zusammenführen
Cookie löschen für eine One-Time Conversion
<script language="javascript" type="text/javascript"> var d = new Date(); d.setTime(d.getTime() + (1000)); var expires = "expires="+d.toUTCString(); document.cookie = "saleschannel=delete; path=/; " + expires; </script>
Herzlichen Dank für Eure Aufmerksamkeit!