Einbau Analyse & Tracking Tools (Hotjar, Facebook, Matomo, Oribi…) mit dem Google Tag Manager

Das Matomo, Oribi, Hotjar, Facebook-, LinkedIn-, Xing-, Taboola-, Outbrain- oder Twitter-Pixel lässt sich sehr leicht über den Google Tag Manager implementieren. 

Für einige Pixel gibt es bereits vorgefertigte Templates, die eine besonders leichte Implementierung ermöglichen.

In diesem Beitrag erfährst du wie du diese Tools am besten implementierst, worauf du achten musst und wie du auch alle anderen Pixel oder Tools einfach & Datenschutzkonform einbauen kannst.

Tags, Trigger & Variablen sagen dir nichts? Dann klicke hier und lerne die Grundlagen im GTM

Inhaltsverzeichnis

Autor | René van Loock

Digital Analyst und TÜV-Nord Zertifizierter Datenschutzbeauftragter. Seit mehr als 3 Jahren beschäftige ich mich täglich mit dem Google Tag Manager.

  • TÜV Nord Zertifizierter Datenschutzbeauftragter
  • Marketing Data Analyst
Linkedin Xing

Hotjar mit dem Google Tag Manager [Beispiel]

Hotjar ist ein Analysedienst, der es ermöglicht Heatmaps und Video Recordings von Nutzern zu erstellen. Dazu verwendet Hotjar ein kleines Tracking-Snippet. Ähnlich dem von Google Analytics.

Für Hotjar gibt es auch ein vordefiniertes Tag-Template. Dort muss nur noch die Hotjar Side-ID eingetragen werden. Da wir am Beispiel von Hotjar zeigen möchten, wie im Google Tag Manager Pixel hinzugefügt werden können, verwenden wir ein Benutzerdefiniertes Template.

 

Hotjar Tracking Code

Den Hotjar Code einem Tag hinzufügen

Den Hotjar Tracking Code kopieren und im Tag Manager unter: Tags -> Neu -> Benutzerdefiniertes HTML -> einfügen:

Dem Tag einen Trigger zuweisen

Über den Trigger wird bestimmt, wann und wo auf einer Seite der Tag auslöst. Das kann zum Beispiel auf allen Seiten sein. Dann kann der „All Pages“ Trigger verwendet werden. Häufig soll nur eine Seite oder eine Reihe von Seiten (zum Beispiel Landingpages der Kampagnen) gemessen werden. Grob gesagt gibt es meist diese drei Trigger-Arten:

  • Auf allen Seiten -> Standard „All Pages“ Trigger verwenden
  • Auf spezifischen Seiten -> Spezifischen Seitenaufruf Trigger verwenden
  • Erst wenn der Nutzer seine Einwilligung gegeben hat.
 

Auf allen Seiten: Standard „All Pages“ Trigger verwenden

Soll Hotjar auf allen Seiten ausgelöst werden, kann der Standard „All Pages“ (Alle Seitenaufrufe) Trigger verwendet werden. Häufig wird auch beim Auslösen eines Tags vom Feuern eines Tags gesprochen.

Der All Pages Trigger ist in jedem GTM-Container bereits erstellt und kann einem Tag direkt hinzugefügt werden.

Nur auf Spezifischen Seiten Implementieren

Soll Hotjar nur auf spezifischen Seiten installiert werden, muss ein separater Trigger erstellt werden. Dazu verwenden wir einen benutzerdefinierten „Seitenaufruf“ Trigger.

Unter Trigger -> Neu -> Seitenaufruf

Dann den Seitenaufruf Trigger an eure Anforderungen anpassen. Zum Beispiel nur auf der „/marketing-landingpage-1/“:

Das Tag löst jetzt nur noch aus, wenn der Seitenpfad (Page Path) „/marketing-landingpage-1/“ enthält.

Der Tag soll auf mehreren Seiten ausgelöst werden?

Ihr könnt entweder mehrere Trigger erstellen, denn das Hinzufügen mehrerer Trigger zu einem Tag interpretiert der Google Tag Manager immer als ODER Verknüpfung.

ODER Ihr nutzt in einem Trigger Reguläre Ausdrücke. Einen Beitrag zu Regulären Ausdrücken findet Ihr hier: LINK REGEX GUIDE. Wer häufiger in Analytics Tools zuhause ist, spart mit Regulären Ausdrücken eine Menge Zeit.

