7 Google Analytics tricks din far ikke lærte dig -Af Morten Vadskær 1ste udgave
Integration med Google Website Optimizer multivariant tests... 3 Registrere fejl i dine formularer... 5 Hvor langt når dine brugere i din formular... 5 Track hvilke billeder, dine brugere klikker på... 7 Track returvarer i din webshop... 8 Track hvilke sociale medier dine brugere er logget ind i... 9 Scroller de?... 13 Tak fordi du kom... 15
INTEGRATION MED GOOGLE WEBSITE OPTIMIZER MULTIVARIANT TESTS Jeg bruger Google Website Optimizer til mine split-tests. Desværre har Google endnu ikke selv fundet ud af at parre data fra GWO med GA (tror på det kommer i 2012), så indtil da må vi klare os selv. Når det gælder A/B test er det ret ligetil, for der har du to forskellige URL er at handle ud fra (forudsat du kører 100% af din trafik gennem split-testen - men hvem gør ikke det?). Men når det gælder multivariant tests skal vi selv i gang. Har man kun 2-4 varianter kan man godt overkomme at huske at smide den ind i hver variant, når man sætter testen op, men det er en helt anden sag, hvis du har 8, 16 eller f.eks. 32 varianter. Men med lidt JavaScript og utmx-cookien, så kan man klare det med at hardcode lidt data ind i javascriptet. GWO benytter cookien utmx til at holde styr på, hvilken variant der vises og den kan vi lige bruge til formålet. Opskriften er simpel. Opret din multivariant test som normalt. Når du kommer til punktet, hvor du skal gennemse dine varianter, så notér lige hvilke kombinationer de forskellige varianter er. Her har jeg lavet fire varianter til lejligheden og vil her noteret, at variant 1 er gul knap - harddisk recovery og variant 2 er pink knap - harddisk recovery etc. Fint - start din test som normalt. Nu skal vi bare have disse data ind i Google Analytics. Den kode vi skal bruge ser sådan ud. <script type="text/javascript">!! var kombinationer = new Array(); kombinationer[0] = "Oprindelig variant"; kombinationer[1] = "Slettede filer - gul knap"; kombinationer[2] = "Harddisk recovery - pink knap"; kombinationer[3] = "Slettede filer - pink knap";
try { _gaq.push(['_setcustomvar', 2,'MVT test knap overskrift', kombinationer[utmx ('combination')],1]); } catch(err) {} </script> Som du kan se, skal du hardcode følgende: 1. Dine varianter. Du skal smide dem i arrayet kombinationer og har du mere end 4 skal du bare tilføje dem i halen. Husk også at ændre tallet 0, 1, 2, 3 etc. 2. Din setcustomvar(). Du skal dels give den en slot (fra 1-5 - hvis du bruger setcustomvar så ved du hvilke slots, du har gang i. Hvis du ikke gør, så lad det første tal være 1). Du kan så efterfølgende give den et sigende navn og det er alt. Nu er dine data med i Google Analytics og du får også indsigt i om de forskellige varianter har indvirkning på bounce rate, antal sidevisninger, gennemsnitsbeløb m.m.
REGISTRERE FEJL I DINE FORMULARER Det klassiske/nok mest værdifulde sted at bruge dette trick er folk, der glemmer at acceptere betingelserne. Men tricket kan med fordel også anvendes på f.eks. webshops, hvor man skal vælge størrelse, farve eller anden variant, inden man kan lægge noget i kurven. I al sin enkelthed går det ud på at registrere fejl-hændelser, når brugeren laver en fejl. Hvis du ikke allerede validerer din brugers svar på klientsiden, bør du gøre det nu. I samme moment som du validerer, kan du ligeså godt registrere fejlene i Google Analytics. Alt du skal gøre er at benytte Google Analytics event-tracking (hændelsessporing på dansk) og det ser således ud: _gaq.push([ _trackevent, forkert ]); Formularer, Fejl, Emailadresse HVOR LANGT NÅR DINE BRUGERE I DIN FORMULAR Har du lange formularer, kan du med virtuelle sidevisninger og en kanal få visualiseret, hvor langt, dine brugere når. Tricket går ud på at registrere en virtuel sidevisning hver gang et felt i formularen forlades og det er udfyldt. Igen bør du bruge dine validering til at hugge de virtuelle sidevisninger af. Ganske simpelt foregår det ved at du f.eks. bruger JavaScripts funktion onblur(), der kaldes, når et felt forlades. Er feltet udfyldt (hvis det er påkrævet), ja så eksekverer du den virtuelle sidevisning. Den ser således ud _gaq.push(['_trackpageview', '/formular/navn']);
Når du har opsat dine virtuelle sidevisninger skal du opsætte et mål med en kanal på helt traditionel vis. Du skal bare i stedet bruge de virtuelle sidevisninger som trin. Sådan ser det ud på Kondomaten Når din kanal er sat op, kan du se den visualiseret som du ser her. OBS: Når du laver den slags her, så vil dine antal sidevisninger jo stige kunstigt. Personligt bekymrer jeg mig ikke synderligt om det, da jeg jo er klar over det. Men er antal sidevisninger en essentiel KPI i din virksomhed, så skal du nok lige huske, hvorfor det pludseligt stiger og evt. orientere relevante personer om det.
TRACK HVILKE BILLEDER, DINE BRUGERE KLIKKER PÅ Du vil blive overrasket over, hvor mange billeder, folk klikker på. Så min anbefaling er derfor så vidt muligt at lave billeder til links. Med denne lille smule jquery kan du nemt tracke kliks på alle de billeder, der ikke i forvejen er links. Husk at hente jquery og inkludere det for at få det til at virke. (bemærk lige at markerer at linjen er knækket). <script type= text/javascript >! $(document).ready(function() {!! $( img ).bind( click,function() {!!! if ($(this).parent()[0].nodename!= A ) {!!!! var clicked = $(this).attr( src );!!!! var url = $(location).attr( href );!!!! _gaq.push!! ([ _trackevent, Billedklik,url,clicked,true]);!!! }!! });! }); </script> Et voilá - så har du events med de billeder, som folk klikker på.
TRACK RETURVARER I DIN WEBSHOP Returvarer er enhver e-købmands frygt. Google Analytics e-commerce er enhver e-købmands drømme-tool. Men sidstnævnte mangler at registrere førstnævnte. Det kan vi heldigvis selv gøre noget ved. Google Analytics e-commerce tager imod negative beløb.
TRACK HVILKE SOCIALE MEDIER DINE BRUGERE ER LOGGET IND I Øvelsen består af tre dele: 1. Vi skal fortælle Facebook, at vi gerne vil lave en app (det vil vi egentligt ikke - men vi er nødt til at fyre en lille hvid løgn til Zuckerberg for at få lov at spille med). Det er rent formelt for at vi får adgang til deres service og tager kun 2 minutter. 2. Vi skal smide lidt kode ind på hjemmesiden. Koden fortæller Google Analytics om brugeren bruger det ene eller andet sociale netværk (vi checker kun Google, Google Plus, Twitter og Facebook i dag). 3. Vi skal sætte Google Analytics op, så den kan sortere de forskellige besøgende. Hele øvelsen tager ikke mere end 15-30 minutter, så lad os komme i gang. Få det Facebook app id 1. Log ind i Facebook 2. Gå ind på https://developers.facebook.com/apps 3. Klik på Opret ny applikation i øverste højre hjørne 4. Du skal nu navngive app en. Det er lige gyldigt hvad du kalder den. 5. Muligvis får du en CAPTCHA du skal igennem, men ellers får du den formulare du ser herunder. Du skal udfylde feltet Applikations Domæne (husk http:// foran din side). Det er den side, du vil tracke. Du skal også klikke på Hjemmeside og udfylde Site URL. 6. Så kopierer du App ID som står øverst. 7. Klik Gem ændringer. Jeg har markeret de felter, du skal bruge på billedet her.
Lidt kode ind på din side Så skal der lidt kode ind på siden. Du skal ændre en enkelt ting og så skal du lige være opmærksom på noget andet. Først og fremmest skal du være opmærksom på, at vi bruger Google Analytics SetCustomVar() funktion. Den har plads til at du bruger 5, så har du allerede gang i SetCustomVar(), skal du lige være opmærksom på, at du ikke overskriver en slot, som de kaldes. Sandsynligvis har du ikke gang i dem (desværre der er alt for få danskere, der bruger det). Men er du i tvivl, så spørg
ham, der er ansvarlig for jeres webanalyse eller log ind i Google Analytics og vælg Audience Demographics Custom Variables. Ser du ingenting der, kan du bare gå i gang. 1. Hent koden her og åben den i en tekst-editor. Det eneste, du skal ændre i den er at indsætte det Facebook App id, som vi fik fingre i ovenfor. Den skal ind i den linje, der ser således ud (og det skal ind der, hvor jeg har markeret med fed). FB.init({ appid:'210149535758970', status:true, cookie:true, xfbml:true}); 2. Denne kode skal ind på alle dine sider (gerne lige inden det afsluttende body tag) 3. Hent denne kode og indsæt den på alle dine sider (gerne mellem de to head-tags). Nemt ikke? Så er der kun sidste trin tilbage Skrue lidt i Google Analytics Nu logger du ind i Google Analytics og skal opsætte et par segmenter. 1. Klik på Advanced segments under overskriften på den rapport, du står i. 2. Klik på + New Custom Segment nederst i højre hjørne i den box, der folder sig ud. Du skal nu opsætte fire segmenter: Google, Google plus, Twitter, Facebook. 3. Giv den et navn her har jeg valgt Google brugere 4. Vælg Custom Variable (Value 01) (bemærk det er value ikke key, som du får tilbudt først). 5. Vælg Exactly matching i dropdown og skrive LoggedIn i feltet derefter 6. Klik herefter Save segment. 7. Du er færdig med første segment. Gentag øvelsen 3 gange. I næste trin er det Google Plus brugere og du skal vælge Custom Variable (Value 02). Herefter Twitter brugere og du vælger Custom Variable (Value 03) og til sidst Facebook brugere og Custom Variable (Value 04). Fremover kan du nu vælge dine segmenter i Google Analytics. Klik på Advanced segments og du får dem tilgængelige ude i højre side under Custom segments. Det betyder, at du kan se, om de opfører sig forskelligt på din side og du kan bedre finde ud af, om du skal markedsføre dig til Twitter, Facebook eller Google Plus.
Indlægget her er tyv-stjålet fra SEOMoz - du kan se det her. Bagefter har du adgang til så lækre data som det her
SCROLLER DE? Slut på diskussionen om de scroller eller ej og hvor mange, der kommer below fold. Brug Waypoints.js. Her har du mulighed for at eksekvere eventtracking, når brugeren scroller forbi et bestemt element eller bare til bunden. Når du har gjort det, kan du jo opsætte et segment, der viser de brugere, der har scrollet til bunden. Det gøres således
Så kan du bagefter se forskellen på dine brugere i Analytics
TAK FORDI DU KOM Det var fedt, du deltog i WAW. Håber at møde dig der en anden gang. Jeg kommer til WAW i både Aarhus, København & London. Morten Vadskær www.v4d5.net/blog/