Spåra content med Enhanced Ecommerce (och få fina blogg-rapporter)

Simo Ahava

Simo Ahava Conversion Jam

I en bloggpost publicerad av Simo Ahava (GA och GTM-hjärna), skriver Simo om enhanced ecommerce och hur han har använt det för spårning på sin egen vällästa analytics-blogg. Det här är en översättning som vi tillsammans med honom valt att publicera här.

Psst! Simo är också keynote speaker på Conversion Jam Stockholm i höst. Han ger där djupdykning i web analytics, mer specifikt ska han omdefiniera engagement. (Ett måste för geeks – men bör inte missas av alla andra som behöver förstå sina geeks).

Mina fingrar har kliat av motivation för att skriva den här artikeln. Ända sedan jag implementerade Enhanced Ecommerce på min blogg för några veckor sedan har jag fått en imponerande mängd användbar och häpnadsväckande data.

I denna artikel kommer jag gå igenom de steg jag tog för att implementera Enhanced Ecommerce och ge exempel på den data jag nu har tillgång till i Google Analytics. Som du kanske har gissat använde jag Google Tag Manager för att implementera Enhanced Ecommerce. OBS! Detta är inte en lathund, utan mer tänkt som inspiration för hur du kan tänka utanför boxen när det kommer till Google Analytics funktioner.

1Ecommerce och content… va?

checkout-funnel

Syftet med denna artikel kanske överraskar dig. Ecommerce plugins används ju vanligtvis för att spåra transaktioner i en e-handel, så vad har det här att göra med content? Helt relevant fråga. Jag har ingen e-handel på min blogg men liksom för en e-handel är varenda besökare som läser mina artiklar värdefulla för mig. Eftersom att de är värdefulla måste det finnas ett sätt att mäta värdet på och möjligtvis använda datan för att skapa referenspunkter för framtida produkter (alltså artiklar) som jag vill skriva.

Enhanced Ecommerce ger dig en hel drös med användbara rapporter bland annat, som inte bara är värdefulla för att spåra transaktioner, utan alla typer av användarengagemang på din sajt. Det enda du behöver göra är att se din sajt ur ett funnel-perspektiv. Alltså, att du översätter Ecommerce termer så att de matchar det konceptuella ramverket din sajt är baserad på, oavsett om det är en blogg, en e-handel, nyhetsportal eller brandad sida.

För min blogg definierade jag termerna ungefär såhär:

  • Product: En bloggartikel.
  • Product price: Antal ord i artikeln.
  • Product impressions: Som minst titeln, men oftast titeln + en ingress-kombination av diverse kategorisidor och i artikel-sidebars.
  • Product list: En sida eller widget som innehåller ett antal product impressions. Exempelvis, min hemsida, kategorisidor, taggade sidor och relaterade artikellistor räknas alla som produktlistor i mina Enhanced Ecommerce inställningar.
  • Product list click: Ett klick på en artikeltitel eller “Läs mer…”-länk i produktlistorna.
  • Product detail view: När artikeln har laddat.
  • Add to Cart: När någon börjar scrolla i artikeln. Jag antar att läsaren vill “köpa” om de börjar scrolla.
  • Checkout: Checkoutfunneln i mina inställningar är baserad på scrollspårning. Det första steget är när läsaren når en tredjedel av artikeln, det andra när hen har scrollat två tredjedelar och det sista när artikelns slut är nått.
  • Purchase: Purchase (köp) registreras när en besökare nått slutet av checkoutfunneln och minst 60 sekunder har gått sedan artikeln laddades in. Jag valde just detta tal slumpmässigt för att sålla bort de som inte läser artikeln utan bara scrollar.

Skicka artikeln till rätt kollega

Uppdatering: Tack vare en idé från Robert Petković har jag nu uppdaterat insamlingsmetoden så att den inkluderar Product Detail impressions och Add To Cart transaktioner. Dessa saknades från den tidigare versionen av denna artikel. Jag har också ändrat checkout-funneln så att den visar scrolldjup.

2Hur du gör

Först om främst, här kommer en länk till det ”Git repository” som finns för denna lösning: eec-gtm.

Jag tänker avslöja min saftiga hemlighet redan nu: jag scrapear från DOM med de inställningar jag har. Det är definitivt inte det mest robusta sättet att göra det här, men eftersom jag är utvecklaren, marknadsföraren, ägaren och content-skaparen på min sajt så vet jag att alla ändringar jag gör är under min kontroll.

