Event Tracking Variable aus Tag Manager einsetzen

Deutschsprachiges Forum (German)
1

Hallo zusammen,

eine kurze Frage zum Verständnis, kann ich in ein Eventtracking, welches direkt im Code hinter dem Button platziert wird, auch Variablen (vom tag Manager einsatzen) einsetzen? Beispiel:

_paq.push([‘trackEvent’, ‘Contact’, ‘{{PageTitle}}’, ‘{{ClickText}}’]);

Hab es so versucht, geht aber nocht. Normaler Text wird ausgespielt.

Danke für eine Antwort!

Viele Grüße
Steven

2

Hallo,

So direkt funktioniert das nicht, da alles auf deiner Seite ja normales Javascript ist.

Und du kannst natürlich Matomo Events auch direkt in Tag Manager ohne code tracken:

Aber mit ein wenig Programmieren kannst du auch in deiner Webseite den Variablen-Inhalt bekommen. window.MatomoTagManager.containers[0] enthält den ersten TagManager container und container.variable die Liste aller Variablen, die in Tag Manager definiert sind.
Aber das funktioniert nur, wenn zu dem Zeitpunkt Tag Manager schon fertig geladen ist. Das sollte jedoch bei einem Button-Klick oder so ähnlichem der Fall sein.

Somit braucht man das nur zu kombinieren und schon hat man das:

<button id="thebutton"></button>
<script>
    const button = document.getElementById("thebutton")
    const nameOfVariable = "VariableName"
    button.addEventListener("click", function () {
        if (typeof window.MatomoTagManager === "undefined") {
            console.log("Tag Manager not yet loaded")
            return
        }
        const container = window.MatomoTagManager.containers[0]
        const variables = container.variables
        const correctVariable = variables.find(variable => variable.name === nameOfVariable)
        if (typeof correctVariable === "undefined") {
            console.log("variable not found")
            return
        }
        const value = correctVariable.get()
        console.log(`The value of variable "${nameOfVariable}" is "${value}"`)
        button.innerText = value
    })
</script>

Achtung, das ist in ziemlich modernem Javascript geschrieben. Wenn du alte Browser unterstützen musst, kannst du es mit https://babeljs.io/repl in ES2015 konvertieren.

3

Hallo Lukas,

vielen Dank für die ausführliche Antwort und detailierte Beschreibung. Ich werde es ausprobieren und bin gespannt, ob es klappt.

Aber wenn ich dich richtig verstanden habe, ist es “einfacher” den Tag Manager zu nutzen und in Matomo die Events dann zu erstellen :-).

Vielen Dank und schon mal ein schönes Wochenende!

1 Like