Google Tag Manager Implementatie – Voor Marketeer & Webdeveloper

by | Jul 20, 2020 | Google Tag Manager | 0 comments

Web Analytics in 2025 - DALL-E

De implementatie van Google Tag Manager is simpel. Plaats een snippet in de <head> en eentje direct na het openen van de <body> tag. En klaar! Toch gaat het mis als een (technisch) marketeer communiceert naar een web developer en visa versa.
In dit blog leg ik de stappen uit voor de implementatie van Google Tag Manager. Onderaan de pagina vind je ook veelvoorkomende fouten. Maak jij deze fouten?

Google Tag Manager Implementatie

Hoe implementeer je Google Tag Manager?

De implementatie of installatie van Google Tag Manager is simpel. Door twee snippets op de website te plaatsen kan de marketeer aan de slag met taggen. De web developer van de website of webshop dient deze snippets op de juiste plek te plaatsen. Dit gaat helaas niet altijd goed.

Een marketeer moet duidelijk en precies zijn over de implementatie. Daarnaast moet een een webdeveloper zich flexibel opstellen en niet direct gevaar zien in dit onbekende stukje code.

De code voor in de <head>

Het is belangrijk dat de onderstaande code zo hoog mogelijk in de <head> wordt geplaatst. Daarnaast moet de code op iedere pagina van de website terugkomen. Google adviseert om het zo hoog mogelijk in de <head> te plaatsen maar als het lager in de <head> komt te staan werkt Google Tag Manager alsnog uitstekend.

Let op! Dit is een dummy code. Iedere Google Tag Manager container heeft z’n eigen unieke ID. Normaliter komt deze te staan op de plek waar nu “UNIEK GTM ID” staat.

De code voor in de <body>

Voor de code in de <body> gelden dezelfde regels als die voor de <head>. Plaats deze direct na het openen van de <body> tag, op iedere pagina van de website. In mijn ervaring ligt dit wat gevoeliger dan de <head> code. Zorg ervoor dat de code echt direct na het openen van de <body> tag koment.

Let op! Ook het onderstaande veld bevat dummy code.

Google Tag Manager implementatie voor WordPress websites

Als je gebruik maakt van een WordPress website dan heb je geluk! In dit geval kan een technisch marketeer de code zelf implementeren!

Afhankelijk van het thema of de module die je gebruikt kun je dit binnen enkele klikken implementeren.
Op het moment van schrijven gebruikt deze website het Divi thema. Deze biedt de mogelijkheid om code, zonder plugin, in de <head> en <body> te zetten. Gebruik je een thema die dit niet ondersteund? Kies dan voor een plugin. Een veelvoorkomende plugin is de “Google Tag Manager for WordPress” plugin van Thomas Geiger. De implementatie van deze plugin wijst zichzelf.

Hieronder zie je een afbeelding van de implementatie van Google Tag Manager op mijn website:

Google Tag Manager Implementatie voor Divi

Fouten bij de implementatie van Google Tag Manager

In principe kan het bovenstaande worden verstuurt in een mailtje van marketeer naar webdeveloper. Toch gaat het vaak mis bij de plaatsing van het Google Tag Manager snippet. Hieronder een paar veelvoorkomende fouten.

 

Fout #1: Google Tag Manager en een Cookiemelding

Het komt voor dat een web developer, met alle goede bedoelingen, de Google Tag Manager snippets achter een cookiemuur plaatst. Tags die in de Google Tag Manager container zijn geplaatst zullen niets doen totdat de cookies zijn geaccepteerd. Google Analytics zal bijvoorbeeld geen data verzamelen totdat de cookies zijn geaccepteerd.

Google Analytics mag namelijk WEL data verzamelen zonder het accepteren van de cookies. De taak ligt niet bij de webdeveloper om dit in te richten maar deze ligt bij de marketeer. Met een kleine aanpassing aan de Google Analytics variabele (zie onderstaande afbeelding) ben je al “AVG Proof”. Voor een volledige handleiding verwijs ik naar de website van de Autoriteit Persoonsgegevens.

