Blue background with pattern

Onze GA4 & GTM config - de weg naar 100% kloppende data

AI Generated - Prompt: create an hero blog image that show the following logos google, google tagmanager and elgentos on a server configuration
Wouter SteenmeijerOrange dot4 Dec 2023

Met de invoering van GA4 is er een hoop veranderd op het gebied van website analytics. Het grootste verschil is natuurlijk dat GA4 event driven is en niet session driven maar event driven. De belangrijkste reden voor deze verandering is dat het voor Google steeds moeilijker wordt om een compleet data beeld te krijgen van de gebruiker. Bijvoorbeeld dat iOS 3rd party tracking blokkeert, maakt het lastiger om de juiste data naar je analytics platform te sturen. Maak ook gebruik van adblockers stijgt bijvoorbeeld nog steeds.

De praktijk

In dit artikel wil ik dieper ingaan op onze standaard GA4 en GTM configuratie. We gebruiken hier de volgende extensies voor:

- Yireo GoogleTagManager - https://github.com/yireo/Yireo_GoogleTagManager2

- Elgentos Server side analytics - https://github.com/elgentos/magento2-serversideanalytics

Uiteraard zijn beide extensies gratis te downloaden van github.

Daarnaast is het belangrijk om een server side container van GTM geïnstalleerd te hebben. Ik zal daar in dit artikel niet verder op ingaan, dit ligt normaal gesproken ook buiten onze scope, maar hier kunnen we wel bij helpen. Een server side container is belangrijk omdat je er voor kan zorgen dat gtm.js van je eigen domein gedownload wordt. De "initiator" van het sturen van data valt dan binnen het eigen domein. Ook de data kan dan naar een eigen domein gestuurd worden. Hiervoor maak je bijvoorbeeld de CNAME marketing.JEDOMEINNAAM.com aan. Alle data is nu 1st party geworden en heb je dus ook voor iOS tracking gefixed. Meer informatie kan je daarover hier vinden: https://developers.google.com/tag-platform/tag-manager/server-side

De Yireo GTM extensie creëert events in de datalayer. Deze kan je afvuren in je GTM configuratie. Standaard gaat het om deze events:

  • view_item
  • view_item_list
  • select_item
  • add_to_cart
  • remove_from_cart
  • view_cart
  • begin_checkout
  • add_payment_info
  • add_shipping_info
  • purchase

Deze events moeten allemaal in GTM worden aangemaakt en doorgestuurd naar GA4 en/of andere endpoints.

Vaak hebben onze klanten maatwerk hierop nodig. Bijvoorbeeld als we een reorder flow willen bijhouden vanaf de homepage of de account pagina.

Onze ambitie is dat minimaal de purchase data 100% klopt in Google Analytics. Voor GA1 & UA hadden we al een serverside extensie gemaakt die het purchase event serverside naar GA stuurt wanneer de order betaald was.

Voor GA4 was dit natuurlijk ook weer de bedoeling. In deze versie hebben we ook rekening gehouden met headless projecten. Het belangrijkste is om zo snel mogelijk een GA userID en een GA sessionId op te slaan. We hebben de volgende flow gehanteerd:

- User bezoekt de site en voegt een item toe aan de cart

- Op dit moment kijkt de extensie of een user_id en/of session_id aanwezig is

- Deze worden in een aparte tabel opgeslagen met een quote_id referentie

- Als de order geplaatst is wordt de tabel geupdate met het order_id

- Als de order betaald is wordt deze naar GA4 gestuurd met het measurement protocol

We hebben een feature gebouwd die er voor zorgt dat als er geen session_id aanwezig is, door bijvoorbeeld gebruik van een adblocker dan wordt dit gevuld met een fallback session_id. Dit kan een range zijn of een default id.

Toekomst

Op dit moment ondersteuren we in server side analytics alleen het purchase event. Ik zou me goed kunnen voorstellen dat we dit gaan uitbreiden als de usecase zich voordoet.