Custom Shopify Tracking, Datalayers en GA4

Custom Shopify Tracking, Datalayers en GA4

Wordt jij gek van het grote verschil in metingen bij Shopify? Heb je de angst voor Google Analytics 4 (GA4)? Wij gaan de diepte in en geven onderaan deze blog onze instellingen weg!

Vrijblijvende performance analyse

Inhoudsopgave

Gratis tips & inspiratie

Wordt periodiek op de hoogte gehouden over online marketing!

Naam
Emailadres
Ik ontvang graag inspiratie

Het is gelukt!

Je aanmelding is succesvol gelukt.

Wij zullen je periodiek op de hoogte houden van online marketing tips en zullen je  inspiratie opsturen.

Bekijk hieronder direct onze e-books.

Oops! Something went wrong while submitting the form.

Sparren over dit onderwerp?

Laat deze kans niet liggen en neem contact op voor een vrijblijvende performance analyse!

Tracking in Shopify

Goed om te weten: In deze blog leren wij je niet hoe je tracking codes aan de checkout van Shopify kunt toevoegen, dit kan (nog) niet. Wel leer je de allerbeste manier om zowel je e-commerce te tracken als je klantinformatie dankzij het inbouwen van Datalayers, Datalayers te gebruiken en 🥁 ....... 🥁 custom tracking voor Shopify!

Wat zijn datalayers?

First things first, wat zijn Datalayers eigenlijk?

Een datalayer is een specifieke code in de broncode van een website. Het is een bundeling van data informatie wat kan worden ingezet voor tracking, trigger based marketing, marketing automation of e-mailmarketing. Vanaf 2024 is het lastiger om tracking gegevens te verzamelen. Hiervoor kun je server-side tagging inzetten, lees alles over server-side tagging in onze blog!

Wat in de datalayer staat is afhankelijk van de website opzet. Meestal bevat een layer van data een combinatie van website-data, e-mail data, en data uit CRM- en E-commerce-systemen.

Dit is bij de meeste CMS systemen geen standaard en moet custom ingebouwd.

Meer over: Wat zijn datalayers?

Heb ik een datalayer op mijn website?

Laten we nog even beginnen met de basis. Je kunt op verschillende manieren kijken of je een datalayer hebt en wat hierin staat.

Datalayers bekijken in Google Tag Manager

Allereerst is een optie die wij prettig vinden Google Tag Manager. Wanneer je Google Tag Manager op jouw website hebt geïnstalleerd kun je de preview mode starten. Je kunt nu door de website lopen en in de preview tab kun je alle events bekijken en zien welke tags/triggers worden geladen.

Wanneer je inlogt bent kun je klikken op de tab "Datalayers" en zien welke onderdelen er geladen worden bij specifieke events, tags, triggers op de website.

{{ebook-component}}

Chrome extensie Dataslayer

Als tweede optie, vooral werkt dit makkelijk als je "even snel wilt kijken" of geen toegang hebt tot Google Tag Manager.

Je installeert de Chrome extensie Dataslayer, gaat naar de website, opent "inspecteren" en klikt op het Dataslayer tabblad. Hier kun je vervolgens de datalayer variabelen bekijken.

In deze blog gaan wij niet dieper in op het gebruik en datalayers analyseren.

Nu gaan we wat meer de diepte in over Custom Shopify tracking!

Shopify datalayers

Shopify heeft standaard al enkele datalayer onderdelen ingebouwd. Dit is voor standaard events zoals een page_view, page path, page_title, standaard elementen dus.

De basis shopify datalayer bekeken met de Datslayer extensie.
De basis Shopify datalayer bekeken met de Dataslayer extensie.

Wanneer het Google Ads sales kanaal gebruikt worden er al veel onderdelen voor je geladen. Dit sales kanaal zorgt er namelijk onder anderen voor dat je een directe koppeling hebt met het Google Merchent Center, Google Ads, de conversies instelt en je Google Ads remarketing tracking.

Wij ervaren echter dat het lastig is om deze data uit de website te koppelen aan de Google Tag Manager tags (hier komen wij later op terug..... cliffhanger!).

Het is echter erg makkelijk om een custom datalayer aan Shopify toe te voegen.

Onze custom Shopify Datalayer

Bij Chase Marketing hebben wij een custom datalayer gebouwd. Deze code werkt voor alle shops waarmee wij samenwerken en met succes!

Alle e-commerce data meten!