Tracking nur mit Einwilligung [DSGVO]

Ihr möchtet Hotjar nur bei vorhandener Einwilligung ausspielen? Mithilfe des Google Tag Managers kein Problem. Für die meisten CMP (Consent Management Platform) – Tools gibt es vorgefertigte Google Tag Manager Templates. Zum Beispiel bei Cookie Bot wie in diesem Beispiel.

Das Prinzip ist jedoch immer ähnlich: Es gibt eine Variable (meist ein Cookie) welches die Einwilligung und die Art der Einwilligung speichert. Bei Cookiebot wird zum Beispiel ein Cookie mit dem Namen „Cookie Consent“ erstellt. Dieses Cookie wird dann bei Klick auf Akzeptieren oder Cookie Einstellungen speichern erstellt und im Browser gespeichert.

Cookie gespeichert im Browser

In diesem Fall hat der Nutzer seine Zustimmung zu Preferences(=true) und Statistics(=true) gegeben. Nicht jedoch zu Marketing(=false).

Der Wert eines Cookies kann über den Google Tag Manager einfach als Variable ausgelesen werden.

Unter Variable -> Benutzerdefinierte Variablen -> Neu -> Variable konfigurieren -> First Party Cookie auswählen. Im Feld Cookie-Name jetzt den Namen des Cookies eintragen. Das Feld muss zu 100% übereinstimmen.

Das war´s schon. Die Variable hat jetzt den Wert des Cookies. Jetzt benötigt Ihr nur noch den richtigen Auslöser.

In diesem Fall empfehle ich zwei Auslöser zu verwenden.

Einmal, wenn der Nutzer eingewilligt hat über ein Benutzerdefiniertes Ereignis oder wenn der Nutzer die Seite besucht und das Cookie bereits vorhanden ist.

Denn beim ersten Besuch hat der Nutzer die Seite bereits aufgerufen (der Pageview wurde bereits ausgelöst) aber der Nutzer hat noch nicht zugestimmt.

Ein Benutzerdefiniertes Ereignis ist bei den gängigen CMP Lösungen meist implementiert und wird ausgelöst, wenn der Nutzer seine Einwilligung oder Ablehnung gegeben hat.

Bei der Nutzung mit Cookiebot sieht das zum Beispiel so aus:

Cookiebot gibt ein Event aus: cookie_consent_statistics, welches wir als Auslöser für unseren Hotjar Tag verwenden können.

Trigger Einwilligung enthält "statistics"

Jetzt nur noch den zweiten Trigger hinzufügen. Seitenaufruf enthält statistics.

Beide Trigger dem Tag hinzufügen

 Wichtig: Damit das Tag nur einmal pro Seitenaufruf gefeuert wird.  Die Optionen für Tag Auslösung auf „Einmal pro Seite“ stellen.

Einbau des Facebook Pixels [GTM - Beispiel]

Der Einbau des Facebook Pixels über den Google Tag Manager ist bei nahezu jedem Unternehmen gefragt, welches auf Facebook Werbung schaltet.

Schon über den Standard-Pixel könnt Ihr innerhalb von Facebook sehen, welche Seiten besucht wurden. Außerdem könnt Ihr Custom- und Lookalike Audiences erstellen und diese innerhalb von Facebook Business Manager nutzen.

Habt Ihr das Pixel schon? Super. Ansonsten könnt Ihr in eurem Business Manager unter Unternehmenseinstellungen -> Datenquellen -> Pixel ein neues Pixel hinzufügen oder den bestehenden Code aufrufen.

Achtet darauf, dass Ihr das Pixel manuell per HTML einfügt. Dann kommt Ihr zum Code:

Du benutzt WordPress, Shopify, Wix oder ein anderes System in das sich das Facebook Pixel direkt per Plugin integrieren lässt. 

Warum solltest du kein Plugin verwenden?

Ein Plugin ermöglicht dir meist keine granulare Steuerung, wann der Pixel oder die jeweiligen Events ausgelöst werden sollen. Zum Beispiel nur wenn der Nutzer seine Zustimmung gegeben hat. Diese Zustimmung muss aber bei jedem Event (Pageview, Warenkorb hinzugefügt, Kontakt, Kauf) im Moment des Seitenbesuchs in einer Variablen gespeichert sein. Da die meisten Plugins diese Funktionalität nicht bieten, bleibt nur der Einbau direkt in die Seite oder über den Tag-Manager. Wobei der Tag Manager den Einbau vereinfacht, die Übersichtlichkeit wahrt und zu einer besseren Seitenladezeit führt.