Det här sättet borde fungera genom att utnyttja dataLayer. Du kan göra det på flera sätt, exempelvis spara varenda produkt på sidan i dataLayer när sidan laddas och sedan välja de relevanta objekten när impressions laddas, eller när en användare interagerar med sidan, genom exempelvis klick. Ett annat sätt är att spara några produkter i en annan global JavaScript variabel vilket kanske, är lite lättare att tillgå, men samtidigt så orsakar detta problem med global namespace, något som generellt bör undvikas.

Hursomhelst, jag scrapear – för att jag är en scraper, och jag gjorde det för vetenskapen, för framgång och för teknikens skull. Och för att jag var lat och inte orkade fixa till mina WordPress-hooks. Kort förklarat fungerar mina inställningar så här.

2.1 Product impressions

På varje sida som har product lists byggs en ecommerce.impressions Array så snart DOM har laddats. I denna Array har varje objekt en enkel artikeltitel (+ ingress) som syns i en av de eventuella produktlistorna. Produktlistorna (product lists) på min sajt är:

  • Main posts – listan på huvudsidan
  • Category posts – om en besökare har valt att se alla artiklar i en viss kategori
  • Tag posts – om en besökare har valt att se alla artiklar med en viss tag
  • Search results – listan med resultat som du får om du använder sökfunktionen på sidan
  • Recent posts – “Recent posts” widgeten i sidebaren
  • Recent comments – “Recent comments” widgeten i sidebaren
  • GTM Tips – “GTM Tips” widgeten i sidebaren

List position baseras på ordningen av artiklarna i listan. Ett individuellt produkt-objekt ser ut ungefär såhär:

dataLayer object

Som du ser är det väldigt enkelt. category är artikelns tilldelade WordPress-kategori (mina artiklar har bara en kategori), id är en nerkortat version av artikelns titel, name är artikelns namn, och list samt position definierar vart intrycket listades.

Så, för varenda intryck så pushar jag ett objekt (som det ovan) in i en Array. Jag har också en Promotion view för min “Letade du efter mina GTM-artiklar?…”-info box på startsidan på min sajt, men den har hittills inte varit användbar så jag funderar på att ta bort den.

Såhär kan en Array exempelvis se ut:

sample-datalayer

Ett väldigt enkelt upplägg för ett väldigt enkelt syfte. Jag skickar denna Array med en Non-Interaction True Event tag eftersom jag inte vill att min pageview väntar med att avfyras tills dess att impression Array byggts, och jag vill inte att impressions ska påverka bounce rate.

2.2 Product list click

Jag spårar product list click genom att använda Link Click triggern. När någon klickar på en artikeltitel eller en “Läs mer…”-länk på produktlistan pushar jag detaljerna om produkten hen klickat på in i dataLayer tillsammans med productClick värdet för event nyckeln, vilket sedan triggar en Event-tag.

product-click-datalayer

När detta event avfyras ser jag effektiviteten i mina produklistor. Det ger mig information om hur de olika listorna presterar med bakgrund i hela customer journey från product impression till purchase.

2.3 Checkoutflödet

Checkoutflödet är en kombination av Product Detail impressions, Add to Cart-händelser och checkoutflödet i sig självt.

En Product Detail impression skickas som ett Non-interaction True Event så snart som artikeln har laddats. Detta intryck kan alltså tolkas som att besökaren snabbt bestämmer om hen vill läsa artikeln eller inte.

Add to Cart-händelsen uppstår när besökaren börjar scrolla. Payloaden skickas med en normal Event tag till Google Analytics. Jag anser att scrollning avslöjar besökarens intention att konsumera innehållet, men det är inte en checkout än, eftersom de kanske bara skippar första paragrafen av artikeln.

Checkoutflödet i sig är ganska häftigt. Jag använder det scrollspårnings-plugin som Justin Cutroni skrev om på sin site. Jag har modifierat det så att det ska fungera med Google Tag Manager och jag har också gjort så att det fungerar med “Purchases” (se nästa del).

