Benutzerdefinierte JavaScript Variablen in Google Tag Manager

Zum Erstellen einer benutzerdefinierten Variable loggen Sie sich in Ihren Google Tag Manager Account ein, klicken links in der Navigation auf „Variablen“ und dann „Neu“ im Bereich „Benutzerdefinierte Variablen“.

In dem sich öffnenden Fenster kann nun ein Name verwendet werden (Wir empfehlen ein Prefix z.B. JS – Benutzerdefinierte Variable XYZ), dann einmal auf „Variable konfigurieren“ und dann rechts auf „Benutzerdefiniertes JavaScript“ klicken.

Der Aufbau einer JS Variable ist grundsätzlich relativ einfach. Wie eingangs erwähnt, handelt es sich um eine anonyme Funktion, die zum Schluss einen Wert zurückgibt. Die Funktion in unserem Beispiel soll hier vorrangig vereinfacht den Aufbau illustrieren. Im nächsten Schritt wird diese dann mit „Leben“ gefüllt werden.

Wichtig: Im Google Tag Manager brauchen benutzerdefinierte JS Variablen nicht in <script> </script> Tags gesetzt zu werden.

Im nächsten Schritt muss diese Funktion nun – je nach Anwendungsfall bzw. zu lösendem Problem – entsprechend „befüllt“ werden. In unserem (realer Kunde) Fallbeispiel existiert das Problem, dass ein E-Commerce Shop auf der finalen Bestätigungsseite (also dort, wo ein Abverkauf getracked werden soll) eine Bestellnummer mit einem alphanumerischen Wert inklusive Umlauten anstelle eines numerischen Wertes generiert, welcher von dem Affiliate-Marketing-Netzwerk AWIN nicht akzeptiert wird. Wie so häufig stehen dem Kunden nur begrenzte Ressourcen zur Verfügung beziehungsweise ist dieser an Releasezyklen gebunden, welche mehrere Wochen in der Zukunft liegen.

Da Marketingziele aber meistens nicht flexibel sind und Umsatzziele trotz technischer Probleme erreicht werden müssen, helfen in solchen Situationen kleine „Life Hacks“ mit Google Tag Manager 🙂

Dieser Screenshot illustriert eine fertige JS Funktion mit dem Ziel, alle nicht-numerischen Zeichen in einem String (in unserem Fall die Bestellnummer) zu entfernen.

1. var StringInclCharacters – Wir definieren eine JavaScript Variable namens „StringInclCharacters“ für die Ausgangszeichenfolge (String)
2. var StringNumeric – Wir definieren eine JavaScript Variable namens „StringNumeric“, diese wird den bereinigten String enthalten.
3. {{tsCheckoutOrderNr}} – Hierbei handelt es sich um eine bestehende Datenschichtvariable namens „tsCheckoutOrderNr“, welche in unserem Beispiel die alphanumerische Bestellnummer beinhaltet. Diese soll „bereinigt“ werden und zum Schluss nur numerische Zeichen beinhalten.
4. replace – Mit „replace“ kann eine bestehende Variable manipuliert werden.
5. (/\D/g,“) – RegEx Anweisung, um alle nicht numerischen Zeichen zu entfernen.
6. return – Durch die „return“ Anweisung wird eine Variable zurückgegeben.

Da benutzerdefinierte JS Variablen im Google Tag Manager „einfach“ einen Wert zurückgeben, können diese wie normale Datenschichtvariablen (DataLayers) verwendet werden. Dies bedeutet, dass – wie im Beispiel zu sehen – anstelle der ursprünglichen Variablen nun unsere benutzerdefinierte JavaScript Variable als „Bestellnummer“ übergeben. Die Übergabe an den AWIN Tracking Code ist an dieser Stelle aber nur exemplarisch, diese Info kann beliebig an alle anderen tracking Codes wie z.B. Google Ads, Bing Ads, Facebook Ads etc. übergeben werden.