Het eerste onderdeel is de basis code die wij hebben ontworpen om gevuurd te worden op basis van een pagina template. Denk hierbij aan een homepagina, collectie pagina, productpagina, blogs en overige pagina's.

Per pagina template wil je natuurlijk andere onderdelen in de datalayer zetten. Neem een productpagina als voorbeeld. Wij willen op de productpagina alle productinformatie inzien en mogelijk doorsturen naar marketing automation tools of Google Analytics 4.

Shopify datalayer data van een productpagina geanalyseerd met de Dataslayer extensie
Shopify datalayer data van een productpagina geanalyseerd met de Dataslayer extensie

We zien in bovenstaand screenshot dat, dankzij de custom code die wordt gevuurd op de productpagina, de data informatie in de broncode van de website wordt geladen.

Klantendata meten! 😱

We gaan nog een stapje verder! Namelijk het meten van klantendata middels de datalayer.

Wanneer je data wilt meten op basis van herhaal aankomen, data wilt inzetten voor advertising doeleinden, marketing-automations, dan is het super waardevol om deze data in te kunnen zien. Veel tools/add-ons zorgen wel voor de e-commerce data, maar missen de klantinformatie data.

*Disclamer:
Dit is privacygevoelige informatie. Wil je dit op een live website gaan gebruiken, onderzoek altijd eerst de regelgeving.

Shopify datalayer data van klantgegevens, geanalyseerd met de Dataslayer extensie
Shopify datalayer data van klantgegevens, geanalyseerd met de Dataslayer extensie

In bovenstaand voorbeeld zien we alle onderdelen die wij meetbaar maken met onze custom datalayercode voor Shopify. Van "login state" tot aan het e-mail adres van de klant, en zelfs de timestamp (tijd van de pagina die laad).

Oké leuk die screenshots van onze custom trackingcode voor Shopify. Maar hoe stel je dit in?

Custom tracking voor Shopify instellen

In Shopify kun je de broncode bewerken door te gaan naar:
Online Store > Themes > (klik op de 3 bolletjes naast customize) > Edit code

Hier zoek je naar de Theme.liquid file en hierin kun je vervolgens code zetten in de <head>.

Je kunt hier de datalayer push plaatsen. Dit is een voorbeeld van zo'n code:

<script>
window.dataLayer = window.dataLayer || [];

dataLayer.push({
'event': 'Pageview',
'pagePath': '/',
'pageTitle': 'Homepage',
'visitorType': 'customer'
});
</script>

De bovenstaande code kun je in de head van de website plaatsen. Let wel op! Deze code wordt vervolgens op iedere pagina van de web site geladen. Je zult nog een code moeten plaatsen wat uiteindelijk wordt:

<script>

/*** Datalayer: Homepage */
       
       if(document.location.pathname == "/"){
window.dataLayer = window.dataLayer || [];

dataLayer.push({
'event': 'Pageview',
'pagePath': '/',
'pageTitle': 'Homepage',
'visitorType': 'customer'
});
       }
</script>

Met de aanpassing zoals hierboven wordt de code enkel op de homepagina geladen.

We zijn bijna bij het veel besproken punt over "Shopify Google Analytics 4 (GA4)". Maar eerst: Wat doen wij nu met deze datalayers?

Google Tag Manager instellen op basis van onze datalayer

Je hebt niks aan een datalayer als je de informatie niet koppelt aan een tracking, marketing, personaliatie of andere tool. Dan laden we namelijk alleen maar wat extra code in 🤪.

Wij gebruiken Google Tag Manager om de data te koppelen aan, bijvoorbeeld, Google Analytics 4.

Allereerst je data snappen

Je moet allereerst goed weten wat je wilt meten of koppelen. Begin dus altijd met een duidelijk doel voor ogen.

Vervolgens ga je de code opstellen (datalayer). Hierin bouw je de informatie die je wilt gaan meten. Als de codes in de website staan gaan we data-informatie doorsturen en koppelen.

Weet vooral goed welke informatie het kanaal nodig heeft waar je data heen wilt gaan sturen. Moet je bijvoorbeeld met of zonder euroteken de data meesturen?

Datavariabelen koppelen met Google Tag Manager

Wanneer je de preview in Google Tag Manager opent en door de pagina's gaat navigeren kun je de datalayer analyseren. De onderdelen die hier voorkomen (namen van de datalayer regels) kun je instellen als variabelen.