Google Analytics AVG proof instellen

Fout #2: Er wordt maar één script geplaatst

Een andere fout die vaak voorkomt is dat er maar één van de twee codes wordt geplaatst. Enkel de code in de <head> of in de <body> plaatsen is niet voldoende om de werking van Google Tag Manager te garanderen.

Zodra er maar één van de twee scripts wordt geplaatst kan het zijn dat de preview modus (Debugger) van Google Tag Manager niet werkt of dat Tags simpelweg niet afvuren. Dit wil je kosten wat het kost voorkomen.

Controleer daarom altijd of beide codes in de broncode staan (ctrl + u), gebruik de Google Tag Assistant om te controleren of je Tags goed afvuren en test het met de debugger. Zie je een balk omhoog komen met daarin je tags? Dan werkt Google Tag Manager naar behoren!

Google Tag Manager Debugger

Fout #3: De code is aangepast

Dit zal niet vaak voorkomen maar toch heb ik dit een aantal keer voorbij zien komen. In sommige gevallen wordt de code aangepast waardoor Google Tag Manager niet meer optimaal werkt. Dit komt voor zodra de code niet in z’n geheel wordt gekopieerd of zodra deze wordt aangepast omwille van snelheid. Bijvoorbeeld, door het “async” attribuut toe te voegen. 

Het is voorgekomen dat een web developer een aanhalingsteken had verwijderd na een wijziging aan de <head>. Voorheen werkte Google Tag Manager naar behoren. Door deze fout ben ik uiteindelijk beide snippets gaan vergelijken, de ene van de live website en de andere uit de implementatie instructies, om uiteindelijk tot de conclusie te komen dat er een aanhalingsteken ontbrak.

Het is ook mogelijk dat de code door de opmaak van een e-mail client is aangepast. Daarom adviseer ik om de Google Tag Manager snippet te verzenden in een kladblok bestand (.txt). Hier blijft de opmaak ongewijzigd.

Hieronder zie je een voorbeeld van een goede en een foutieve code. Kun jij de verschillen ontdekken? 🙂

 

Hulp nodig?

Hulp nodig bij de implementatie van Google Tag Manager? Neem eens een kijkje op de blog van Simo Ahava
In februari 2020 heb ik een Masterclass van hem mogen volgen over geavanceerde Google Tag Manager mogelijkheden.
Simo heeft voor ieder probleem een oplossing!

Ik help je natuurlijk graag verder vanuit Ventastic Solutions. Interesse? Neem contact met me op!

 

Jorg van de Ven

Jorg van de Ven

Sr. Technisch Webanalist / SEO-specialist

Als Web Analyst en SEO specialist houd ik me dagelijks bezig met technische vraagstukken.
Kan de Crawler deze pagina bereiken? Wordt de juiste data wel naar Google Analytics verstuurd? Daar kun je mij voor inschakelen!

Ik heb o.a. gewerkt voor: Trendhopper, Kwantum, Terre des Hommes, Expert, Hero en Startselect.

Heb je een vraag voor me? Stuur me een berichtje via LinkedIn of via mijn contactpagina.

Misschien spreken de volgende blogs je aan?

Web Analytics Trends voor 2025: Ben jij er klaar voor?

Web Analytics Trends voor 2025: Ben jij er klaar voor?

Met de opkomst van nieuwe technologieën en de aanhoudende focus op privacy was 2024 al een jaar vol veranderingen. Denk aan de groeiende populariteit van Google Consent Mode en de toegankelijkheid van Server-Side Tagging. In 2025 zal deze evolutie zich alleen maar...

Third-party cookies gaan verdwijnen: Wat zijn de gevolgen?

Third-party cookies gaan verdwijnen: Wat zijn de gevolgen?

Third-party cookies gaan verdwijnen, en dat gaat impact hebben op je online marketingactiviteiten. Dit is een goede stap richting internetprivacy, maar het zal sommige functionaliteiten van onder andere Google en Meta (Facebook) beïnvloeden. Wat is de exacte impact?...