Send data til Google Tag Manager med data layer-objektet

Utgangspunktet

Utgangspunktet mitt for denne veiledningen er ikke å starte helt på begynnelse. Fra før av har jeg:

• tilgang til å redigere sidekode på et nettsted
• koblet nettstedet til Google Tag Manager.
• koblet Google Tag Manager og Google Analytics sammen. Les Kom i gang med Google Analytics 4
• koblet en Google Data Studio-rapport til et Google Analytics 4-område som datakilde

Koden som utgangpunkt

Koden under er laget med utgangspunkt i flere veiledninger. Metoden avviker noe fra Googles egen dokumentasjon, men er sånn for at jeg skal kunne bruke den hvor som helst på nettsiden min, uten at koden ødelegger for resten av Google Tag Manager-oppsettet.

Dette er en kode som kan settes inn på produktsider. I mitt tilfelle har jeg brukt den på undersidene til Butikk og Tjenester her på nettsiden.

Har du andre typer sider, kan du bruke andre Google-anbefalte hendelser eller lage egne. Tanken bak dette innlegget er å presentere et oppsett fra start til slutt, og overlate til deg å gjøre egne tilpasninger til din nettside og ditt CMS eller system.

Vi begynner med å lime inn denne koden i en nettsidemal. For min nettside som som bruker ProcessWire, så er det filen product.php som er plassert under /site/templates/ som gjelder.

Det neste trinnet er å erstatte det som begynner med VARIABLE_ med kode som henter informasjon ut fra systemet. Resultatet i mitt tilfelle blir dette:

Så åpner jeg nettstedet mitt i en nettleser. Og går til en side som bruker nettsidemalen jeg nylig har redigert, viser kildekoden til nettsiden og ser at de ulike variablene er erstattet med meningsfulle data.

Oppsett i Google Tag Manager

I Google Tag Manager skal jeg lage en variabel, en utløser og en tag. Men først skal jeg sjekke at data layer-objektet fanges opp.

Jeg aktiverer forhåndsvisningen av nettstedet med Google Tag Manager. Når forhåndsvisningen kjører og jeg har blitt sendt til nettstedet min, bla jeg meg inn på en produktside.

view_item skal dukke opp i venstre sidestolpe inne på feilsøkingssiden til Google Tag Manager. Jeg trykk på den og på fanen Data Layer, og ser nå opplysningene fra nettsiden fra koden jeg la inn.

Variabelen

Så går jeg til variabeloversikten og trykker på Ny for å lage en brukerdefinert variabel. Jeg gir den navnet GA4 Ecommerce DataLayer. Som variabeltype velger jeg Variabel for datalag. Som navn på datalagsvaribel skriver jeg inn ecommerce.items, og avslutter med å Lagre.

Utløseren

Deretter går jeg til utløseroversikten og trykker på Ny for å lage en utløser. Jeg gir den navnet Event – view_item. Som utløsertype velger jeg Egendefinert hendelse. Som navn på hendelsen skriver jeg inn view_item, og avslutter med å Lagre.

Taggen

Så går jeg til tagoversikten og trykker på Ny for å lage en tag. Jeg gir den navnet GA4 Event – view_item. Som tagtype velger jeg Google Analytics: GA4-hendelse. Som konfigurasjonstag velger jeg Google Analytics: GA4-konfigurasjon-tagen jeg opprettet når jeg satte opp Google Analytics 4 i Google Tag Manager. Hvordan jeg gjorde dette kan du lese om i blogginnleget Kom i gang med Google Analytics 4.

Som navn på hendelsen skriver jeg inn view_item. Under Hendelsesparametere legger jeg inn en ny rad med Paramenternavn items. Som Verdi henter jeg fram varibelen GA4 Ecommerce DataLayer.

Til slutt velger jeg Event – view_item som utløser og trykker på Lagre.

Testing

For å teste at alt foregår som det skal, setter jeg i gang forhåndsvisningen av nettstedet med Google Tag Manager på nytt, for å få med det nye oppsettet i feilsøkingen.

I tillegg åpner jeg Google Analytics 4 i en ny nettleserfane. Der navigerer jeg meg frem til Konfigurer og DebugView. Denne feilsøkningsvisningen snakker godt sammen med den åpne Google Tag Manager-forhåndsvisningen.

Så går jeg tilbake til fanen med nettstedet mttn som Google Tag Manager åpnet i stede. Her blar jeg meg inn på en produktside.

En liten stund etter at jeg landet på produktsiden så skal det i Google Analytics 4 dukke opp view_item på tidslinjen i DebugView. Og ved å trykke på den blå view_item-sirkelen og på fanen Elementer, så kommer detaljene fra kodesnutten opp. I skrivende stund så gjengis prisen med altfor mange nuller her. Det er en kjent feil i DebugView, men skal ikke ha noe å si for den faktiske datainnsamlingen.

Dette er alt jeg trenger av datainnsamling og testing for å gå videre til å lage en rapport.

Oppsett i Google Data Studio

I Google Data Studio starter jeg med å åpne en rapport som jeg allerede har koblet til mitt Google Analytics 4-område. Jeg oppretter en ny side i rapporten og velger å sette inn et diagram av typen tabell.

I tabellen henter jeg inn følgende dimensjoner:

• Vare-ID
• Varenavn
• Varekategori

Som beregning henter jeg inn:

• Antall hendelser

Og det var alt. Da har jeg en enkel oversikt over hvor mange produkter som er vist et visst antall ganger.

Noen ord på slutten

Jeg har med vilje hoppet over mye bakgrunnsinformasjon denne veiledningen. Mest for å kortfatte den, sånn at du som leser fort kan komme i gang og prøve ut selv. Men et par ting vil jeg tilføye.

Det ene er at dimensjonene vi har navngitt helt fra kodesnutten i starten når det gjelder vårt ecommerce-oppsett, er forhåndsdefinerte. Derfor kan de hentes ut med navnene Vare-ID, Varenavn og Varekategori på slutten i Google Data Studio. Google Analytics 4 kjenner de igjen. Du kan lage egne dimensjoner, men da må du gjøre noen flere tilpasninger: En av de er å opprette egendefinerte dimensjoner i Google Analytics 4, noe jeg gjør i veiledningen Sporing av 404-feil med Tag Manager, Analytics og Data Studio.

En annen ting som er verdt å nevne, er at det kan ta litt tid før de nye dataene du har startet å samle inn kan brukes i Google Data Studio. En måte å fremskynde prosessen litt på, er: I Google Data Studio og redigeringsmodus av rapporten, gå til menyen Ressurs og Administrer datakildene som er lagt til. Trykk på Endre for datakilden som gjelder Google Analytics 4. Nederst til venstre i bildet finner du et valg Last inn feltene på nytt. Dette er spesielt nyttig om du har opprettet egendefinerte dimensjoner i Google Analytics 4. For på den måten kan du bruke disse raskere.

Er noe uklart?

Om om noe er uklart i dette blogginnlegget, så send meg gjerne en beskjed med kontaktskjema, så skal jeg justert på veiledningen.