Server-Side Tagging instellen voor Single Page Applications | One Page App

Een Single Page Application (SPA) of een One Page Application is een webapplicatie die alle benodigde onderdelen laadt wanneer je de pagina voor het eerst bezoekt.

Als je door de site navigeert door op hyperlinks of knoppen te klikken, wordt nieuwe content dynamisch geladen zonder dat de pagina volledig herlaadt. Dit zorgt voor problemen bij webtracking omdat traditionele trackingmethoden afhankelijk zijn van pagina herladingen. Het gevolg is dat alleen de eerste paginaweergave wordt geregistreerd in Google Analytics, terwijl alle volgende navigatie onzichtbaar blijft.

Voordat je begint moet je controleren of de URLs veranderen wanneer gebruikers navigeren. Open je website in een browser, navigeer naar verschillende secties en let op of de URL in de adresbalk verandert. Als URLs niet veranderen heb je hulp van een developer nodig. Als URLs wel veranderen kun je verder met de onderstaande methoden.

Begin met het aanmaken van een History Change Trigger.

1. Open de Google Tag Manager web container.

2. Ga naar Triggers.

3. Maak een nieuwe trigger aan.

4. Kies History Change als trigger configuratie.

5. Geef de trigger een naam en sla op.

Test vervolgens de trigger door de GTM preview mode te activeren. Navigeer door je website en controleer of History events verschijnen in het event overzicht binnen de preview mode. Belangrijk is dat sommige websites meerdere History events tegelijk genereren.

1. Ga naar Variabelen.

2. Maak een nieuwe Door de gebruiker gedefinieerde variabele aan.

3. Selecteer Variabele voor gegevenslaag als variabele configuratie.

4. Vul gtm.oldUrl als variable naam in en sla de variable op met een duidelijke naam zoals "DLV - gtm.oldURL"

5. Open je GA4 page_view gebeurtenistag

Heb je nog geen GA4 page_view tag? Maak dan een nieuwe GA4 event tag aan met als gebeurtenisnaam 'page_view'

6. Voeg twee nieuwe Event Parameters toe

7. De eerste parameter heet page_location en heeft {{Page URL}} als waarde. De tweede parameter heet page_referrer en heeft je {{DLV - gtm.oldUrl}} variabele als waarde.

8. Als trigger voeg je je nieuwe History Change trigger toe aan je bestaande trigger.

9. Sla de GA4 event tag op.

10. Zorg er voor dat je al je andere tags ook deze trigger geeft die op iedere pagina afgevuurd moeten worden.

Cookiebanners van Cookiebot en Consent.Studio vuren één keer per pagina een dataLayer event 'cookie_consent_update' af.

Omdat de pagina niet volledig herlaadt, kan het zo zijn dat deze dataLayer event maar één keer in iemands sessie plaatsvindt. Daarom wil je instellen dat een page_view event gemeten wordt op de eerste pagina ná het verwerken van de consent (om te voorkomen dat je een page_view niet meet omdat de gebruiker nog geen consent gegeven heeft).

Vandaar dat wij adviseren om de volgende twee triggers te gebruiken bij je page_view event tags (als je werkt met een CMP dat 'cookie_consent_update' in de dataLayer heeft).