Tento návod nasadenia Google Analtics 4 vznikol pre Shoptet. Môžeme ho však použiť aj na iné e-shopové riešenia mimo Shoptet s drobnými úpravami.
V predchádzajúcom návode sme si nastavili konfiguráciu Google Analytics 4 (GA4) pre e-shop (Shoptet) cez Google Tag Manager (GTM). Na správne meranie nákupného procesu a konverzií však budeme potrebovať nasadiť ďalšie udalosti (eventy), predovšetkým dokončenie nákupu – tzv. enhanced e-commerce (EEC)
Všetky tieto eventy sa v GTM sa nasadzujú ako GA4 Event tagy. Ako eventy môžeme merať napr. pozretie produktu, pridanie do košíka, odobratie z košíku, jednotlivé kroky v košíku, dokončenie objednávky, prípadne vrátky a storná. My sme si vybrali pre ukážku niekoľko užitočných tagov na nasadenie. Nie je to všetko, avšak na základ vám to bude stačiť.
Čo potrebujeme k nasadeniu enhanced e-commerce pre Google Analytics 4?
Na nasadenie týchto eventov potrebujeme mať nastavené jednotlivé premenné datalayeru, ktoré popisuje Google dokumentácia. Ešte zrozumiteľnejší popis ako Google dokumentácia odporúčam článok od Sima Ahavu. Pri hľadaní týchto premenných v datalayeri sme však narazili na problém. Datalayer Shoptetu (a väčšiny CMS) je vytvorený pre klasický Google Analytics (Universal Analytics). Nasadenie eventov v Google Analytics 4 však potrebuje nový datalayer prispôsobený pre GA4. Tento datalayer Shoptet zatiaľ nemá, preto si ho musíme vytvoriť. Nie je to však také zložité ako to znie.
Pozn.: ak sa chcete dozvedieť viac o tom čo je datalayer, ako z neho čítať tak si pozrite videonávod na konci tohto článku
V cheat sheete som si pripravil povinné premenné podľa Google dokumentácie pre nasadenie jednotlivých eventov. Jediné čo potrebujeme spraviť je “preložiť” názvy týchto premenných z jazyka klasického Google Analytics na jazyk GA4. Poďme si to teda skúsiť na event view_item (pozretie produktu).
Identifikovanie premenných a nastavenie prvého eventu
V rozhraní GTM spustíme Preview mode a na stránke si otvorím nejaký produkt. Podľa cheat sheetu viem, že pre event view_item mám iba jednu povinnú premennú, ktorou je items. Items je produkt alebo zoznam jednotlivých produktov (napr. v košíku) s dátami k týmto produktom ako napríklad ID produktu, názov produktu, kategória alebo cena. Otvoríme si teda datalayer v Preview mode a hľadám niečo podobné. Hneď vidíme, že 7. riadok s názvom product obsahuje tieto údaje. Pravdepodobne to bude to čo potrebujem, ale otestujeme to.
Vrátime sa do GTM a v časti variables vytvoríme novú premennú ako DataLayer variable. Nazveme ju, tak aby som ju vedel odlíšiť a zapíšem podľa pravidiel datalyeru, čiže zhora dole: shoptet.product. Verziu datalayer ponecháme tak a premennú uložíme. Teraz si vytvoríme GA4 event tag, vyberieme si svoju konfiguráciu, zadáme názov eventu. Je potrebné aby sme pri nazývaní eventu striktne dodržali pravidlá dokumentácie Google. Čiže musíme tento event nazvať presne tak ako píše Google: view_item. To však nestačí. Musíme pridať aj povinné parametre. Z cheat sheetu už vieme, že pri tomto evente je povinný iba jeden parameter: items. Pridáme nový riadok a nazveme parameter. Tu platí takisto striktné dodržiavanie pravidiel Google dokumentácie. Ako hodnotu tohto parametra si zvolíme premennú, ktorú sme pred chvíľou vytvorili. Ako trigger tohto tagu si zvolíme Product detail, ktorý som si už predtým nastavil tiež prostredníctvom datalayeru.
Ak máme tento tag hotový, tak si môžeme skontrolovať jeho funkčnosť cez Preview mode. Takisto si to môžem ako skontrolovať aj cez rozhranie GA4.
Nastavenie ďalších eventov
Ak všetko funguje tak môžeme prejsť na nastavenie ďalších tagov podobne ako view_item. Premenné, ktoré budeme potrebovať.
- add_to_cart – items
- begin_checkout – items
- add_shipping_info – items,shipping_tier (nepovinne)
- add_payment_info – items, payment_tier (nepovinne)
- purchase – transaction_id, value, currency, tax, shipping, items, coupon
Ako to spraviť na 6 klikov?
Ak sa vám tento návod zdá byť zložitý kliknite sem a stiahnite si zadarmo náš template pre nasadenie celého Enhanced e-commerce zadarmo. Všetky základné tagy nasadíte na pár klikov. Ak by ste potrebovali pomoc, ozvite sa.
Návod:
- V sekcii Admin kliknete na Import container.
- Vyberiete stiahnutý súbor, workspace a naimportujete ho zlúčením (Merge).
- Tento template obsahuje aj tzv. Transaction ID logger, ktorý deduplikuje vaše tranzakcie. Nebudete tak mať duplicity v GA4, ktoré sú bohužiaľ zatiaľ dosť častým bugom.
Po implementovaní nezabudnite na dve veci:
- Zmeniť GA4 config ID na vaše Measurement ID
- V rozhraní GA4 v sekcii Configure > Events skontrolovať nastavenie Purchase eventu ako konverzie (eventy sa však nezobrazia hneď po odoslaní containeru do produkcie, počkajte trochu)
Ďalšie zdroje:
Videonávod – ako získavať dáta z dataLayeru:
