Dieses Hilfeportal ist nicht mehr aktuell und wird von Emarsys nicht mehr aktiv betreut.
Diese Dokumentation ist ausschließlich für Google Tag Manager Version 3.0 gültig. Sie hat keine Gültigkeit für Google Analytics 4 (GA4).
Dieses Dokument bietet einige grundsätzliche Richtlinien und Tipps für die Implementierung der Emarsys Data Collection API Scripts auf Ihrer Website, wenn Sie dafür Ihr bestehendes Google Tag Manager (GTM) Setup verwenden wollen.
Informationen zu den Spezifikationen und Anforderungen für diese Implementierung erhalten Sie in der Data Collection JavaScript API Reference.
Für unsere Data Collection Scripts müssen Sie Ihre GTM-Implementierung wahrscheinlich erweitern. Sie müssen neue Variablen deklarieren und neue Tags erstellen; dafür benötigen Sie professionelle IT-Ressourcen und ein detailliertes Verständnis dafür, wie Ihre Website aufgebaut ist.
Einführung
Google Tag Manager bietet ein einzelnes Code Snippet, Container Code genannt, das nur ein einziges Mal auf der Website implementiert werden muss. Sobald es implementiert ist, können die Benutzer verschiedene Code Snippets und Vendor Tags von Drittunternehmen hinzufügen; dafür steht unter https://tagmanager.google.com/ ein einfach zu bedienendes Interface zur Verfügung.
Dennoch gilt: Auch bei Verwendung eines Tag-Management-Systems erfordert die Implementierung komplexerer Funktionen häufig zusätzliches Codieren.
Dieses Codieren schließt das Erstellen oder Erweitern des sogenannten Data Layer ein. Das Data Layer ist eine Metastruktur, die Datumsformate standardisiert und für GTM eine eigene Datenbank unterhält, die beim Bereitstellen komplexerer Tags, etwa jener, die Sie für die Datensammlung verwenden, zum Einsatz kommt.
Allgemeine Anforderungen für das GTM Data Layer
Standardmäßig sieht GTM nur jene Daten (Variablen), die auf der Webseite präsent sind. Es ist allgemein bekannt, dass GTM zuweilen Schwierigkeiten hat, einige dieser Variablen richtig zu erfassen; spezielle Textformatierungen (etwa abweichende Währungen und Nummernformatierungen bei Preiswerten) können das Lesen der Daten erschweren; dazu kommt, dass möglicherweise nicht alle Daten immer auf allen Seiten präsent sind (so verlangen wir zum Beispiel, dass die Website den Warenkorbinhalt auf jeder Seite berichtet, selbst wenn der Inhalt des Warenkorbs von einer Seite nicht standardmäßig gelistet wird).
Um derartige Probleme zu vermeiden, sollten Sie Daten dieser Art zum Data Layer hinzufügen und so an GTM übergeben.
Technisch gesehen ist das Data Layer ein JavaScript Arrayobjekt, das Key-Value-Paare enthält:
var dataLayer = dataLayer || []; dataLayer.push({ visitorId : 345, visitorEmail : john@doe.tld , });Weitere Informationen zum Data Layer und wie bzw. wo es im Source Code Ihrer Website platziert werden soll, erfahren Sie in der detaillierten Dokumentation zum Google Tag Manager.
Eine vollständige Liste aller für die Implementierung erforderlichen Daten finden Sie in der Tabelle weiter unten.
Richtlinien für das Integrieren des JavaScript API
Grundsätzlich empfehlen wir allen Website-Besitzern die Implementierung des Enhanced Ecommerce Data Layer für Google Tag Manager. Das bedeutet zwar anfänglich einen größeren Coding-Aufwand, dafür sind GTM-Benutzer danach aber in der Lage, spezifische Produktdaten an verschiedene Tag-Anbieter, wie etwa Emarsys, zu übergeben.
In dieser Anleitung gehen wir davon aus, dass die Enhanced Ecommerce Implementierung einsatzbereit ist und die erforderlichen Codes, wie von Google empfohlen, über dem GTM Container Code Snippet platziert wurden. In allen anderen Fällen müssen Sie je nach der Funktionalität Ihrer Website Trigger und Einstellungen individuell anpassen.
Bitte beachten Sie, dass Emarsys leider keine detaillierten Anleitungen für all die möglichen Szenarien einer Website-Struktur anbieten kann. Wenn Sie spezifische Fragen haben, wenden Sie sich für Unterstützung an Ihre Agentur oder einen Google Analytics Certified Partner.**
Variablen und Tags erstellen, die das Emarsys JavaScript enthalten
Um alle erforderlichen Elemente Ihrer Integration zu unterstützen, müssen Sie zuerst mehrere GTM-Variablen erstellen:
- ecommerce Eine Data Layer Variable, die Ihre Enhanced Ecommerce Daten lesen wird. In Ihren anderen Variablen und Tags wird diese Variable die Quelle sein, mit deren Hilfe Produktdaten an Emarsys übergeben werden:
2. Category path Im Data Layer müssen Sie jene Kategorie einschließen, die der Besucher gerade durchsucht; diese muss in eine GTM-Variable gelesen werden.
Der Kategoriewert, der an den category JavaScript Command übergeben wird, muss mit den in den Produktkatalog eingeschlossenen Kategoriewerten exakt übereinstimmen:
3. Cart content Wie oben erwähnt, schließt Enhanced Ecommerce nicht auf allen Seiten den Inhalt des Warenkorbs ein; dies ist jedoch eine Anforderung von Emarsys. Daher müssen Sie selbst diese Information zur ursprünglichen Data Layer Deklaration hinzufügen, und zwar im Tag <head>. Es gibt in diesem Fall keine empfohlene Namenskonvention; stellen Sie aber sicher, dass Sie alles einschließen, was der Command cart erfodert (zum Beispiel auch die Mengenangabe und den Gesamtpreis).
Danach können Sie das Data Layer mithilfe der GTM-Variable lesen und dies zum Cart Command hinzufügen. Der cart Command kann in Ihr allgemeines Emarsys Tag eingeschlossen werden (Beschreibung weiter unten).
Emarsys Tag erstellen
Sobald die Variablen eingerichtet sind, müssen Sie ein neues Tag vom Typ Custom HTML erstellen. Dieses Tag bezeichnen wir als Emarsys Tag.
Das Emarsys Tag wird JavaScript Code enthalten - um Ihren eigenen Code zu erstellen, verwenden Sie das verlinkte JSFiddle Beispiel -, welcher alle Commands enthält, die für das Data Collection API erforderlich sind.
Wie Sie im JSFiddle sehen können, lädt der Code zuerst das Data Collection API selbst. Dieses muss Ihre Merchant ID referenzieren, welche von Emarsys ausgestellt wurde.
Im nächsten Schritt überprüft der Code den Typ der Seite, auf der wir uns gerade befinden.
Sobald dieser bestimmt ist, können Sie ganz einfach und umgehend Ihre bestehende erweiterte E-Commerce-Implementierung verwenden und die richtigen Data Collection Commands vom Tag aus aufrufen: view oder category oder purchase
Anhand des JSFiddle-Beispielcodes können Sie Ihre eigene Tag-Implementierung erstellen:
Benutzerkennung
Die GTM-Nutzungsbedingungen verbieten die Verwendung von persönlichen Informationen in Google Tags. Sie können Daten dieser Art zum Data Layer hinzufügen, müssen dabei aber sicherstellen, dass die Daten nicht an eines der Google Tags übergeben werden; das schließt das Google Analytics Tag ein. Sie können diese Daten an einen beliebigen Drittanbieter wie etwa Emarsys übergeben, um sicherzustellen, dass das Tracken der Kunden erwartungsgemäß funktioniert.
Das Data Collection API bietet zwei Methoden für das Übergeben von eingeloggten Kundendaten:
- Über die ID des Benutzers in Ihrer Benutzerdatenbank.
- Über die E-Mail-Adresse des Benutzers.
Hinweis: Wir empfehlen die Verwendung der E-Mail-Adresse, da Sie dabei keine externe ID verwalten müssen. In beiden Fällen müssen Sie die Information als Key zu Ihrem ursprünglichen Data Layer hinzufügen, und zwar im Abschnitt <head> Ihrer Website.
Sie müssen eine neue GTM-Variable in Ihrem GTM Container erstellen, welche diese Daten aus Ihrem Data Layer lädt. In unserem Beispiel verwenden wir eine GTM-Variable mit dem Namen User Email. Sie können das oben erwähnte Emarsys Tag so bearbeiten, dass es auch den JavaScript Command enthält, der die Benutzer-E-Mail unter Verwendung des Variablennamens User Email setzt:
ScarabQueue.push(['setEmail', {{User Email}} ]);Tabelle mit den für die Implementierung benötigten Daten
Folgende Datentypen müssen Sie für Emarsys JavaScript verfügbar machen:
| Datentyp | Beschreibung | JavaScript Command | GTM Source |
|---|---|---|---|
| User identifier | Entweder Ihre eigene interne userID oder die E-Mail-Adresse des Benutzers. | setEmail / setCustomerId | Fügen Sie dieses Element zum ursprünglichen Data Layer hinzu, z.B. User Email. |
| Product ID | Der Unique Identifier, der für die Identifizierung der Produkte verwendet wird, wie in Ihrem Google Product Feed oder Ihrer Emarsys Produktkatalog .csv definiert. | view, cart, purchase | Enhanced Ecommerce. Für den Command cart müssen Sie das als eigenes Data Layer Element auf allen Seiten Ihrer Website hinzufügen. |
| Category Path | Der besuchte Kategoriepfad, wie in Ihrem Google Product Feed oder Ihrer Emarsys Produktkatalog .csv definiert. | category | Fügen Sie das zum ursprünglichen Data Layer hinzu. |
| Product quantity | Wenn ein Produkt zum Warenkorb hinzugefügt oder gekauft wird. | cart, purchase | Enhanced Ecommerce. Für den Command cart müssen Sie das als eigenes Data Layer Element auf allen Seiten Ihrer Website hinzufügen. |
| Product total price | Wenn ein Produkt zum Warenkorb hinzugefügt oder gekauft wird (unter Berücksichtigung der Anzahl und möglicher Rabatte) | cart, purchase | Enhanced Ecommerce. Für den Command cart müssen Sie das als eigenes Data Layer Element auf allen Seiten Ihrer Website hinzufügen. |