Der Standard Facebook Pixel Code sieht so aus:

<!-- Facebook Pixel Code -->
<script>
  !function(f,b,e,v,n,t,s)
  {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
  n.callMethod.apply(n,arguments):n.queue.push(arguments)};
  if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
  n.queue=[];t=b.createElement(e);t.async=!0;
  t.src=v;s=b.getElementsByTagName(e)[0];
  s.parentNode.insertBefore(t,s)}(window, document,'script',
  'https://connect.facebook.net/en_US/fbevents.js');
  fbq('init', '263406804971811');
  fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
  src="https://www.facebook.com/tr?id=263406804971811&ev=PageView&noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->

Dieser besteht eigentlich aus zwei Skripten. Einmal der erste Part, der mit </script> endet und einmal der zweite Part der mit </noscript> endet. Der <noscript> Part dient nur dazu um Nutzer mit deaktiviertem JavaScript zu tracken. Sinn dahinter ist es die maximale Anzahl an Besuchern zu erfassen. Da fast alle Webseiten nicht mehr ohne JavaScript auskommen, können wir jedoch davon ausgehen, dass bei den meisten Nutzern JavaScript aktiviert ist. Im Test konnten wir keine Unterschiede zwischen dem Einbau vom <noscript> und dem Fehlen des Skripts erkennen.

Empfehlung: Den </noscript> Part weglassen.

1. Facebook Pixel in einem GTM-Tag hinzufügen

Zum Einbau des Facebook Pixel Codes können wir im Google Tag Manager das Tag mit dem Namen „Benutzerdefiniertes HTML“ verwenden.  Unter Tags -> Neu -> Tag Konfiguration -> Benutzerdefiniertes HTML. Hier den <script> Part des Facebook Pixels hinzufügen.

2. Den richtigen Trigger auswählen

Mit dem Trigger bestimmt Ihr, wann und wo auf eurer Webseite das Facebook Pixel ausgespielt werden soll. Möchtet Ihr alle Seiten messen? Dann könnt Ihr den All Pages Trigger verwenden. Vielleicht möchtet Ihr aber auch nur eine Bestimmte Seite messen? Dann kann unter: Trigger -> Neu – > Seitenaufruf durch das Verwenden spezifischer Variablen ein weiterer Trigger erstellt werden.

Möchtet Ihr das Facebook Pixel nur feuern, wenn der Nutzer seine Einwilligung gegeben hat, müsst Ihr dies über eine Variable überprüfen. Dies ist abhängig von eurer Consent-Management-Platform (Usercentrics, Cookiebot etc.).

Mit Cookiebot sieht dies beispielsweise bei mir so aus:

Fertig!

Das Facebook Pixel erfasst jetzt jeden von dir definierten Seitenaufruf.

Fazit

Externe Tools und Tracking Pixel mit dem Google Tag Manager hinzufügen ist leicht auch wenn die DSGVO, das Cookie Management bzw. die CMP-Lösungen einiges an Komplexität gebracht haben.

Nachdem du das Tool implementiert hast, müssen meist noch weitere Tags zum Conversiontracking installiert werden. Wie du das machst, erfährst du in diesem Conversiontracking-Guide.

Erhalte exklusive Analytics Tipps, die ich nur mit E-Mail Abonnenten teile.

Mit Klick auf „Jetzt exklusive Inhalte sichern“ erklären Sie sich mit dem Empfang des Newsletters mit Informationen zu Online Marketing, Datenschutz, Analytics und Angeboten sowie mit dessen Analyse durch individuelle Messung, Speicherung und Auswertung von Öffnungsraten und der Klickraten in Empfängerprofilen zu Zwecken der Gestaltung künftiger Newsletter entsprechend den Interessen unserer Leser einverstanden. Die Einwilligung kann mit Wirkung für die Zukunft widerrufen werden. Der Versand erfolgt mit dem US-Dienstleister MailChimp (auf Grundlage von Standardvertragsklauseln). Ausführliche Informationen erhalten Sie in unseren Datenschutzhinweisen“).

  • 1-2 mal Pro Monat. Kein Spam.
  • Zugriff auf E-Books & Tools
  • Kostenlos