Advanced Event tracking met Google Tag Manager

ConfusedHoe meer je leest over “event tracking en Google Tag Manager” hoe meer verwarring er ongetwijfeld zal ontstaan. Je zal reeds gemerkt hebben dat er heel wat verschillende methoden bestaan om events te meten op je pagina.

In deze post wil ik jullie een methode tonen om wat meer creatief om te gaan met events. We gaan gebruik maken van “variables“, enkele “triggers” uiteraard om de events op te roepen en als laatste een Google Analytics tag om het event te registreren.

Event Tracking – voorbeeld “Social buttons”.

Als voorbeeld gebruik ik de social buttons die je vindt in de rechterkolom. Ik heb gebruik gemaakt van de gekende “Addthis” buttons.

Wanneer je klikt op de buttons zullen we onderstaande registreren in Google Analytics.

  • Event category: Social Share
  • Event action: de css class name (linkedin|twitter|facebook etc ….)
  • Event label: de pagina die geshared werd (maw, de uri van de pagina)

event-tracking-google-tag-manager-variables

Hoe beginnen we eraan?

  1. Eerst en vooral, we kunnen gebruik maken van globale listener. We gaan een click in de data layer registreren voor elke click, op elk element. Deze globale click listener kunnen we nadien hergebruiken om events te registreren voor eender welk element je wil opnemen in je event tracking.
  2. Vervolgens moeten we ervoor zorgen dat we de clicks op de social buttons (in ons voorbeeld) kunnen onderscheiden van de clicks op de elementen. Hiervoor gaan we gebruik maken van de “variables”. We kunnen de css class selector opvangen via de built-in variables in Google Tag Manager.
  3. We gebruiken een nieuwe trigger om een controle uit te voeren op de variable. Deze controle gaan we zodanig samenstellen dat we exact weten wanneer er geklikt werd op één van social share buttons.
  4. Als laatste stellen we de Google Analytics tag samen om het event te registreren. Hier gaan we vervolgens de css class selector toekennen aan de event action en zullen we de huidige pagina naam toekennen aan het event label. Hiervoor zullen we de “Page Path” variable gebruiken.

Het is belangrijk dat je inzicht verkrijgt in de algehele werking van Google Tag Manager, je zal deze methode kunnen gebruiken om eender welk element in je website te meten dmv het gebruik van event tracking.

Let’s go – let’s have some fun!

We gaan van start met het maken van de global linkclick listener.

  1. Ga naar “Triggers”
  2. Voeg een nieuwe trigger toe
  3. Naam: Global Linkclick Trigger
  4. Choose Event: Click
  5. Configure Trigger: Targets All Elements
  6. Fire on: All Clicks

global-linkclick-listener-Google-Tag-Manager

 

Activeren van de nodige “built-in” variables.

Variables is één van de hoofdcomponenten van Google Tag Manager. Deze variables zijn te vinden in de data layer en allerhande informatie kan je hier opslaan. Een variable in GTM is eigenlijk gewoon een variabele zoals we deze kennen en gebruiken bij het programmeren van toepassingen.

Wanneer we kijkje nemen bij “Variables” in Google Tag Manager zien we dat reeds enkele standaard geactiveerd zijn. De variable die we gaan gebruiken om de “css class” waarde op te vragen moeten we activeren. Deze kan je vinden onder “Clicks“. Activeer hier “Click Classes

variables-google-tag-manager

 

Wanneer je nu de preview publiceert van je GTM container zal je zien dat elke click op een element geregistreerd zal worden (gtm.click). Wanneer je een kijkje neemt in de tab “variables” (selecteer de gtm.click) in de summary. Hier vinden we de variable die we geactiveerd hebben, namelijk “Click Classes”. De variabele “Page Path” is standaard geactiveerd. Hier zie je vervolgens dat wanneer we klikken op de social buttons, de class name van deze buttons opgeslagen is in de variabele “Click Classes” en “Page Path” bevat de waarde van de pagina uri. Deze laatste zullen we toevoegen in ons event label.

clicks-google-tag-manager

 

Aanmaken van de trigger voor het event “Social Share”

Voor we het event kunnen registreren moeten we nu een trigger samenstellen die enkel zal opgeroepen worden wanneer we klikken op één van de social share buttons. Wanneer we kijken naar de waarde van de css class zien we dat deze steeds als volgt is samengesteld:

  • at4-icon aticon-NaamVanSocialNetwork
  • at4-icon aticon-twitter | at4-icon aticon-facebook (etc …..)

We kunnen dus stellen dat wanneer “aticon” voorkomt in de waarde van de variabele “Click Classes” is er geklikt op één van de social share buttons.

Dit gaan we gebruiken als voorwaarde voor de trigger die we gaan gebruiken om het event te registreren. Je ziet, je kan dit uiteindelijk gaan gebruiken voor het samenstellen van andere triggers, om op deze manier allerhande events toe te voegen in je website.

We maken een nieuwe trigger.

  1. Ga naar “Triggers”
  2. Nieuwe trigger toevoegen
  3. Naam: Social Share – Clicked
  4. Choose Event: Custom Event
  5. Fire on: gtm.click
  6. Conditie: Click Classes >> contains >> aticon

Andere instellingen zijn eventueel mogelijk voor de conditie.

Trigger Social Share Event

Aanmaken van de Google Analytics tag – event tracking.

We voegen een nieuwe tag toe, Google Universal Configuratie Google Analytics event tracking tagAnalytics en gebruiken volgende instellingen:

  1. Naam: Evt – Social Shares
  2. Choose Product: Google Analytics
  3. Tag type: Universal Analytics
  4. Configure Tag:
    1. Vul de nodige parameters in als UA-id
    2. Track Type: Event
    3. Category: Social Share
    4. Action: {{Click Classes}}
    5. Label: {{Page Path}}

Belangrijk: bij “Fire on” gaan we de trigger instellen die we in de vorige stap hebben samengesteld. Hier gebruiken we de trigger “Social Share – clicked

Publiceren deze handel en klaar!!

Zoals ik reeds meerdere malen heb vermeld in deze post. Er zijn heel wat verschillende methoden om event tracking in te stellen via Google Tag Manager. Het is echter meer belangrijk dat jullie een inzicht verkrijgen in de werking van Tag management. De methode die we hier gebruikt hebben kan je dus effectief gebruiken om events toe te voegen op eender welk element op je pagina. Wees creatief met het gebruik van variables en triggers en je komt er wel.

Heb jij opmerkingen of heb je wat toe te voegen, please, don’t hesitate en have fun met event tracking.

(Visited 1,260 times, 1 visits today)

Leave a Comment.