Google Tag Manager op je website installeren (webcontainer)
Met Google Tag Manager (GTM) voeg je trackingtags toe en pas je ze aan zonder voor elke wijziging de code van je site te bewerken. Je installeert één keer een kleine snippet, en vanaf dan beheer je GA4, advertentiepixels en andere tags in de GTM-interface. In deze les maak je de webcontainer aan, installeer je hem, stuur je je eerste eigen event en publiceer je een versie. Elke volgende les bouwt voort op deze container.
Beginner 8 min lezen Versie 1.3, bijgewerkt op 4 november 2026
Op deze pagina
Wat je leert
- Een GTM-account en een webcontainer voor je site aanmaken.
- De container installeren met de snippets van Better Loader, of met de head-snippet en de
noscript-snippet van Google. - Een eigen event naar de
dataLayerpushen en het zien in de Preview-modus. - Een containerversie indienen en publiceren, en weten waar workspaces en versies voor dienen.
Voordat je begint
- Een Google-account.
- Toegang tot de template of het CMS van je website, zodat je code aan elke pagina kunt toevoegen.
01 Maak het account en de webcontainer aan
Eén GTM-account hoort meestal bij één bedrijf. Daarin maak je per website een container aan (en later een aparte servercontainer, die les 2 behandelt).
- 1 Open tagmanager.google.com en klik op Create Account.
- 2 Vul een Account Name (je bedrijf) en je Country in.
- 3 Vul onder Container Setup je domein in als Container name, bijvoorbeeld
www.example.com. - 4 Kies Web als Target platform en klik op Create.
- 5 Accepteer de servicevoorwaarden van Google Tag Manager (en de Data Processing Terms als je in de EER of het VK zit).
GTM toont dan het venster Install Google Tag Manager met twee snippets. Je container-ID heeft de vorm GTM-XXXXXXX en staat in allebei.
02 Plak de twee snippets
Je kunt de container op twee manieren laden. Elke manier gebruikt twee snippets: één in de <head> en een fallback direct na de openende <body>-tag. Kies één manier en gebruik alleen die snippets, anders laadt GTM twee keer.
Welke snippets installeer je?
Kies dit als je website een container op SGTM.space heeft. Better Loader laadt GTM vanaf je eigen laaddomein, zoals load.k7q2x.example.com, onder een willekeurige scriptnaam in plaats van vanaf googletagmanager.com, zodat adblockers hem minder vaak tegenhouden. Hij zit in elk abonnement, ook in het Gratis-abonnement, en werkt al voordat je servercontainer is ingesteld.
- 1 Maak op SGTM.space een container aan voor je website, zoals les 2 laat zien: vul het ID van deze webcontainer in (
GTM-XXXXXXX) en laat Better Loader aanzetten voor GTM-XXXXXXX aangevinkt. De servercontainer kun je later koppelen. Heb je al een container, vul het ID dan in op de kaart Better Loader op het tabblad Add-ons en klik op Aanzetten. - 2 Voeg op het tabblad DNS de CNAME voor het laaddomein toe waar je DNS beheerd wordt (DNS only bij Cloudflare) en klik op DNS controleren. Het HTTPS-certificaat volgt binnen een paar minuten.
- Type
- CNAME
- Name
load.k7q2x- Value
eu.sgtm.space- Proxy
- DNS only
- 3 Klik op Instellingen op de kaart Better Loader. De Installatiesnippet en de Noscript-fallback op die pagina zien eruit zoals de twee hieronder, met je eigen laaddomein en scriptnaam.
Plak de Installatiesnippet zo hoog mogelijk in de <head> van elke pagina. Hij laadt GTM asynchroon, dus hij blokkeert het renderen niet.
<!-- Google Tag Manager -->
<script data-cfasync="false">(function(w,d,s,l){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s);j.async=true;j.src="https://load.k7q2x.example.com/h3k9x2mq7tbp.js";f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer');</script>
<!-- End Google Tag Manager -->Plak de Noscript-fallback direct na de openende <body>-tag. Die dient als fallback voor browsers waarin JavaScript uitstaat.
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://load.k7q2x.example.com/ns.html"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->- Deze twee vervangen beide snippets van Google. Haal de snippet van Google weg als je site die heeft.
- Geen van beide bevat een
GTM--ID: Better Loader herkent je container aan de scriptnaam. Een CMS-veld dat alleen een GTM-ID accepteert, kan ze niet installeren, dus plak ze in je thema of layout. - Plak ze pas als het laaddomein live is. Zolang het DNS-record niet resolvet, laadt GTM niet op je site.
- De Installatiesnippet heeft
data-cfasync="false": het voorkomt dat Cloudflare Rocket Loader GTM vertraagt en kan verder geen kwaad. Staat je script met de standaardtoestemming erboven, geef dat dan hetzelfde attribuut.
Kies dit als je website nog geen container op SGTM.space heeft, of als je met de gewone opzet wilt beginnen. Je stapt later over op Better Loader door beide snippets te vervangen. Je GTM-container blijft dezelfde.
Plak de eerste snippet zo hoog mogelijk in de <head> van elke pagina. Hij laadt GTM asynchroon, dus hij blokkeert het renderen niet.
<!-- Google Tag Manager -->
<script data-cfasync="false">(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<!-- End Google Tag Manager -->Plak de tweede snippet direct na de openende <body>-tag. Die dient als fallback voor browsers waarin JavaScript uitstaat.
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->- Gebruik in beide snippets je eigen container-ID, niet
GTM-XXXXXXX. - De snippet hierboven heeft
data-cfasync="false", dat in de versie van Google ontbreekt: het voorkomt dat Cloudflare Rocket Loader GTM vertraagt en kan verder geen kwaad. Staat je script met de standaardtoestemming erboven, geef dat dan hetzelfde attribuut. - Veel platforms hebben een veld voor GTM of de Google-tag (WordPress-plug-ins, de Google-tag-instelling van Webflow onder Site settings, Apps & Integrations). Shopify gebruikt in plaats daarvan een custom pixel onder Settings, Customer events. Gebruik maar één methode, nooit allebei, anders laadt GTM twee keer.
Zet de snippets in een gedeeld layout- of themabestand, zodat ze op elke pagina staan en niet alleen op de homepage.
03 Stuur je eerste eigen event via de dataLayer
De dataLayer is een JavaScript-array die je site en GTM delen. Je code pusht objecten erin, en GTM reageert erop. Een object met een event-sleutel wordt een event waar triggers naar kunnen luisteren; de andere sleutels worden waarden die je uitleest met Data Layer Variables.
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: 'sign_up',
method: 'email'
});Voer deze code uit op het moment van de actie, bijvoorbeeld na een geslaagde aanmelding. Zo gebruik je het event in GTM:
- 1 Ga naar Triggers, klik op New en kies Custom Event.
- 2 Zet Event name op
sign_up(dat moet exact overeenkomen, ook qua hoofdletters) en sla op. - 3 Ga naar Variables, klik onder User-Defined Variables op New, kies Data Layer Variable en zet Data Layer Variable Name op
method.
04 Test in de Preview-modus
De Preview-modus laat precies zien wat GTM op je site ziet, voordat er iets live gaat.
- 1 Klik rechtsboven in de workspace op Preview. Tag Assistant opent in een nieuw tabblad.
- 2 Vul de URL van je site in en klik op Connect. Je site opent in een ander venster met een Tag Assistant-badge.
- 3 Ga terug naar het Tag Assistant-tabblad. Links zie je events zoals Consent Initialization, Initialization, Container Loaded, DOM Ready en Window Loaded.
- 4 Voer op je site de aanmelding uit. Er verschijnt een
sign_up-event; klik erop en open het tabblad Data Layer ommethod: emailte zien.
Kan Tag Assistant geen verbinding maken, controleer dan of de snippet op de pagina staat en de juiste container laadt: het ID in de snippet van Google, of het ID van de GTM-webcontainer op de Better Loader-kaart. De les over debuggen noemt meer oorzaken.
05 Dien een versie in en publiceer
Niets wat je in GTM wijzigt, bereikt bezoekers voordat je het publiceert.
- 1 Klik rechtsboven op Submit.
- 2 Laat Publish and Create Version geselecteerd.
- 3 Vul een Version name en Version description in die zeggen wat er veranderd is, bijvoorbeeld
Add sign_up trigger. - 4 Klik op Publish.
- Workspaces zijn concepten. Elke workspace bevat niet-gepubliceerde wijzigingen, zodat twee mensen kunnen werken zonder elkaars werk te overschrijven. Het gratis GTM-abonnement staat drie workspaces per container toe.
- Versions zijn momentopnamen van de container op het moment van publiceren. Onder Versions zie je wie wat gepubliceerd heeft en kun je een oudere versie opnieuw publiceren om terug te draaien.
- Beide snippets staan op elke pagina: die van Better Loader, of die van Google met je eigen
GTM--ID, nooit allebei. - Tag Assistant maakt verbinding met je site.
- Het
sign_up-event verschijnt in Preview met zijnmethod-waarde. - De eerste versie is gepubliceerd met een duidelijke naam.
Veelgestelde vragen
Vervangt de webcontainer mijn GA4-code?
Dat kan. In plaats van de GA4-snippet direct te plakken, voeg je een Google-tag toe in GTM. Les 3 doet dat en stuurt de data via je servercontainer. Verwijder een hardgecodeerde GA4-snippet zodra GTM dezelfde data stuurt, anders tel je alles dubbel.
Better Loader of de snippet van Google?
Gebruik Better Loader zodra je website een container op SGTM.space heeft: hij zit in elk abonnement, ook in het Gratis-abonnement, en laadt GTM vanaf je eigen domein, zodat adblockers hem minder vaak tegenhouden. Gebruik tot die tijd de snippet van Google. Later overstappen betekent alleen dat je beide snippets vervangt. Je GTM-container en de tags erin blijven hetzelfde.
Waarom heb ik de noscript-snippet nodig?
Hij draait alleen als JavaScript uitstaat, en dat is zeldzaam. Google raadt hem toch aan en hij kan geen kwaad, dus installeer hem.
Ik heb gepubliceerd, maar mijn wijziging is niet te zien op de site. Waarom?
Controleer of je de workspace met de wijziging hebt gepubliceerd en ververs de pagina daarna geforceerd. Paginacaches en CDN's kunnen ook een oude HTML-pagina serveren, maar het GTM-bestand zelf wordt binnen enkele minuten bijgewerkt.
Klaar om het in de praktijk te brengen?
Rol in een paar minuten een GTM-servercontainer uit op je eigen domein. Voor het Gratis-abonnement heb je geen creditcard nodig.
Gratis account aanmaken