Såhär fungerar det just nu:

  • Jag räknar ut hur lång content DIV-en är i pixlar.
  • När besökarens webbläsare når en tredjedel av denna längd skickas det första checkoutsteget som ett normalt Google Analytics event. Det här steget har jag döpt till “Läst en tredjedel”.
  • När webbläsaren når två tredjedelar av content längden skickas nästa event, kallat “Läst två tredjedelar” till Google Analytics.
  • När webbläsaren når slutet av content DIV-en skickas det sista checkout steget som ett GA event, kallat “Nått slutet av content”.
  • Till sist, om besökaren har nått steg tre och spenderat åtminstone 60 sekunder på artikelsidan skickas “Purchase” eventet (se nästa del).

enhanced-ecommerce-checkout

Du kommer behöva modifiera den här funneln och inställningarna efter den typ av innehåll som du skriver. Du kanske ändrar tiden från 60 sekunder till något annat, och du kanske behöver fler steg i checkoutfunneln (exempelvis 25 %, 50 %, 75 %). För mig räckte denna detaljnivå.

checkout-step

Ovanstående är ett exempel på hur ett checkout objekt kan se ut i andra steget av funneln. Som du ser så har jag lagt till pris som en egenskap i artikeln. Här är det smarta: priset är antal ord i artikeln. Naturligtvis så har jag gjort det till ett “.99”-nummer för att få det att se ut mer som ett faktiskt pris :-). Du kommer förstå varför detta är användbart när jag kommer till rapporterna.

2.4 Purchase

Som jag skrev tidigare i denna artikel: ett “Purchase” event blir pushat när checkoutfunneln är klar och besökaren har spenderat åtminstone 60 sekunder på sajten. Köpet (alltså purchase) är ett standard Enhanced Ecommerce Purchase objekt, som ser ut ungefär såhär:

purchase-datalayer

Transaktions ID:t är i grund och botten ett epoch timestamp plus ett antal bokstäver och siffror i slumpmässig ordning. Antalet produkter i en transaktion kommer alltid att vara 1.

3Analys

Låt oss nu gå igenom mina favoritrapporter och segment. Först och främst: Shopping behavior-rapporten:

shopping-behavior

Som du ser visar denna rapport transaktioner från ett tidsspann som du själv väljer. I detta exempel är tidsspannet bara en dag långt. Jag har tagit bort absolutvärdena men kommer uppdatera den här skärmdumpen när jag har mer data. Behavior funneln är ganska logisk. Ungefär 20 % hoppar av för varje steg, och allt fler hoppar av ju närmare de kommer till att “genomföra ett köp” (purchase). 15 % öppnar inte ens artikeln, vilket är väldigt intressant! Detta skulle också kunna vara felaktig data, på grund av min DOM scrapeing, men den går fortfarande att räkna med tack vare all den trafik jag har på min blogg.

Ytterligare 25 % av alla besökare som börjar scrolla når aldrig en tredjedel av artikeln. Detta är också intressant, eftersom det betyder att någonting i de allra första styckena skrämmer bort läsaren.

Nästa steg skulle vara att segmentera denna data och analysera den noga. Hur kan jag optimera funneln ännu mer? Två omedelbara orosmoln jag ser är dels den genomsnittligt låga konverteringsgraden (bara 25 % av mina läsare läser faktiskt en hel artikel och spenderar mer än 60 sekunder på sidan) och det faktum att bara 40 % av de som börjar läsa läser igenom hela artikeln. Dock är detta självklart ett normalt tecken i bloggbranschen, men samtidigt definitivt något jag vill förbättra.

checkout-funnel

Den här skärmdumpen är väldigt intressant! Hälften av mina läsare börjar i checkout-funneln och bara hälften av dessa kommer till slutet samt läser i mer än 60 sekunder. Snacka om selektiv läsning! Mitt content är i genomsnitt ganska långt, så det är intressant att kolla om artikellängd är en faktor här. Vissa besökare kanske bara direkt scrollar ner till kommentarerna, vilket är helt förståeligt. Hmm, jag borde spåra detta också! Måste komma ihåg det här.

Det saknas alltså ett samband mellan att börja läsa en artikel och att nå slutet av den. Jag bör nog göra något åt det här. Typ, skriva intressantare artiklar. Det är dock imponerande hur många besökare som faktiskt tar sig tid att läsa hela artiklar.

Ett problem med den här Checkout Funnel-rapporten är att checkoutfunneln varierar från artikel till artikel. Längre artikel har högre trösklar att klara av i funneln (eftersom stegen i den är baserade på pixelhöjden i content DIV:en), vilket betyder att konverteringsgraden för checkoutfunneln borde vara mycket högre för kortare artiklar.

