Abban bízom, és a 2014-es Superweek ebben látszik megerősíteni, hogy az idei év forró témája és eszköze a Google Tag Manager lesz.
Nem szeretném most az elejéről kezdeni, aki nem tudja, hogy a GTM-et eszik-e vagy isszák, olvassa el Geiger Tomi bejegyzését. Lépjünk egyel tovább, oda, hogy már használni szeretnénk, megvan a fiókunk, és a konténerkódot is behelyeztük az oldalunkba.
Bevezető cikkünkben a GTM alapjaival ismerkedünk meg.

Buktatók

Nem akarom állítani, hogy a GTM az új szent grál. Megvannak a maga nehézségei, ahogy arról Julien Coquet beszélt.
Dióhéjban:

  • gtmHa nem figyelünk, magunkra haragíthatjuk az IT részleget, mert úgy érzik, elvesszük a játékukat.
  • Az IT-ra ugyanúgy szükség van, hogy azonosítható elemeink legyenek (dataLayerek, vagy egyéb megfelelően elnevezett elemek)
  • Ugyanúgy hiba léphet fel, rossz helyre teszik a kódot, nem tesznek be egy dataLayert, stb
  • Mivel a mérési stratégia, és/vagy a weboldal változik, nem elég egyszer elhelyezni a kódot, és elfelejteni, folyamatosan felül kell vizsgálni, és ha szükséges, módosítani
  • A GTM felület használatához szükséges háttértudás (HTML, CSS, javascript), nem olyan egyszerű használni, mint ígérik
  • Ha kevés analitikai és taggelési gyakorlattal rendelkező használja, hibázhat, hiányoznak, vagy rosszul lesznek beállítva tagek. Könnyű úgy érezni, hogy egyszerűbb visszatérni a régi megoldásra, ahol az IT-ra volt hárítva a megfelelő kód produkálása
  • Ha többen kezelik, és nem megfelelő a kommunikáció, magas a hibalehetőség

Elsőre ennyi buktató ijesztőnek tűnhet, de hosszú távon azt gondolom mindenképp megtérül a használata, főleg olyan helyeken, ahol külsős IT fejleszti a weboldalt, és minden módosítás után érkezik a számla, vagy olyan helyeken, ahol csak szakaszosan van lehetőség fejlesztéseket élesíteni (tudunk cégekről, ahol heteket, hónapokat kell várni, hogy egy apró módosítás élesbe kerüljön, mert önállóan nem lehet kiküldeni.)

Tag, rule, macro

Az első lépés, hogy tisztában legyünk, mik azok a tagek, ruleok és macrok. Ha őket, és a viszonyukat megértjük, már félig jók vagyunk.

Tag / címke

google tag manager tag típusokA tag, vagy címke készíti el azt a kódrészletet, ami bekerül a konténerbe, és azon keresztül a weboldalba. Ez lehet Analytics kód, de AdWords vagy egyéb rendszer konverziókövető kódja is.
A lehetséges címketípusok közül az első két szekcióban lévők érdekesek egy átlagfelhasználó számára.
Fontos figyelni arra, hogy a megfelelő Analytics típust válasszuk – jelenleg még elérhető a hagyományos aszinkron Google Analytics is az Universal Analytics mellett, és ha nem jót választunk, az hibához vezet a mérésben. (Főleg, ha több tagünk van, és egyik ilyen, másik olyan).
Az Event Listener tagekre akkor van szükségünk, ha a GTM auto eseménykövetését szeretnénk használni. Ezek figyelnek arra, hogy egy esemény megtörténik-e. Nélkülük hiába állítjuk be a GA vagy UA taget eseménykövetésre, nem fogja bemérni őket. (a rendszer nem figyel ezekre automatikusan, mert az túl erőforrásigényes lenne, és lelassítaná).
Aki Google Analytics fiókot szeretne beállítani, ezen a két címketípuson kívül még esetlegesen a custom HTML Taget tudja használni, de erre egyre kevésbé van szükség, inkább csak egyedi igényeknél.
Az egyes tag típusokon belül is vannak további altípusok, de azt majd egy külön bejegyzésben mutatjuk be.
Most az a lényeg, hogy a címkék nélkül nem fog bekerülni a kódunk, és az ő beállításaiktól függ, pontosan milyen kód kerül be az oldalba.

Rule / szabály

