Handleiding Google Tagmanager (GTM) Inhoudsopgave

  • Published on
    14-Feb-2017

  • View
    213

  • Download
    0

Embed Size (px)

Transcript

  • Handleiding Google Tagmanager (GTM)

    Inhoudsopgave Basisbeginselen .................................................................................................... 2 Google Tagmanager in de praktijk .............................................................................. 4 Meerdere domeinen doormeten ................................................................................12 E-commerce tracking met Google Tagmanager .............................................................14

    De geoptimaliseerde E-commerce module ................................................................17 Event tracking via Google Tagmanager .......................................................................42

    Kliks op call-to-action knoppen ..............................................................................42 Uitgaande links .................................................................................................45 Pop-ups/ins bijvoorbeeld voor je nieuwsbrief-inschrijving ....................................52

    Aanvullende mogelijkheden event tracking via Google Tagmanager ....................................55 Instellen van een aangepaste bounceberekening ........................................................55 Afhakers binnen je formulieren achterhalen ...............................................................59 Meten van de interactie met je YouTube videos .........................................................66 Scrolldiepte meten in Google Analytics ....................................................................71 Geen weergegeven zoekresultaten ...................................................................76 De voordelen van Google Tagmanager ....................................................................82

  • Met Google Tagmanager kun je alle meetcodes vanuit n programma op je site plaatsen. Je kunt het vergelijken met een cms zoals WordPress of Drupal, maar dan voor je meetcodes. Met een tagmanagementsysteem hoef je een webbouwer geen opdrachten meer te geven om meetcodes te plaatsen. Je kunt deze meetcodes namelijk zelf plaatsen. Dit tagmanagementsysteem zet ze dan op je site. Hoe gaat dat in zijn werk? In een vorige handleiding heb ik de te nemen stappen voor een Google Analytics-implementatie besproken. Ik ging hierbij uit van een implementatie waarbij je de meetcodes zelf op de website moet (laat) plaatsen. Je kunt er ook voor kiezen om Google Analytics te implementeren via Google Tagmanager. Misschien denk je nu: wat is Google Tagmanager?

    Basisbeginselen

    Voordat je met Google Tagmanager gaat werken, dien je te weten hoe dit tagmanagementsysteem werkt. Binnen Google Tagmanager heb je de beschikking over de volgende tools: De container. Dit is de enige code die je op je site plaatst. De container activeert jouw meetcodes. Daardoor hoef je de Google Analytics- en conversie-code voor AdWords niet meer in de live-omgeving van je site te plaatsen. In Google Tagmanager noemen ze dit het firen van de meetcode. Tag. Dit is jouw meetcode. Bijvoorbeeld jouw Google Analytics- of conversie-code voor AdWords. Maar je kunt bijvoorbeeld ook een tag aanmaken voor externe systemen zoals bijvoorbeeld ClickTale. Aan deze tag moet je een trigger (activatie) koppelen. In de vorige versie was de technische benaming hiervoor rule (regel). Je wilt bijvoorbeeld jouw meetcode op een bepaalde pagina of op alle paginas activeren. Ik kan me voorstellen dat je de Google Analytics-code op iedere pagina wilt plaatsen, maar je conversiecode voor AdWords alleen op de bedankpagina, nadat een bezoeker jouw product besteld heeft of een offerte heeft aangevraagd. Ten slotte heb je ook de mogelijkheid om variabelen te gebruiken. In de vorige versie was de technische benaming hiervoor macro. Met variabelen kun je specifieke

    http://www.google.nl/tagmanagerhttp://www.ganalytics.nl/whitepaper-implementatie/

  • informatie aan de tag toevoegen. Je hebt de beschikking over ingebouwde variabelen, zoals de urls van je paginas (page url) en de kliks op een knop of uitgaande link (click url). Daarnaast kun je eigen variabelen toevoegen. Een voorbeeld hiervan is het signaleren van een Youtube video.

  • Google Tagmanager in de praktijk

    Vervolgens wil je natuurlijk met Google Tagmanager aan de slag. Hoe kun je dit het beste aanpakken? Laat eerst de container tag op iedere pagina van jouw site plaatsen. Deze plaats je tussen de - en -tag. Deze container-tag kun je ophalen via beheerder Google Tagmanager installeren:

    Tags aanmaken

    Vervolgens kun je je tags gaan aanmaken. Bijvoorbeeld de standaard Google Analytics-code. Maak eerst een tag aan:

    Kies als tag voor Google Analytics;

    Vervolgens kies je als tagtype voor Universal Analytics;

    Nu dien je de tracking-id in te vullen. Mijn advies is om hiervoor een variabele aan te maken, zodat je spelfouten kunt voorkomen:

  • Bovenstaande variabele kun je invullen binnen je standaard meetcode:

  • Je geeft je standaard meetcode een beschrijvende naam en je kiest voor de aangemaakte variabele UA-code. Daarnaast vink je functies voor display advertenties inschakelen aan om de demografische rapporten in Google Analytics te activeren. Ten slotte kies je voor de trackingtype paginaweergave.

    Onder Veldnaam kun je de meting van je sitespeed meting aanpassen. Standaard gebruikt Google Analytics voor je sitespeed meting een relatief kleine steekproef. Om deze steekproef te verhogen dien je onderstaande variabelen aan te maken:

  • In bovenstaand voorbeeld stel ik allereerst de variabele debug_mode (fouten oplossen) in. Vervolgens stel ik een lookup-table (opzoek tabel) in. Ik gebruik hierbij de zojuist ingestelde variabele debug_mode. Ten slotte stel ik twee regels in, zodat ik de steekproef kan verhogen naar 100%. Disclaimer: voor sites met veel bezoekvolume adviseer ik om spaarzaam om te gaan met deze variabele. Je wilt namelijk met deze aanvullende meting je site performance niet teveel aantasten. Je kunt er bijvoorbeeld voor kiezen om binnen de uitgang niet te kiezen voor 100, maar bijvoorbeeld 50%. Ten slotte wil je natuurlijk weten of Google Tagmanager je tag heeft geactiveerd. Dit kun je nagaan via de functionaliteit fouten opsporen. Klik hiervoor achtereenvolgens op versie maken en voorbeeld. Nu kun je de geactiveerde meetcodes via Google Tagmanager bekijken en je tag definitief publiceren.

  • Remarketing of AdWords conversiecode

    Op dezelfde manier kun je ook je Remarketing- of AdWords-conversiecode activeren. Het enige verschil is dat je voor deze meetcodes het conversie-ID uit je AdWords-account dient te achterhalen en in te vullen:

    Stap 1

    Stap 2

    Stap 3

  • Tip: installeer de Chrome-extensie Tag assistant om je meetcodes te kunnen testen.

    https://chrome.google.com/webstore/detail/tag-assistant-by-google/kejbdjndbnbjgmefkgdddjlbokphdefk

  • Meerdere domeinen doormeten

    De doormeting voor meerdere domeinen met Google Tagmanager is eenvoudiger dan hard-coded door de webbouwer. Je kunt namelijk met n tag dit voor elkaar krijgen. Dat gaat als volgt:

    Je kiest als tagtype voor Universal Analytics;

    Vervolgens kies je als trigger wederom voor alle paginas van de site;

    Nu dien je de allowLinker op true te zetten en de cookieconfiguratie voor het cookiedomein in te vullen. Zo blijft de cookiewaarde behouden voor alle domeinen. Indien je dit niet invult, geeft Universal Analytics de hoofddomeinen weer als verwijzende site in je statistieken.

    Tip: maak van de benaming van je cookiedomein een variabele om typfouten te voorkomen!

  • Nu kun je de domeinen aan elkaar koppelen;

    Tip: ook hierbij adviseer ik om voor de koppeling van de domeinen een variabele in te stellen om typfouten te voorkomen.

  • Tot slot dien je te testen of de domeinen daadwerkelijk aan elkaar gekoppeld zijn. De toevoeging ga= wil zeggen dat de cross-domain tracking implementatie succesvol is geweest.

    http://www.digitalanalisten.nl/category/google-analytics/#_ga=1.189664747.1742965705.1428487983

    E-commerce tracking met Google Tagmanager

    Naast het doormeten van meerdere domeinen, kun je ook de reguliere E-commerce module activeren via Google Tagmanager. Hiervoor dien je onderstaande zaken in te stellen:

    http://www.digitalanalisten.nl/category/google-analytics/#_ga=1.189664747.1742965705.1428487983http://www.digitalanalisten.nl/category/google-analytics/#_ga=1.189664747.1742965705.1428487983

  • Je dient allereerst een data-Layer aan te laten maken door de webbouwer, waarin je het daadwerkelijke script laat plaatsen. Deze dien je boven de container tag te plaatsen. Zo kan Google Tagmanager jouw E-commerce script activeren.

    dataLayer = [{

    'transactionId': '[Server Variable]', // Transaction ID - Type:String - Vereist

    'transactionAffiliation': '[Server Variable]', // store name - Type:String Optioneel

    'transactionTotal': [Server Variable], //total revenue - Type:Numeric - Vereist

    'transactionTax': [Server Variable], // Tax amount for transaction - Type:Numeric -

    Optioneel

    'transactionShipping': [Server Variable], // Shipping cost - Type:Numeric -

    Optioneel

    'transactionProducts': [{

    'sku': '[Server Variable]', // Product SKU - Type:String - Vereist

    'name': '[Server Variable]', // Product Name - Type:String - Vereist

    'category': '[Server Variable]', // Product Category - Type:String - Optioneel

    'price': [Server Variable], // Product Price - Type:Numeric - Vereist

    'quantity': [Server Variable] // Product Quantity - Type:Numeric - Vereist

    },{

    'sku': '[Server Variable]', // Product SKU - Type:String - Vereist

    'name': '[Server Variable]', // Product Name - Type:String - Vereist

    'category': '[Server Variable]', // Product Category - Type:String - Optioneel

    'price': [Server Variable], // Product Price - Type:Numeric - Vereist

    'quantity': [Server Variable] // Product Quantity - Type:Numeric - Vereist

    }]

    }];

    Vervolgens dien je de trigger voor je E-commerce tag te bepalen. Kies hierbij voor paginaweergave en vervolgens voor het triggertype dom gereed. Je wilt namelijk met deze trigger alleen het E-commerce script activeren op deze

  • pagina. Ten slotte vul je de bedankpagina van de bestelling in onder activeren ingeschakeld:

    Nu maak je onderstaande E-commerce tag aan. Je kiest hierbij als trackingtype voor transactie:

  • Vervolgens kies je onder meer voor de zojuist ingestelde trigger:

    Tip: plaats een testbestelling op je eigen site, zodat je kunt nagaan of je implementatie succesvol is geweest.

    De geoptimaliseerde E-commerce module

    In Universal Analytics is het mogelijk om de geoptimaliseerde E-commerce module te activeren. Hiermee kun je het gehele winkelgedrag in de webshop gaan monitoren. Deze implementatie is een stuk ingewikkelder dan de reguliere E-commerce-module. Daarom adviseer ik om deze implementatie in 2 fasen te doorlopen:

    1. De meettags voor de winkelwagen en check-out; Allereerst dien je de reguliere meetcode aan te passen, zodat je gebruik kunt gaan maken van de geoptimaliseerde E-commerce module:

  • Je dient 2 zaken aan te passen binnen je reguliere Google Analytics tag:

    Je dient te kiezen voor url path onder page;

    Daarnaast dien je de geoptimaliseerde E-commerce functies in te schakelen;

    Vervolgens dien je onderstaand script op de bedankpagina te laten plaatsen boven de container-tag:

    // Send transaction data with a pageview if available

    // when the page loads. Otherwise, use an event when the transaction

    // data becomes available.

    dataLayer.push({

    'ecommerce': {

    'purchase': {

    'actionField': {

    'id': 'T12345', // Transaction ID. Required for purchases and

    refunds.

    'affiliation': 'Online Store',

  • 'revenue': '35.43', // Total transaction value (incl. tax and shipping)

    'tax':'4.90',

    'shipping': '5.99',

    'coupon': 'SUMMER_SALE'

    },

    'products': [{ // List of productFieldObjects.

    'name': 'Triblend Android T-Shirt', // Name or ID is required.

    'id': '12345',

    'price': '15.25',

    'brand': 'Google',

    'category': 'Apparel',

    'variant': 'Gray',

    'quantity': 1,

    'coupon': '' // Optional fields may be omitted or set to empty

    string.

    },

    {

    'name': 'Donut Friday Scented T-Shirt',

    'id': '67890',

    'price': '33.75',

    'brand': 'Google',

    'category': 'Apparel',

    'variant': 'Black',

    'quantity': 1

    }]

    }

    }

    });

    Producttoevoegingen aan winkelwagen Vervolgens wil je de producttoevoegingen aan de winkelwagen gaan bepalen. Maak hiervoor onderstaande trigger aan. Je kiest hierbij voor aangepaste gebeurtenis. Vervolgens vul je addToCart in voor naam van de gebeurtenis. AddToCart is

  • namelijk de event binnen het meetscript voor de producttoevoegingen aan de winkelwagen:

    Vervolgens ga je de daadwerkelijke tag hiervoor instellen. Vul onderstaande gebeurteniscategorie en actie in. Ten slotte dien je de E-commerce functies aan te vinken:

  • Om bovenstaande meettag te kunnen activeren, laat je onderstaand meetscript door de webbouwer op de productdetailpaginas plaatsen boven de container-tag: dataLayer.push({ "event": "addToCart", "ecommerce": { "currencyCode": "EUR", "add": { "products": [{ "id": "f6be8", "name": "Comverges T-Shirt", "price": "33.00", "brand": "Comverges", "category": "T-Shirts", "variant": "red", "dimension1": "M", "position": 0, "quantity": 1 }] } }

  • }); Productverwijderingen uit de winkelwagen Daarnaast kun je ook de productverwijderingen uit de winkelwagen meten met deze vernieuwde E-commerce module. Volg onderstaande stappen om dit in te stellen binnen Google Tagmanager:

    Maak een trigger aan voor de productverwijderingen uit de winkelwagen. Kies hierbij voor aangepaste gebeurtenis. Vervolgens dien je removeFromCart in te vullen binnen activeren ingeschakeld:

    Nu gaan we de daadwerkelijke tag voor deze gebeurtenis instellen. Je vult hierbij onderstaande gebeurteniscategorie en actie in. Ten slotte vink je de E-commerce functies aan:

  • Onderstaand meetscript dien je door de webbouwer te laten plaatsen in de winkelwagen boven de container-tag om deze tag te kunnen activeren:

  • dataLayer.push({ "event": "removeFromCart", "ecommerce": { "currencyCode": "EUR", "remove": { "products": [{ "id": "f6be8", "name": "Comverges T-Shirt", "price": "33.00", "brand": "Comverges", "category": "T-Shirts", "variant": "red", "dimension1": "M", "position": 0, "quantity": 1 }] } } }); Doorkliks naar de check-out

    Allereerst stel je een trigger in voor de doorkliks naar de check...

Recommended

View more >