Online vásárlás mérése Google Analyticsben

Főoldal > ADOPS

Az online vásárlás szépsége, hogy a webáruház a vásárlás teljes folyamatát nyomon tudja követni, majd ezeket az adatokat elemezve optimalizálni, vagy akár növelni tudja a vásárlások számát. Ez a cikk lépésről-lépésre bemutatja, hogyan állítsd be a webáruházadban az online vásárlás mérését.

Ez kell az online vásárlás méréséhez

Az online vásárlás mérésének feltétele, hogy a webáruház összes (nyilvános) oldala tartalmazzon Google Analytics mérőkódot. A beállításhoz továbbá Google Tag Managert is használni fogunk, hogy ne kelljen közvetlenül a kódba belenyúlni. Ezt a két eszközt mindenképpen tartalmaznia kell az oldalnak.

Enhanced eCommerce funkció bekapcsolása

Mielőtt bármibe is belekezdenénk, lépjünk be a Google Analytics Ecommerce Settings menüpontjába és engedélyezzük az ecommerce funkciót, továbbá kapcsoljuk be az Enhanced Ecommerce lehetőséget. Egyelőre a Checkout labelinggel ne foglalkozz!

Adatok küldése dataLayerbe

Minden olyan oldalon, ahol a vásárlással kapcsolatban fontos információ jelenik meg (pl. termék oldal, kosár, fizetés) a számunkra fontos információkat a dataLayerbe kell elhelyeznünk. Ez egy konténer, ahonnan majd később az Analyticsbe át tudjuk küldeni az infókat.

A dataLayer segítségével a következő vásárlási pontokat tudjuk majd nyomon követni:

• terméklista megjelenés
• kattintás a termékre
• termékoldal megjelenés
• kosárba rakás / eltávolítás
• vásárlási folyamat (checkout)
• sikeres vásárlás
• visszatérítés (refund)
• promóciós kód használata

Terméklista megjelenés

Minden egyes listaoldalon a következő kódot tegyük az oldalba. Ezzel mérni tudjuk az adott termék(ek) megjelenését és egyben a standard oldalletöltést is. Egyszerre akár több terméket is betehetünk a dataLayerbe:

dataLayer.push({
  'ecommerce': {
    'currencyCode': 'HUF',                       // opcionális
    'impressions': [
     {
       'name': 'Triblend Android T-Shirt',       // vagy a név, vagy az id kötelező
       'id': '12345',
       'price': '15.25',
       'brand': 'Google',
       'category': 'Apparel',
       'variant': 'Gray',
       'list': 'Search Results',
       'position': 1
     },
     {
       'name': 'Donut Friday Scented T-Shirt',
       'id': '67890',
       'price': '33.75',
       'brand': 'Google',
       'category': 'Apparel',
       'variant': 'Black',
       'list': 'Search Results',
       'position': 2
     }]
  }
});

Kattintás a termékre

Amikor egy felhasználó egy adott termékre kattint ezt a kódot kell használni:

dataLayer.push({
   "event": "EEproductClick",  //tetszőleges event név, később lesz jelentősége
   "ecommerce": {
     "currencyCode": "USD",
     "click": {
       "actionField": {"list":"category" },
       "products": [{
         "id":"9bf1d",
         "name":"Boss T-Shirt",
         "price":"37.00",
         "brand":"Converse",
         "category":" Men/Clothing/T-Shirts",
         "position":"2"
      }]
    }
  }
});

Termékoldal megjelenés

Ezt a kódot minden egyes termékoldal megjelenésekor tartalmaznia kell az oldalnak.

dataLayer.push({
  'ecommerce': {
    'detail': {
      'actionField': {'list': 'Apparel Gallery'}, // a list opcionális.
      'products': [{
        'name': 'Triblend Android T-Shirt',       // név vagy id kötelező.
        'id': '12345',
        'price': '15.25',
        'brand': 'Google',
        'category': 'Apparel',
        'variant': 'Gray'
       }]
     }
   }
});

Kosárba rakás / eltávolítás

Ha a felhasználó a terméket a kosárba teszi, akkor ezt a kódot használjuk:

dataLayer.push({
  'event': 'addToCart',
  'ecommerce': {
    'currencyCode': 'EUR',
    'add': {                                
      'products': [{                        
        'name': 'Triblend Android T-Shirt',
        'id': '12345',
        'price': '15.25',
        'brand': 'Google',
        'category': 'Apparel',
        'variant': 'Gray',
        'quantity': 1
       }]
    }
  }
});

Ha a felhasználó a terméket kiveszi a kosárból, akkor ezt a kódot használjuk:

dataLayer.push({
  'event': 'removeFromCart',
  'ecommerce': {
    'remove': {                               
      'products': [{                          
          'name': 'Triblend Android T-Shirt',
          'id': '12345',
          'price': '15.25',
          'brand': 'Google',
          'category': 'Apparel',
          'variant': 'Gray',
          'quantity': 1
      }]
    }
  }
});
	

Vásárlási folyamat (checkout)

Onnantól kezdve, hogy a felhasználó a terméket a kosárba tette, elindul a checkout folyamat. Fontos, hogy a checkout-nak nem része maga a vásárlás, az egy másik rész lesz! A checkout folyamat összes pontját mérni tudjuk ugyanazzal az eventtel.

Checkout 1.lépés

