Het meten van elke pagina op je website is niet altijd even eenvoudig. In het geval van Single Page Applications bijvoorbeeld, is er aanvullende tracking nodig. Een Single Page Application (SPA) laadt alle bronnen die nodig zijn om door de site te navigeren op de eerste pagina die wordt geladen. Als de gebruiker op links klikt en interactie heeft met de pagina, wordt de nodige inhoud dynamisch geladen en wordt de pagina technisch gezien niet opnieuw geladen, ook al kan de pagina er anders uitzien. Aangezien in een Single Page Application met één pagina alle benodigde code één keer wordt geladen en de pagina niet opnieuw wordt geladen tijdens de hele sessie, kunnen we deze pagina's niet volgen als gewone pageviews.
Hoe meten we Single Page Applications in GA4?
Er zijn eigenlijk 2 manieren om deze pagina's te meten als pageviews in GA4:
- Vertrouwen op enhanced measurment om te luisteren naar de veranderingen in de browsergeschiedenis
- Virtual pageview events
Belangrijk om te weten is dat je moet kiezen voor de een of de ander, want als je beide zou gebruiken, zouden er dubbele pageviews komen. Aangezien enhanced measurment de website url als page_location neemt, hebben wij gekozen voor virtuele pageviews omdat we dan controle hebben over de naamgeving van de URLS, wat ons een beter zicht geeft op de betekenis van die URLS. Daarom gaan we in dit artikel verder in op hoe je een enkele pagina kunt volgen met behulp van virtuele pageviews in GA4.
Virtuele pageviews voorbereiden in GA4 met GTM
Voordat we in deze vrij eenvoudige oplossing duiken, moeten we onze website (DataLayer) en GA4 voorbereiden op het werken met virtuele pageview events.
1. DataLayer
Je moet een nieuw DataLayer event implementeren op de Single Page Application voor elke sectie die je wilt volgen als een pageview. Deze code kan heel eenvoudig zijn en er als volgt uitzien:
2. GA4
Om te voorkomen dat pageviews dubbel worden bijgehouden, moet je enhanced measurement voor pageviews uitschakelen. Dit kun je doen door te navigeren naar admin > property > Data streams > Events > Enhanced Measurment > Pageviews. De instellingen zouden er als volgt uit moeten zien:
Virtual Pageviews in GA4 met GTM
Nu zijn we klaar om de virtuele pageviews te implementeren in GTM. Hiervoor moeten we de volgende stappen volgen:
- Maak een Virtuele Pageview Variabele
- Maak een RegEx-variabele voor pageviews
- Configuratie-tag instellen
- Pageview-gebeurtenis instellen
1. Een virtuele pageview-variabele maken
Maak een nieuwe variabele van het type "Data Layer Variable" en voer de exacte naam in van de parameter die je in de DataLayer stuurt. In ons geval "virtual_url".
2. Maak een RegEx-variabele voor pageviews
Nu moeten we ervoor zorgen dat we alleen virtuele pageviews versturen wanneer dat nodig is en in alle andere gevallen wordt de gewone URL meegestuurd met de pageview. Daarom moeten we een RegEx-variabele maken die de waarde van de URL heeft als het een normale webpagina is, maar de waarde van de virtuele pageview als de pagina een Single Page Application is. Dit ziet er als volgt uit:
3. Configuration Tag instellen
Wanneer de variabelen zijn ingesteld, is de configuratie tag klaar om geconfigureerd te worden. Het belangrijkste is dat we hier het vinkje weghalen voor het automatisch verzenden van een pageview wanneer deze configuratie wordt geladen.
4. Pageview Event instellen
Natuurlijk hebben we een triggering event nodig dat de pageviews naar GA4 stuurt. Dit kunnen we doen door een nieuw GA4 event aan te maken in GTM met de eventnaam "page_view". Natuurlijk moeten we er nu voor zorgen dat we de page_location variabele instellen op onze Regex Variable die dynamisch de url of virtuele pageview selecteert, afhankelijk van de situatie.
Hopelijk heeft dit artikel wat duidelijkheid kunnen scheppen over hoe je Single Page Applications op je website kunt volgen en de waarde van virtuele pageview-events laten zien.
Lotte Vranckx
| LinkedinDit E-mail adres wordt beschermd tegen spambots. U moet JavaScript geactiveerd hebben om het te kunnen zien.
