Analytics E-Commerce Tracking

Analytics E-Commerce Tracking per Custom HTML im Google Tag Manager

Best Practice: So funktioniert euer E-Commerce Tracking auch ohne Google konformen Datalayer

Direkt zum Content:

 

Es geht um das Thema Analytics E-Commerce Tracking. Allerdings nicht in der Standard Variante. Die meisten von euch werden inzwischen wissen, wie man Analytics E-Commerce Tracking über den Google Tag Manager aufsetzt.
Wer es noch nicht weiß, liest bitte den ganzen Absatz, wer es schon weiß, steigt einfach im nächsten Absatz wieder ein. Wer sein Wissen noch einmal schnell auffrischen will, kann sich hier bei Simo Ahava, bei Luna Metrics oder auf deutsch z.B. auch bei Ranking Check informieren. Die visuellen Typen unter euch, schaut euch einfach das Video zur Google Tag Manager eCommerce Tracking Installation an, und ignoriert die anderen Links.

In meinem Beitrag zeige ich euch, wie man das E-Commerce Tracking zum Laufen bekommt, obwohl der Datalayer nicht Google konform aufgesetzt worden ist.
Kleine Anmerkung vorweg: Ich selber bin kein Programmierer und hatte hierbei Unterstützung von meinem lieben Kollegen Alex Tissen (Danke 🙂 ), daher verzeiht mir, wenn ich mich evtl. nicht ganz exakt ausdrücken werde im späteren Verlauf des Beitrags.

E Commerce Tracking Custom html Tag

 

Problem: Standard Analytics Ecommerce Tracking Tag liefert keine Daten

Zunächst möchte ich etwas genauer auf das Problem eingehen. Wir sprechen hier also von einem Kunden, der einen Online Shop hat und hierüber Produkte verkauft. Er hat den Google Tag Manager auf allen Seiten implementiert und hat auch Google Analytics korrekt eingebunden. Google Analytics trackt in der Standard Implementation nur Seitenaufrufe, d.h. für Bestellungen im Shop braucht ihr einen zusätzlichen Tag für Transaktionen, sowie einen Datalayer, der uns die nötigen Informationen dynamisch vom Shop übergeben kann.
Dieser kann ganz unterschiedlich aussehen. Um E-Commerce Daten ins Analytics zu bekommen brauchen wir grundsätzlich nur zwei Werte die übergeben werden müssen:

  • Transaction ID
  • Transaction Value

Wenn wir auch noch sehen wollen, welche Produkte gekauft worden sind, brauchen wir auch:

  • Produkt SKU
  • Produkt Preis
  • Produkt Menge

Wenn man sich an die Google Syntax hält, kann eigentlich nichts schiefgehen. Sollte man beim Datalayer allerdings aus verschiedenen Gründen eine andere Taxonomie verwenden, kann der Standard Analytics Ecommerce Tracking Tag diese nicht interpretieren und wir bekommen keine Daten im Analytics. Das genau war unser Problem.

Unser Beispiel sieht so aus: anstatt transactionTotal und transactionId hatten wir OrderValue und OrderId als dynamische Variblen im Datalayer.

Datalayer Variablen und Werte E Commerce

Lösung: wie komme ich trotzdem an die korrekten Werte

Wir haben zunächst keine Möglichkeit gefunden, die Variablen zu ändern. Nach einigem „Um-die-Ecke-Denken“ hatten wir die Idee, den E-Commerce Tag als Custom Html Tag einzubinden.
In der Standard Implementation benutzt man einen vordefinierten Tag, in dem man später wenig Möglichkeiten hat Anpassungen vorzunehmen. Dieser sieht in etwa so aus:

Standard E-Commerce Transaktion Tag