dataLayer.push({
   "event":"EEcheckout",  //tesztőleges event név, ezt használjuk az összes lépésnél
   "ecommerce": {
     "checkout": {
       "actionField": {"step":1,"option" :"Kosár összefoglaló" },
       "products": [{
         "id":"98adsh",
         "name":" Converse T-Shirt",
         "price":"12.50",
         "brand":"Converse",
         "category":"Men/Clothing/T-Shirts",
         "variant":"red",
         "position":0,  //megadhatjuk a termék kosárbeli pozícióját is
         "quantity":2
      },
      {
         "id":"m3g45",
         "name":"Boss Pants",
         "price":"38.00",
         "brand":"Boss",
         "category":"Men/Clothing/Pants",
         "variant":"blue",
         "position":1,
         "quantity":1
      }]
    }
  }
});
	

Checkout 2.lépés

A további checkout lépéseknél is fontos, hogy ugyanezt azt az eventet használjuk, amit az első pontban (pl "EEcheckout"). Fontos még, hogy a további pontoknál már nem szükséges újra megadni a termék adatait, elég volt az első lépésnél.

dataLayer.push({
   "event":"EEcheckout",
   "ecommerce": {
     "checkout_option": {
       "actionField": {"step":1,"option": "Kosár összefoglaló"} //itt hivatkozunk az első lépésre
    }
     "checkout": {
       "actionField": {"step":2," option":"Fizetési info"}     //ez a második lépés
    }
  }
});
	

És akkor most kanyarodjunk kicsit vissza az Analyticshez. Az Enhanced Ecommerce bekapcsolásakor üresen hagytuk a Checkout labelling részt, mert nem tudtuk még milyen lépések lesznek. Most már tudjuk pontosan, hogy melyik checkout lépésnek mi a neve, ezért adjuk meg itt is a lépések neveit.

Sikeres vásárlás

Amikor megtörtént a vásárlás, akkor a köszönöm oldalba ezt kell tenni:

Vásárlás:

dataLayer.push({
  'ecommerce': {
    'purchase': {
      'actionField': {
        'id': 'T12345',                 // kötelező
        'affiliation': 'Online Store',
        'revenue': '35.43',             // teljes összeg, áfával és szállítással
        'tax':'4.90',
        'shipping': '5.99',
        'coupon': 'SUMMER_SALE'
      },
      'products': [{                      // termékek listája
        'name': 'Triblend Android T-Shirt', // név vagy id kötelező
        'id': '12345',
        'price': '15.25',
        'brand': 'Google',
        'category': 'Apparel',
        'variant': 'Gray',
        'quantity': 1,
        'coupon': ''         // opcionális
       },
       {
        'name': 'Donut Friday Scented T-Shirt',
        'id': '67890',
        'price': '33.75',
        'brand': 'Google',
        'category': 'Apparel',
        'variant': 'Black',
        'quantity': 1
       }]
    }
  }
});
	

Látható a kódban, hogy megjeleníthető egy kuponkód is a termék mellett, tehát azt is követni tudjuk ha valaki ezzel vásárol az oldalon. Erről egy kicsit később lesz szó.

Figyelem: Ha a vásárló a fizetés után nem érkezik vissza a köszönöm oldalra, akkor a tranzakció nem fog bekerülni Analytics-be! Ha kíváncsi vagy még milyen okai lehetnek hogy eltér a tranzakciószám GA és a webshop motor között, akkor olvasd el ezt a cikket.

Visszatérítés:

Előfordulhat, hogy a vásárlást lemondja vagy a felhasználó vagy a webáruház. Ilyenkor a már beküldött vásárlást vissza tudjuk vonni az analyticsből ha hivatkozunk az eredeti tranzakciós id-ra ezzel a kóddal:

dataLayer.push({
  'ecommerce': {
    'refund': {
      'actionField': {'id': 'T12345'}  // kötelező
    }
  }
});
	

Promóciós kód használata

Ahogy fentebb egy kicsivel láthattad, ha valaki promóciós kóddal érkezik az oldalra, akkor a vásárlásához hozzá tudjuk kötni, hogy milyen kuponnal jött az oldalra, milyen kuponnal vásárolt.

dataLayer.push({
  'ecommerce': {
    'promoView': {
      'promotions': [           // akár több promo kódot is kezelhetünk
       {
         'id': 'JUNE_PROMO13',  // id vagy név kötelező
         'name': 'June Sale',
         'creative': 'banner1',
         'position': 'slot1'
       },
       {
         'id': 'FREE_SHIP13',
         'name': 'Free Shipping Promo',
         'creative': 'skyscraper1',
         'position': 'slot2'
       }]
    }
  }
});
	

Adatok küldése Analyticsbe

Azzal, hogy minden oldalban elhelyeztük a szükséges kódokat, még nem kapja meg ezeket az Analytics! Ahhoz, hogy az összes event és információ átmenjen a GTM-ben kicsit módosítanunk kell az alap PageView tagünket.

Adatok ellenőrzése

Ha mindent jól csináltunk, akkor az adatokat az Analytics Conversions / Ecommerce menüpontjában tudjuk ellenőrizni:

Vásárlói magatartás:

Checkout folyamat:

Ajánlom figyelmedbe az online vásárlás mérésével foglalkozó következő posztomat, amiben azt mutatom be, hogyan lehet egy vásárlási tranzakciót utólag módosítani vagy törölni:

---

---

Ha segítségre lenne szükséged webáruházad beállításában, ajánlom figyelmedbe webanalitikai szolgáltatásunkat!

Megosztani ér: