Google Tag Manager Tutorial VIII: Visibility-Tracking anlegen

26. November 2018 | Von in Google Analytics

Durch Visibility-Tracking können wir herausfinden, ob die für uns wichtigen Inhalte von den Nutzern unserer Seite gesehen werden. Mithilfe des Tag Managers können wir diese Inhalte auch ohne Zugriff auf den Code der Seite taggen.

GLIEDERUNG:

Zur besseren Übersicht und für alle, die nur an einem Teil des Tutorials interessiert sind, ist hier die Gliederung inkl. Sprungmarken.

Voraussetzungen

Variablen festlegen

Trigger erstellen

Tag erstellen

VORAUSSETZUNGEN

Dieses Tutorial behandelt ausschließlich die Erstellung des Visibility-Tracking-Tags unter Verwendung der vom Google Tag Manager vorgefertigten Variablen und Trigger. Damit das Tracking funktioniert, müssen folgende Voraussetzungen erfüllt sein:

  • Der Google Tag Manager Container wurde auf unserer Seite installiert. Die Anleitung, wie man einen GTM-Container anlegt und auf der Seite installiert, gibt es hier.
  • Ein Analyse-Tool (Google Analytics, Piwik, etc.) ist auf der Website im Einsatz. Wie die Einpflege eines solchen Tools über den GTM funktioniert, wird hier erklärt.

Variablen festlegen

Im ersten Schritt aktivieren wir die integrierten Variablen für das Scroll-Tracking. Dazu navigieren wir über “Variablen” -> “Konfigurieren” und klicken dort die Variablen unter “Sichtbarkeit” an (siehe Abbildung 1).

Google Tag Manager Sichtbarkeits-Variablen

Abb. 1: Google Tag Manager Variablen für das Sichtbarkeits-Tracking aktivieren

Die Aktivierung der Variablen ermöglich dem Tag Manager, die folgenden Werte festzuhalten:

Percent Visible: Wieviel Prozent des Elements (Bild, Text, Video) sind sichtbar?

On-Screen Duration: Wie lange war das Element auf dem Bildschirm des Nutzers sichtbar?

Trigger erstellen

Danach können wir den Trigger für unser Visibility-Tracking erstellen. Hierzu navigieren wir über “Trigger” -> “Neu” -> “Trigger-Konfiguration” und wählen den Trigger für “Elementsichtbarkeit” aus. In der Trigger-Konfiguration bieten sich uns folgende Möglichkeiten (siehe Abbildung 2).

GTM Sichtbarkeits Trigger

Abb. 2: Google Tag Manager Trigger für das Sichtbarkeits-Tracking

  1. Auswahlmethode: Hier sollte die ID oder der CSS-Selektor angegeben werden, durch den das Element bestimmt werden kann. Sollte keine ID vorliegen, die einfach in das Feld eingetragen werden kann, kann im Chrome-Browser ein CSS-Selektor über “Rechtsklick” -> “Untersuchen” auf das entsprechende Element bestimmt werden. Eine weitere Erläuterung zu CSS-Selektoren gibt es in Simo Ahavas Blog.
  2. Element ID/CSS-Selektor: Hier den Wert des CSS-Selektor eintragen oder die Element ID.
  3. Wann dieser Tag ausgelöst wird: Diese Auswahl ist optional, je nachdem welche Intention mit dem Tag verfolgt wird. Einmal pro Seite: Wenn das Element auf mehreren Seiten steht und auf allen ein Event auslösen soll. Einmal pro Element: Wenn das Element auf mehreren Seiten steht, aber nur einmal ein Event auslösen soll. Der letzte Punkt erklärt sich selbst: Jedesmal, wenn ein Element auf dem Bildschirm zu sehen ist.
  4. Mindestsichtbarkeit in Prozent: Der Prozentsatz an Sichtbarkeit des Elements, der dazu führt, dass der Trigger ausgelöst wird.
  5. Die folgenden Checkboxen ermöglichen, eine Mindestdauer festzulegen, die das Element sichtbar sein muss, bevor der Trigger ausgelöst wird. Mit „DOM-Änderung beobachten“ kann auch die Sichtbarkeit dynamischer Elemente verfolgt werden.
  6. Diesen Trigger auslösen bei: Hier kann festgelegt werden, ob der Trigger auf allen oder nur auf bestimmten Seiten aktiv sein soll.

Tag erstellen

Nachdem der Trigger erstellt wurde, können wir unser Visibility-Tag zusammensetzen. Dazu navigieren wir über “Tags” -> “Neu” -> “Tag-Konfiguration” und wählen dort das “Google Analytics – Universal Analytics”-Tag aus. Danach können wir wieder diverse Einstellungen vornehmen (siehe Abbildung 3).

Visibility-Tag

Abb. 3: Google Tag Manager Visibility-Tag

  1. Tag-Typ: Hier wählen wir, je nach Analysetool, den passenden Tag-Typen aus: In unserem Google Analytics Beispiel also “Google Analytics – Universal Analytics”.
  2. Tracking-Typ: Hier wählen wir Ereignis.
  3. Die folgenden Einstellungen können, je nachdem wie die Analytics Property organisiert ist, abweichen. Die oben abgebildeten Einstellungen sind nur ein Beispiel und keine Vorgabe.
  4. Google Analytics-Einstellungen: Wer eine Variable für die Analytics-Einstellungen angelegt hat, kann diese hier eintragen. Wie das geht, steht hier. Ansonsten können die ID und weitere Einstellungen auch manuell eingetragen werden, dabei muss aber auf das “true” bei anonymizeIP geachtet werden!
  5. Abschließend noch den vorher erstellten Trigger auswählen, dem Tag einen Namen geben und abspeichern.

Vor der Veröffentlichung sollte das Tag im Vorschaumodus getestet werden. Danach kann der Tag Manager Container live geschaltet werden und das Visibility-Tracking beginnen.

Fragen oder Anmerkungen, die uns helfen, das Tutorial zu verbessern, sind natürlich wie immer gerne gesehen.

Die gesamte Reihe

Google Tag Manager Tutorial I: Login und einbinden
Google Tag Manager Tutorial II: Google Analytics einbinden
Google Tag Manager Tutorial III: Event-Tracking anlegen
Google Tag Manager Tutorial IV: Remarketing Tag einbinden
Google Tag Manager Tutorial V: Facebook Pixel einbinden
Google Tag Manager Tutorial VI: Video-Tracking anlegen
Google Tag Manager Tutorial VII: Scroll-Tracking anlegen
Google Tag Manager Tutorial VIII: Visibility-Tracking anlegen

Auch hier sind wir natürlich offen für Themenvorschläge und Anregungen.

Mehr zu diesem Thema:
Nächste Events

Nächste Webinare

Alle kommenden Webinare

Nächste Seminare

Alle kommenden Seminare

The following two tabs change content below.
Portrait Maximilian Geisler

Maximilian Geisler

Maximilian Geisler ist SEO-Berater bei der Online-Marketing-Agentur Bloofusion. Seine Spezialgebiete sind der Mobile-Bereich, Google Analytics und der Google Tag Manager. Er bloggt für den Bloofusion-Blog, schreibt Artikel für den suchradar und ist Speaker auf der BLOO:CON

In seiner Freizeit kocht er sehr gerne, leidet jeden Spieltag mit der Diva vom Main und versucht seiner Freundin einen Hund aufzuquatschen. Außerdem findet er es sehr befremdlich sich selbst zu beschreiben. 😉

Maximilian Geisler ist unter anderem in den folgenden sozialen Netzwerken zu finden:

Kommentieren