Naar de inhoud

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

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 dataLayer pushen 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. 1 Open tagmanager.google.com en klik op Create Account.
  2. 2 Vul een Account Name (je bedrijf) en je Country in.
  3. 3 Vul onder Container Setup je domein in als Container name, bijvoorbeeld www.example.com.
  4. 4 Kies Web als Target platform en klik op Create.
  5. 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. 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. 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. 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.

HTML
<!-- 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.

HTML
<!-- 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.

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.

JavaScript
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. 1 Ga naar Triggers, klik op New en kies Custom Event.
  2. 2 Zet Event name op sign_up (dat moet exact overeenkomen, ook qua hoofdletters) en sla op.
  3. 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. 1 Klik rechtsboven in de workspace op Preview. Tag Assistant opent in een nieuw tabblad.
  2. 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. 3 Ga terug naar het Tag Assistant-tabblad. Links zie je events zoals Consent Initialization, Initialization, Container Loaded, DOM Ready en Window Loaded.
  4. 4 Voer op je site de aanmelding uit. Er verschijnt een sign_up-event; klik erop en open het tabblad Data Layer om method: email te 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. 1 Klik rechtsboven op Submit.
  2. 2 Laat Publish and Create Version geselecteerd.
  3. 3 Vul een Version name en Version description in die zeggen wat er veranderd is, bijvoorbeeld Add sign_up trigger.
  4. 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 zijn method-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