Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Google Tag Manager Advanced - SEOCampixx 2016

1.497 Aufrufe

Veröffentlicht am

Der Vortrag "Google Tag Manager Advanced" auf der SEOCampixx 2016 von Jan Berens und Thomas Czernik.

Veröffentlicht in: Internet
  • Als Erste(r) kommentieren

Google Tag Manager Advanced - SEOCampixx 2016

  1. 1. Google Tag Manager Advanced Jan Berens / Thomas Czernik
  2. 2. 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
  3. 3. Thomas Czernik ➔pixelart GmbH ➔Online Marketing Manager ➔@mindbreak | wrel.de | tom@wrel.de
  4. 4. Inhalt ➔ Häufige Fehler mit dem GTM ➔ Best Practice Setup GTM ➔ Google Event Tracking Advanced ➔ GTM Hacks
  5. 5. Häufige GTM Fehler • Aktivieren bei… / Auslösen bei… • Vorschau Reloading • dataLayer Initialisierung
  6. 6. Aktivieren bei… / Auslösen bei…
  7. 7. 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.
  8. 8. Aktivieren bei… / Auslösen bei… Hier soll mein Trigger aktiviert werden. Hier soll mein Trigger ausgelöst werden.
  9. 9. Vorschau Reloading  Vorschau Modus aktiviert  Änderungen durchgeführt  Änderungen werden nicht in der Debug Console angezeigt?
  10. 10. dataLayer Initialisierung <body> dataLayer GTM Code Quelle: https://developers.google.com/tag-manager/devguide </body>
  11. 11. 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
  12. 12. dataLayer GTM Code dataLayer Initialisierung <body> </body>
  13. 13. 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
  14. 14. dataLayer Initialisierung GTM Code Google Tag Manager ist unbrauchbar
  15. 15. 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
  16. 16. 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
  17. 17. Best Practice • Naming Convention • Ordner • Cleanup • Environments
  18. 18. Naming Convention
  19. 19. Naming Convention
  20. 20. Naming Convention • Ab 20 Tags ist es schwer den Überblick zu bewahren • Naming Conventions bei den Tags, Triggers und Variablen • Englisch
  21. 21. Naming Convention - Tag Wer Was Wo Tool / Service PDF Download Verkauf Dankesseite
  22. 22. Naming Convention - Tag Wer Was Wo GA - Pageview - All Pages GA - PDF Download - on PDF click GA ET - ecommerce transaction - thank you page
  23. 23. Naming Convention - Variablen Selbsterklärende Variablenbezeichnung GA Tracking Code Login Status ...
  24. 24. Cleanup Gleiche Tags / Triggers Variablen in Ordner gruppieren Unbenutzte Trigger löschen
  25. 25. Cleanup Ungenutzte Variablen deaktiveren / löschen Wie kann ich das testen?
  26. 26. Versionen
  27. 27. 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
  28. 28. Versionen
  29. 29. Environments • Verschiedene Umgebungen: Development, Staging, Live • Mehrere Änderungen können veröffentlicht werden • Vorschaulink für QA oder PMs • Zugriffskontrolle • “Umgebungsspezifische” Einstellungen
  30. 30. Environments - Setup
  31. 31. Environments - Setup
  32. 32. Environments Version 1 Version 3 Version 2 LIVE Development LIVE
  33. 33. Environment - Unterschiedliche GA Codes
  34. 34. Environment - Unterschiedliche GA Codes
  35. 35. Tracking Outbound Links als Google Analytics Event
  36. 36. Neue Variable „ElementDomain“ anlegen
  37. 37. Trigger einrichten
  38. 38. Trigger auf allen URLs aktivieren
  39. 39. Trigger fertig einrichten
  40. 40. Google Analytics Event Tag anlegen
  41. 41. Event Kategorie / Aktion / Label festlegen
  42. 42. Trigger und Tag zusammenführen
  43. 43. Tracking mailto Links als Google Analytics Event
  44. 44. Trigger anlegen
  45. 45. Google Analytics Event Tag anlegen
  46. 46. Event Kategorie / Aktion / Label festlegen
  47. 47. Trigger und Tag zusammenführen
  48. 48. Tracking File Downloads als Google Analytics Event
  49. 49. JavaScript Variable anlegen
  50. 50. JavaScript Code function() { return {{Click URL}}.split(".").pop(); }
  51. 51. Trigger anlegen
  52. 52. Google Analytics Event Tag anlegen
  53. 53. Event Kategorie / Aktion / Label festlegen
  54. 54. Trigger und Tag zusammenführen
  55. 55. GTM Hack: Facebook Targeting an Adwords
  56. 56. 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
  57. 57. im Google Adwords Konto ➔ Adwords Remarketinglisten analog zu FB Audiences ➔ Parameter für GTM kopieren ➔ Conversion-ID ➔ Conversion-Label
  58. 58. Variable anlegen
  59. 59. Suchanfrageschlüssel = URL Parameter
  60. 60. Trigger erstellen
  61. 61. Tag anlegen
  62. 62. Trigger und Tag zusammenführen
  63. 63. GTM Hack: Tracking- / Cookie-Weiche
  64. 64. Trigger „Landingpage Tag“ anlegen
  65. 65. „Landingpage Tag“ anlegen
  66. 66. 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; } }
  67. 67. 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>
  68. 68. Trigger und Tag zusammenführen
  69. 69. First-Party-Cookie Variable erstellen
  70. 70. Trigger „Conversion Tag“ anlegen
  71. 71. „Conversion Tag“ erstellen
  72. 72. Trigger und Tag zusammenführen
  73. 73. 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>
  74. 74. Herzlichen Dank für Eure Aufmerksamkeit!

×