Vervolgens maak je een tag aan en laad je de datavariabelen in. Dit kun je dus gebruiken voor Google Ads Dynamische remarketing data, Google Analytics 4 en veel meer marketing en automations tools.

Shopify Google Analyatics 4 (GA4)

Dan nu het veel besproken Google Analytics 4 voor Shopify!

Wij hebben er in 2022 voor gekozen om zelf een code te gaan ontwikkelen en GA4, door middel van Google Tag Manager (tags & triggers), custom in te stellen. Voor iedere Shopify webshop eigenaar is tracking natuurlijk super belangrijk. Alleen middels betrouwbare data kun je ads optimaliseren en het bedrijf in de goede richting sturen.

Lees hier onze blog over:
Shopify Google Analyatics 4 (GA4) – Het grote geheim!

De toepassing van Shopify tracking en datalayers voor jouw webshop?

Mogelijk denk je nu: Leuk verhaal! En nu? Hoe ga ik dit toepassen?

Custom Shopify tracking is niet "kopiëren en plakken". De code zal altijd op basis van een doel opgemaakt moeten worden en moet voor iedere shop weer even herbouwd te worden.

Vooral het koppelen en testen zijn erg belangrijke onderdelen. Alleen zo kun je echt bouwen op je data.

Wil je een keer sparren over jouw Shopify webshop? Neem contact en wij plannen graag een moment in om eens mee te denken!

Vaak gelezen en bekeken

Chase wordt gevormd door gepassioneerde mensen.

Wat zijn Enhanced Conversions (Verbeterde Conversies) en hoe zet je het in?
Blog
Google Ads

Wat zijn Enhanced Conversions (Verbeterde Conversies) en hoe zet je het in?

Een van de grootste voordelen van online marketing in vergelijking met offline marketing is de meetbaarheid van jouw campagnes.

Shopify SEO-migratie: hoe ziet dit proces eruit?
Blog
Shopify blogs

Shopify SEO-migratie: hoe ziet dit proces eruit?

Heb je genoeg van je huidige webshop platform en wil je iets wat sneller, gebruiksvriendelijker en beter schaalbaar is? Dan is het tijd om te denken aan een Shopify migratie! In deze blog duiken we dieper in de wereld van Shopify en hoe je er voor kunt zorgen dat je je website in een keer perfect overzet. Wat zijn de stappen, waar moet je deze uitvoeren en hoe doe je dat? Pak je koffie en laten we erin duiken!

Wat is offline conversion tracking?
Blog
Online Marketing

Wat is offline conversion tracking?

In de wereld van digitale marketing is het juist meten van conversies onmisbaar. Conversies zoals een aankoop op een website of een ingevuld contactformulier worden vaak ingezet om de campagnes op aan te sturen. Maar als een klant offline een actie onderneemt, wat gebeurt er dan? Dit is waar het concept ‘offline conversion tracking’ om de hoek komt kijken.Offline conversion tracking is het meten van offline acties als gevolg van online marketinginspanningen. Bijvoorbeeld wanneer een lead overgaat naar een qualified lead of zelfs naar een sale.

Maurits Heringa Oprichter Chase Marketing
Brian de Mijttenaere, Mede-eigenaar en online strateeg bij Chase Marketing
Jennifer Daarnhouwer, Head of SEO bij Chase Marketing

Vrijblijvende performance analyse

Jouw doel. Onze strategie.

Naam*
Bedrijfsnaam
Telefoon*
Email*
Iets over je situatie
Maurits Heringa Oprichter Chase Marketing
Brian de Mijttenaere, Mede-eigenaar en online strateeg bij Chase Marketing
Jennifer Daarnhouwer, Head of SEO bij Chase Marketing
Start jouw performance analyse

Bedankt voor je aanvraag

In het kort

De kennismaking

Tijdens het intakegesprek kijken we samen of er een goede match is tussen jouw behoeften en onze expertise.

De performance analyse

Wij duiken in de huidige fase van je bedrijf, concurrenten en de markt. Analyseren kanalen en komen met een hands-on aanpak.

Oops! Something went wrong while submitting the form.

Sever-Side tracking <span class="rt-h3-onyx">eBook</span>

Gratis tips & inspiratie

Geheel gratis, omdat we vinden dat je kennis deelt.

Let’s talk

Met slimme strategieën, veel kennis en een flinke dosis doorzettingsvermogen zorgen.