Tags zijn tegenwoordig niet meer weg te denken bij websites. Facebook, Linkedin, Hotjar, Google Analytics... ze willen allemaal toegang tot je website om gegevens te kunnen tracken.
Maar een veelvoud aan deze tags kan de performance van je website vertragen.
Daarnaast is het vaak moeilijk nog een overzicht te bewaren welke tags actief zijn op je website. Tag Manager biedt de oplossing. Laat me je erin wegwijs maken met deze Google Tag Manager tutorial.
Google Tag Manager is, zoals de naam het zelf zegt, een manager van tags. Het laat toe om via een eenvoudige interface verschillende tags toe te voegen, aan te passen en te verwijderen zonder dat je de broncode van je website hoeft te wijzigen.
Google Tag Manager versnelt de performance van je website door de verschillende tags in één keer naast elkaar (asynchroon) in te laden in plaats van één na één achter elkaar. Indien je veel tags op je website hebt staan kan je hierdoor je website effectief sneller maken.
In deze Google Tag Manager tutorial doorlopen we 3 stappen:
1. Google Tag Manager instellen
2. Tags migreren
3. Triggers voor Google Analytics aanmaken
*Vereisten voor deze tutorial:
Ga naar Google Tag Manager en volg deze stappen om Google Tag Manager aan je website toe te voegen.
Na het aanmaken van een account zie je een venster waarin de 2 tags van Google Tag Manager tevoorschijn komen. De eerste tag plaats je helemaal bovenaan in de HEAD van de HTML. De tweede tag plaats je bovenaan in de BODY van de HTML. Dit kan je zelf doen of aan een web developer vragen. Eens dit achter de rug is, kunnen we beginnen met het echte werk: het opzetten en migreren van tags.
Is het opzetten gelukt? Prima, nu kunnen we naar het volgende onderdeel van deze Google Tag Manager tutorial.
Als je website al tags bevat, is het belangrijk deze tags te migreren naar Google Tag Manager.
Het migreren van tags staat gelijk aan het verwijderen van de tags op de website en vervolgens deze tags toe te voegen aan Google Tag Manager. Indien we de tags van op de bestaande website niet verwijderen en deze ook in Google Tag Manager invoegen, bestaat de kans dat ieder event dubbel opgenomen wordt doordat er 2 tags actief zijn op de website. Dit zou diensten zoals Google Analytics en Facebook in de war kunnen brengen. Het is daarom belangrijk de bestaande tags te migreren.
Migratie doe je best door volgende stappen te volgen:
Ga naar de broncode van je website en kijk in de HEAD van je HTML welke tags actief zijn op je website.
Let op: Soms plaatsen developers tags ook lager of op willekeurige plaatsen in de code. Je kan dan zoeken via ctr+f naar "Facebook" "hotjar" etc om te zien of je iets tegenkomt of zoeken naar "<!--" wat meestal aanduidt dat er tag volgt.
Voeg vervolgens iedere tag toe aan je tag manager door deze stappen te volgen:
In onderstaand voorbeeld zie je hoe we een Google Analytics tag toevoegen.
Indien je tag niet in de lijst van Google staat, kan je deze tag toevoegen door onderaan de lijst op ‘Custom HTML’ te klikken. Een Facebook pixel inladen in Google Tag Manager kan enkel via ‘Custom HTML’ gedaan worden.
Ga in Preview mode en controleer of de tags actief zijn door naar je webpagina te gaan. Als alles goed verloopt zal je onderaan de website een bar van Google zien waar je al je tags te zien krijgt. Indien je Google Analytics tag actief is, zie je onder de rubriek 'Page view' de tag ‘Google Analytics’, met erboven ‘Tags fired on this event.’
Indien al de tags opgeladen en actief zijn op je website (in preview mode) mag je de originele tags uit de broncode van je website verwijderen.
De laatste stap bestaat eruit je Google Tag Manager te activeren. Dit doe je door op 'Submit' te drukken.
Heb je moeite met het migreren van je tags? Ontdek onze Google Tag Manager opleiding waar we er samen door gaan.
Stel, je wenst te weten wanneer iemand interactie heeft gehad met een element op je pagina. Dan kan je dit via Google Tag Manager doen in combinatie met Google Analytics.
Google Tag Manager is opgebouwd uit 3 onderdelen:
Om te beginnen gaan we de Google Analytics tag activeren voor wanneer iemand op de knop 'ontdek onze oplossingen'op onze website djet.
Als eerste gaan we de gepaste variabele toevoegen. Dit doen we door de juiste variabele uit de lijst te selecteren. In ons geval is dit de click variabele. Hoe je dat precies doet zie je hieronder.
Als de click variabelen geselecteerd zijn gaan we naar de lijst met tags.
De volgende stap is het toevoegen van een trigger.
Nu de trigger ingesteld is op een klik die gelijk is aan een ID op je pagina, moeten we de juiste ID van de knop terugvinden.
Om te kijken als onze tag geactiveerd wordt bij het klikken van de knop gaan we in Preview mode. We zien onderaan dat de tag geladen is op onze pagina. Als we klikken op de knop zien we dat de tag geactiveerd is.
Je hebt nu succesvol een trigger opgezet in Google Tag Manager. Weet dat je ook heel wat andere triggers buiten 'Click' kan opzetten. Eens je daarmee klaar bent, kan je de data van die triggers terugvinden onder 'Behaviour' en 'Events' in Google Analytics. Hoe je deze data nadien kan verwerken in Google Data Studio ontdek je in deze blog. Of ontdek hoe je dankzij deze events jouw website kan verbeteren dankzij Google Analytics.
Heb je aan deze Google Tag Manager tutorial niet voldoende of duik je er liever met een expert in? Rek dan een half dagje uit om met ons jouw Tag Manager te implementeren en de juiste triggers en variabelen in te stellen tijdens een praktische opleiding Google Tag Manager.
En? Ben jij getriggerd? ;-)
Groeten,
Thibaut