Nästa del, Product Performance-rapporten:

product-performance

Åh detta är så roligt. Under veckan som gått har nästan sex miljoner ord blivit “köpta” i mina artiklar! Det betyder att sex miljoner ord har passerat genom checkout funneln ända till Purchase-kolumnen. Fantastiskt!

Uppdatering: Jag vill fortfarande samla in mer data innan jag fyller på här med info om Buy-to-Detail och Cart-to-Detail analyser.

Om du tittar på genomsnittspriset kan du se att listan toppas av några längre artiklar. Det värmer mitt hjärta att se att det även finns några korta artiklar i topp tio listan som genererar “ordvinst”.

Sales performance har inte varit så framgångsrikt. Detta eftersom transaktionerna är ganska motsägelsefulla på min blogg. Jag hoppar istället direkt till Product list performance (ledsen för den otydliga skärmdumpen):

product-list-performance

Huvudinsikterna från denna rapport är att mina sidebar widgets inte är speciellt användbara. Jag borde nog ta bort dem så fort jag kommer på något annat som faktiskt skapar värde. Nåväl, “Recent posts”-listan har fått ganska många klick, så jag kanske har kvar den ändå.

Uppdatering: Jag väntar fortfarande på att få in mer data innan jag uppdaterar denna del med en Product Adds to Cart analys.

Den lista som presterar bäst är naturligtvis min startsidelista. Den har en väldigt bra CTR som ligger på 16.47 %. “Category posts” och “Tag posts” är mycket mindre populära, men även de lockar till sig en mängd klick.

“Search results” gör väldigt bra ifrån sig, vilket är viktigt. Jag vill att mina besökare ska hitta vad de letar efter. Naturligtvis så följer jag mina mest populära sökningarna som en hök, så att jag kan få idéer till nytt content samtidigt.

Eftersom jag har all denna otroliga data i mina händer så kan jag bygga fantastiska segment också:

  • Whales: Avkastning per användare > 10000 – Till för att spåra läsare som har “köpt” mer än 10 000 ord under sin livstid.
  • Passers-by: Transaktioner per användare = 1 – Till för att spåra läsare som endast “köpt” ett enda ord under sin livstid.
  • Skimmers: Transaktioner per användare = 0 OCH Event Action matchar Checkout exakt– Till för att spåra läsare som börjat checkoutflödet men aldrig genomfört ett “köp”.
  • Loyal readers: (Inkludera användare) – Till för att spåra läsare som bara läser mina längre artiklar.

Och många andra segment! Nu kan jag segmentera mina kanaler för att se vilka som leder de mest värdefulla läsarna till mig. Observera att jag inte bara tycker att läsare som läser mina längre artiklar är värdefulla, det är här hela “ord som pris”-idén faller platt. Jag gillar att skriva korta artiklar också. Mina #GTMTips är oftast något kortare, till exempel.

4Sammanfattning

Jag hoppas att denna artikel har inspirerat dig. Den data jag får in i mina rapporter är så intressant och lätt att agera på. Den behöver dock justeras, så jag kanske behöver anpassa checkoutfunneln ännu mer för att optimera läsflödet från det att artikeln laddas tills dess att den är slut.

En av de kommentarer jag fått på denna post har hjälpt mig att justera inställningarna för att få med Product Detail impressions och Add to Cart actions, men det kommer ta ett litet tag innan jag har tillräckligt data. Jag kommer uppdatera denna artikel så snart jag kan.

Kontakta mig gärna om du har prövat något liknande eller om du har andra ideer när det kommer till att spåra content med Enhanced Ecommerce! Jag är ledsen att jag inte har kunnat ge dig en steg för steg lathund, men eftersom jag gjort detta med DOM scraping och det inte riktigt är best practice så vill jag inte skylta med min lösning. Huvudsyftet med denna artikel är att inspirera dig att tänka på ditt content i form av termer, funnels och transaktioner. Jag gillar verkligen de nya Enhanced Ecommerce-rapporterna och jag hoppas att jag har visat hur flexibla de är. De är inte bara till för e-handlare.

Läs Simo’s post på engelska här.

Läs även

Conversionista is open for business in The Netherlands.
Conversionista is open for business in The Netherlands. Read more.