Heb je een webshop? Dan is het bijhouden van je online prestaties net zo belangrijk als ademen. Met Google Tag Manager en GA4 e-commerce gebeurtenissen kun je precies zien wat er gebeurt: van voltooide aankopen en toegevoegde producten tot gestarte check-outs.
In deze uitleg nemen we mee hoe je GA4 gebeurtenissen aanmaakt in Google Tag Manager voor e-commerce. Dit is een aanvullende uitleg op het instellen van gebeurtenissen die we niet specifiek voor e-commerce hebben geschreven.
Snel naar
Welke e-commerce events zijn er?
Hoewel je veel type gebeurtenissen kan toevoegen, is het wel nodig om een aantal standaard events te hebben om de rapporten in GA4 goed op te kunnen bouwen. Met deze 14 gebeurtenissen kun je een complete e-commerce funnel in kaart brengen:
- View item list: De bezoeker ziet een productoverzicht.
- Select item: Een bezoeker selecteert een product binnen het overzicht.
- View item: Een bezoeker bekijkt een productpagina.
- Add to cart: Een bezoeker voegt een product toe aan de winkelwagen.
- Remove from cart: Een bezoeker verwijdert een product uit de winkelwagen.
- View cart: Een bezoeker bekijkt de winkelwagen (let op, heb je geen winkelwagenpagina maar werk je met een overlay, gebruik dan ook dit event)..
- Add to wishlist: Een bezoeker voegt een product toe aan een wishlist.
- Begin checkout: Een bezoeker begint met afrekenen.
- Add shipping info: De bezoeker kiest een verzendoptie.
- Add payment info: De bezoeker kiest een betaaloptie.
- Purchase: Een bezoeker heeft een bestelling geplaatst (ka-ching!).
- Refund: Helaas, een bezoeker heeft een (deel van de) bestelling geannuleerd.
- View promotion: Een bezoeker heeft een promotie bekeken.
- Select promotion: Een bezoeker heeft een promotie toegepast/gekozen.
Uiteraard kun je hier nog meer aan toevoegen, op basis van je meetbehoefte. Door een meetplan op te stellen kun je hier strategisch naar kijken.
Datalayer instellen
Datalayer? Wat is dat? Om ook daadwerkelijk iets aan de e-commerce events te hebben heb je ook een datalayer nodig. Deze zorgt ervoor dat er additionele informatie aan het event wordt meegeschoten. Een stukje informatie dat we meeschieten moet wel gedefinieerd worden, dat noemen we ook wel een parameter. Aan die parameter hangt vervolgens een waarde, daarin zit de informatie.
Een voorbeeld:
Iemand bekijkt een t-shirt op de product detailpagina. Het view_item event wordt afgevuurd. Bij het event schieten we mee welke kleur het t-shirt is, wat het kost en wat de productnaam is. Zo kunnen we ineens al veel meer terug zien in GA4.
Hoe stel je het in?
Voordat we het in GTM kunnen instellen, moeten we er wel voor zorgen dat de datalayer er is. Vaak komt er een developer bij te pas om de parameters mee te laten schieten en de events correct af te laten vuren. Gebruik je e-commerce systemen zoals WooCommerce, Magento of Shopify? Dan zijn er allerlei plugins die je kunnen helpen. Zo heb je voor Shopify het handige Analizify.
Laten we je wat voorbeelden geven van variabelen die je vaak tegenkomt in datalayers voor e-commerce:
- Currency: De valuta van de prijs.
- Value: De waarde die is gekoppeld aan de gebeurtenis. In het voorbeeld van het t-shirt bijvoorbeeld 49,- euro.
- Items: Producten die zijn gekoppeld aan het event, kunnen er een of meerdere zijn.
- Transaction id: Unieke ID voor de transactie. Let op: Deze is vereist voor aankoop- en terugbetaling events.
- Coupon: Kortingsbon die is gekoppeld aan de gebeurtenis.
- Affiliation: De winkel of affiliatie waar de aankoop heeft plaatsgevonden.
- Payment type: De betaalmethode die is verzonden met het event add payment info.
- Shipping: Verzendkosten inbegrepen in de totale omzet van de aankoop.
- Tax: Hoeveel belasting is inbegrepen in de totale omzet van de aankoop.
Uiteraard kun je nog meer meesturen, het is aan jou. Let wel op dat sommige variabelen vereist zijn.
GA4 e-commerce events aanmaken in de Google Tag Manager webcontainer
Stap 1: GA4 gebeurtenis toevoegen aan GTM
Onderstaande stappen hebben we ook gebruikt in onze vorige uitleg voor de “reguliere” GA4 events. Echter dienen we bij een e-commerce net wat meer in te stellen. In dit voorbeeld maken we gebruik van het “Purchase” event.
- Ga naar je web container in Google Tag Manager.
- Ga naar Tags.
- Klik op Nieuw en ga naar Tag configuratie.
- Kies bij Tag type voor de Google Analytics: GA4-gebeurtenis.
- Voer de Metings-ID in waar je het event heen wil schieten. Als het goed is heb je, uit de vorige uitleg, hier al een variabele voor, zoals: {{ GA4 | Measurement-ID }}.
- Geef de tag een logische naam, zoals “GA4 | Event | Purchase”.
- Zorg ervoor dat de tag een bijpassende trigger heeft zodat het op het juiste moment wordt afgevuurd.
Staat de trigger goed? Klik dan op opslaan.
Stap 2: Variabelen bij het event aanmaken en toevoegen
Weet je nog dat we het eerder in deze uitleg hebben gehad over de datalayer en de aanvullende data die daarin kan meekomen? Zo niet, lees het dan even. Nu is het tijd om die aan te maken en toe te voegen in GTM, zodat ze meegeschoten kunnen worden in het GA4 event dat je in stap 1 hebt aangemaakt.
- Ga naar het menu item variabelen in GTM.
- Klik op Nieuw en kies Variabele voor gegevenslaag.
- Geef de variabele een logische naam. Laten we in dit voorbeeld de “Value” toevoegen. We noemen de variabele dan bijvoorbeeld “DLV | ecommerce.value” waar DLV staat voor Data Layer Variable (en in het Nederlands dus Variabele voor gegevenslaag)..
- Zorg dat de data layer variable name overeenkomt met de naam in je datalayer. Zo weet Google Tag Manager waar hij de waarde vandaan kan halen. Je bent dus eigenlijk de variabelen aan het mappen.
Ga vervolgens naar je aangemaakte GA4 event en vul in dit voorbeeld bij Gebeurtenisparameter “value” in. Bij waarde kies je voor de naam die je bij drie hebt aangemaakt (DLV | ecommerce.value) door op het plusje te drukken en de variabele te kiezen.
Herhaal het toevoegen van de variabelen totdat je alle gewenste variabelen hebt.
Stap 3: Testen
Je doet er altijd goed aan om zeker te weten dat je event ook afgevuurd wordt (en dus de juiste trigger heeft). Ook willen we zien of de variabelen informatie meesturen.
- Open GTM preview/voorbeeld modus.
- Zorg dat je de juiste website URL invoert waarop je de actie die leidt tot het event kan uitvoeren.
- Voer de actie uit die leidt tot het triggeren van de tag, bijvoorbeeld het invullen van een leadformulier op de contactpagina. Kijk in het preview venster of er onder Tags Fired je tag “GA4 | Event | Purchase” is afgevuurd.
- Publiceer de wijzigingen in je GTM-container.
Je hebt er nu voor gezorgd dat het event met de naam “Purchase” naar GA4 wordt gestuurd. Herhaal bovenstaande stappen om ook andere GA4 events in te regelen.
Vervolgstappen
- Denk na over welke events je allemaal nodig hebt en implementeer waar nodig meer e-commerce gebeurtenissen in GA4 en GTM met bovenstaande stappen.
- Ga aan de slag met GA4 in de server side container (sGTM) waarmee je zowel client als serverside events mee kan meten om je data volledigheid te vergroten.
FAQ
- Wat is een datalayer en waarom is deze belangrijk voor e-commerce tracking? Een datalayer is een aparte laag code die belangrijke informatie bevat over gebruikersinteracties en e-commerce gebeurtenissen op je website. Het fungeert als een brug tussen je website en Google Tag Manager, zodat je relevante gegevens kunt verzenden voor tracking. Het implementeren van een datalayer is cruciaal omdat het de benodigde informatie levert die nodig is om nauwkeurige e-commerce rapporten in Google Analytics 4 op te bouwen. Typische data dat terug zou kunnen komen in een datalayer is bijvoorbeeld de prijs, hoeveel items er in de winkelwagen zitten of wat de kleur van een product is.
Bronnen
- Google Analytics developers documentatie https://developers.google.com/analytics/devguides/collection/ga4/ecommerce?client_type=gtag
- Analytics help Set up ecommerce events https://support.google.com/analytics/answer/12200568?hl=en