gtm add ruleA rule-ok, vagy szabályok döntik el, egy egy tag által meghatározott kód, melyik aloldalra kerüljön be. Például az alapkódot minden aloldalban szeretnénk látni, míg az e-kereskedelmi mérést lehetővé tevőt csak a köszönőoldalban. Az event listenerek sem biztos, hogy minden oldalon kell, hogy figyeljenek, mert mondjuk dokumentumokat csak bizonyos aloldalról, vagy aloldalakról lehet letölteni. Természetesen a szabályok nem korlátozódnak konkrét aloldalakra, egyéb szempontok alapján is korlátozhatjuk egy címke megjelenését, mint például bizonyos események megtörténte (javascript lefutása, vagy kattintás egy bizonyos CSS class-ú linken).
Megengedő szabályok mellett kizáróakat is alkalmazhatunk (pl minden oldalon, kivéve a /admin oldalakat), ahol könnyebb kizárással meghatározni, hol jelenjen meg, és hol ne.
Tehát a szabályok felelősek azért, hogy a címkében definiált kódrészlet valóban megjelenjen az oldalon.

Macro / makró

gtm add new macroSzámomra a makrók működésének megértése volt a legnehezebb. Ők azok, akik segítenek azonosítani bizonyos elemeket. Címkéknél és rule-oknál is használhatjuk őket. A szabályokhoz mindig szükségünk van makrókra, a tagekhez nem feltétlen. Így néznek ki: {{makró neve}}. Arra valók, hogy bizonyos információt kivegyenek a weboldal kódjának meglévő részéből, és azt helyezzék be a tagekbe vagy a rule-okba. Avagy az ő segítségükkel tudjuk kiolvasni, mi van a dataLayerekben, és pl e-kereskedelmi kódot csinálni belőle. Vagy eseménykövetést. Nagyon széles a választék, hogy milyen elemeket használhatunk, így sok esetben megúszhatjuk akár az IT részleg piszkálását dataLayerek hozzáadásáért, azonban ehhez az kell, hogy jól azonosítható és következetes elnevezései legyenek az elemeknek, mint pl a CSS classoknak. (a következetes névadás a kódban egyébként nem csak itt hasznos).
Ez elméleti szinten egyszerűnek tűnik, azonban épp amiatt, mert sokmindent használhatunk, legalább alapszintű HTML, CSS és javascript tudás nélkül hosszadalmas és agyzsibbasztó annak kitalálása, mikor miből lehet makrót csinálni, és az pontosan milyen adatot fog behelyezni. A makrókra és típusaikra is tervezünk külön bejegyzést szánni.

dataLayerek

Már többször említettem őket fentebb, magyarul adatrétegnek hívják. Ők olyan metaadatok, amelyeket a weboldalba helyezve lehetővé tesszük, hogy a Google Tag Manager a makrókon keresztül bizonyos információkat ki tudjon olvasni, és abból e-kereskedelmi követést, eseménykövetést vagy éppen egyéni dimenziót vagy mutatót készítsen.
Ezek az adatok alapesetben nincsenek jelen a weboldalban, azért van szükség az elhelyezésükre a fejlesztők segítségével. Az e-kereskedelmi követés és a közösségi követés esetében érdemes ragaszkodni a javasolt elnevezésekhez, mert így egyszerűbben beállítható, de egyébként ránk van bízva, milyen változónévvel és értékkel látjuk el őket. Implementálásukról egyelőre lásd a dokumentációt.
Néhány példa, a teljesség igénye nélkül, miket helyezhetünk el:

  • látogató típusa (regisztrált, előfizető, pro tag, stb)
  • látogató állapota (belépett, nem belépett)
  • első vásárlás időpontja (belépett felhasználónál)
  • eddigi összes vásárlás értéke (belépett felhasználónál)
  • fizetés módja (készpénz, kártya, utánvét)
  • szállítás módja (pick-pack pont, személyes, házhozszállítás)
  • kosárba kerülő termékek (amit nem feltétlen vásároltak aztán meg)
  • aloldal típusa (kategóriaoldal, cikkoldal, termékoldal, stb)
  • aloldal címkéje/kategóriája
  • aloldal dátuma (mikor íródott)
  • aloldal szerzője
  • időjárás

WordPress tulajdonosoknak jó hír, hogy DuracellTomi Tag Manager for WordPress pluginje segítségével a legtöbb dataLayert néhány kattintással az oldalukba varázsolhatják. Számukra azt gondolom, hogy alap ennek a pluginnek a használata, ha Google Tag Managerre szeretnének váltani, ugyanis üzleti szempontokat is figyelembe vesz, és folyamatosan fejlődik.
Magento webshop tulajdonosoknak pedig ez a Tag Manager plugin tud segíteni, hogy a leglényegesebb dataLayereket elhelyezhessék az oldalban.

Ez a négy dolog adja a Google Tag Manager lelkét. Ezek megértése nélkül nem tudjuk sikeresen használni az eszközt. Hamarosan folytatjuk, az egyes elemek részletesebb, önálló bemutatásával.