Wenn wir einen Custom Html Tag verwenden, haben wir die Möglichkeit den Code selber anzupassen bzw. in unseren Falle die Variablen selber zu definieren. Alles ist dann so, als wäre es hard coded auf der Webseite verbaut worden. Das bedeutet für uns zwar etwas Zeit den Code umzuschreiben und die Variablen neu zu definieren und auch eine gewisse Anzahl an Testdurchläufen, ehe alle Daten auch korrekt im Analytics ankommen, aber wir sparen uns den Schritt über den Entwickler und müssen auch keine anderen Tags, die bereits die aktuellen Variablen nutzen umbauen.
ob sich der Schritt über ein Custom Html Tag lohnt, müsst ihr also selber abwägen. Ich denke, dass es in den meisten Fällen sicher schneller geht, den Datalayer anzupassen – je nachdem wie komplex euer Tag Manager bereits aufgesetzt ist und wieviele Tags ihr nutzt.

Unser finaler Code sieht dann so aus:

custom E-Commerce html tag

Was haben wir hier genau gemacht?

Zunächst haben wir versucht jede abgefragte Variable über einen im Datalayer übergebenen Wert abzubilden. D.h. den gesamten oberen Teil des Scripts decken wir mit einfachen zugeordneten Variablen ab. Für alle die mit dem Tag Manager arbeiten ist das Selbsterklärend. Eine davon sieht dann z.B. so aus:

GTM Datalayer Variable Purchase Tax

Im mittleren Teil unseres Custom Html Tags steht eine Funktion, die wichtig ist:

for( var i = 0; i < {{dlv – products}}.length; i++ ){

Sie erlaubt es uns, mehr als ein Produkt zu tracken. Ohne diese zusätzliche Zeile würde im Analytics immer nur das erste gekaufte Produkt ankommen. Wir hätten zwar bereits den genauen Gesamtumsatz (dieser wird im Script ja bereits im oberen Teil übergeben), aber uns würden die zugehörigen Produkte teilweise fehlen.
Ab Zeile 22 im Script wird es nun richtig interessant! Hier haben wir benutzerdefinierte Java Script Variablen genutzt und den Code etwas angepasst, um mehr als ein Produkt zu tracken:

Beispiel: Java Script Variable für Produkt Category

 

Wir definieren im Prinzip hier den Wert, der im Datalayer schon vorhanden ist. Im Beispiel ist es der Wert aus dem E-Commerce Array und den entsprechenden Arrays darunter.
Das Ganze machen wir nun für alle noch fehlenden Werte.

Damit wir alle gekauften Produkte auch ins Analytics übergeben, reicht es nicht nur die Variable im Tag zu haben, sondern wir müssen hier noch die Anpassung vornehmen, die ich oben bereits angesprochen habe:

_gaq.push(['_addItem',
    {{dlv - Order ID}},                     // transaction ID – required
    '' + {{jsv - product sku}}[i],          // SKU/code – required
    '' + {{jsv - product name}}[i],         // product name
    '' + {{jsv - product category}}[i],     // category or variation

Die Order ID ist nur einmal vorhanden, egal wieviele Produkte ich kaufe, daher reicht es, wenn diese Variable ganz normal im Code steht. Für alle Werte, die mehr als einmal vorkommen können, passen wir die Variablen im Code an, indem wir: “ + davorsetzen und ein [i] dahinter. Damit tracken wir nun alle gekauften Produkte aus dem Warenkorb mit.

Und wozu ist so ein DIY-Tag nun gut?

Zum einen braucht ihr diesen, falls euch der Tag Manager keinen fertigen Tag vorgibt (siehe Facebook / Bing / Co.) und zum anderen, falls ihr mit den Möglichkeiten des fertig gebauten Tags an gewissen Grenzen stoßt, wie wir es sind bei diesem Problem. Ich hoffen, dem einen oder anderen mit diesen Tipps weitergeholfen zu haben.

Wie immer freue ich mich über Kommentare eurerseits, falls ihr ähnliche Probleme hattet und wie ihr diese gelöst habt. Sehr wahrscheinlich gibt es noch viele anderen Wege, die uns ans Ziel gebracht hätten. Lasst uns diese gern lesen! Falls ihr Fragen zur Implementation oder generell zum Google Tag Manager habt, dürft ihr diese auch gern loswerden.

Author bio:

Alexander ist PPC Manager bei Peak Ace. Aktuell verantwortet er darüber hinaus das Thema Web Analytics. In seiner Freizeit führt er zwei Musiklabel mit Fokus auf Club Musik und ist als Veranstalter tätig.

Kommentar verfassen