Google Tag Manager használata

A Google Tag Manager segítségével követőkódokat / scripteket tudsz elhelyezni az oldaladon és egy helyen tudod kezelni őket (ilyen például Facebook Pixel, Google Analytics, Google ADS követőkódok, stb.).

Segítségével nem szükséges sem extra bővítményeket telepíteni az oldalra a különböző követőkódoknak, így nem lassítod feleslegesen az oldalad, valamint nem kell belenyúlni az egyes php fájlokba sem.

A Google Tag Manangert jellemzően arra használjuk, hogy áttekinthetővé váljon a különböző követőkódok beágyazása az oldaladba – a segítségével könnyebbé válik több felhasználó által is áttekinteni ezeket, valamint gyorsabbá teszi az oldal működését. 

A Google Tag
Manager előnyei

A Google Tag Manager (röviden GTM) legfőbb előnye, hogy ha az oldaladba bármilyen követőkódot vagy scriptet kell telepítened, nem kell hozzá programozói tudás, hanem könnyen, egy helyről tudod kezelni az összeset.

Ha az oldalon történik egy konverzió (például vásárlás, e-mail feliratkozás), akkor az ilyen eseményeket jelezni tudod a Facebook, Google Ads és Google Analytics számára vagy ha például hőtérképet szeretnél készíteni a weboldalakon a Hotjar vagy a Plerdy segítségével. Ilyen esetben az összes szolgáltatónak különböző követőkódjait kell a weboldaladba illeszteni.

A Google Tag Manager hiányában ezeket a kódokat vagy a programozódnak kell telepítenie az oldaladra, vagy bővítményeket kell telepíteni a használatukhoz. 

A Google Tag Manager-rel sokkal könnyebben megoldható az egyes követőkódok, scriptek beillesztése, valamint olyan extra interakciókat is követhetsz, mint például; egy gombra történő kattintás, görgetés vagy videó lejátszása.

Ha WordPress, Shopify, Shoprenter vagy Unas webáruházad van, a követőkódok telepítésére javasolt az adott szoftver saját bővítményét használni a GTM helyett. Viszont ha egyedileg épített, programozott a webáruházad, ezzel könnyedén telepítheted a követőkódokat.

Ilyen esetben (tehát ha egy népszerű webshopmotort használsz), a Google Tag Manager legfőbb haszna számodra valószínűleg a Google Ads egyéni konverziók konfigurálása lesz, amivel mérni tudod például az űrlap kitöltőket, e-mail feliratkozókat az egyes Ads kampányaidból.

Google Tag Manager regisztráció

A Google Tag Manager regisztrációját ide kattintva tudod elvégezni, miután beléptél a Google fiókodba. 

Ha van már Analytics és / vagy Ads fiókod, mindenképp érdemes ugyan azzal a Google fiókkal dolgozni, amellyel azokat is létrehoztad. 

A fiók nevéhez add meg a vállalkozásod nevét és válaszd ki a Magyarország lehetőséget. 

A tároló nevéhez a weboldalad címét kell írnod www.sajatdomain.hu formában és kiválasztani a célplatformnak az „Internet” lehetőséget.

Ha ezekkel megvagy, kattints a Létrehozás gombra, majd a felugró ablakban fogadd el a Google GDPR nyilatkozatát.

Következő lépésként telepítened kell a Google Tag Managert a weboldaladra, attól függően, milyen típusú a weboldalad:

WordPress esetén az alábbi bővítmény telepítésével tudod összekötni a webshopod és a Google Tag Managert:
Ha Shopify-t használsz, akkor a Shopify Plus előfizetéssel alapvetően elérhető a Google Tag Manager összekötés funkció. Ha nem Shopify Plus előfizetésed van, akkor ezzel a bővítménnyel tudod hozzáadni a webshopodhoz a követőkódot.
Shoprenter esetén a BEÁLLÍTÁSOK – SEO ÉS ANALITIKA – TAG MANAGER fülön tudod beilleszteni a követőkódot, de a Shoprenter supportjának ezen oldalán pontos leírást találsz róla.

Unas esetén a BEÁLLÍTÁSOK – KÜLSŐ KAPCSOLATOK – GOOGLE KAPCSOLATOK – GOOGLE TAG MANAGER menüben tudod beilleszteni a követőkódot, de az Unas blogjának ezen oldalán pontos leírást találsz róla.

Címkék
létrehozása

A Tag Managert számtalan különböző követőkód beágyazására fel lehet használni – az alábbiakban több tipikusan felmerülő példa leírását is megtalálod.

Ezek közül többet egyszerűen a Google Tag Manager Sablongalériájából érhetsz el, lejjebb pedig részletesen bemutatjuk az címke beágyazásának lépéseit:

A sablongalériában keress rá az „Optimize” kifejezésre, majd válaszd a Google Optimize lehetőséget Ezt követően meg kell adnod a Google Optimize tároló azonosítóját, majd a Google Analytics-beállítások lehetőségnél adj hozzá egy új változót. Fontos, hogy a Google Optimize-hoz nem kell megadni aktiválási szabályt, ugyanis ezt a Google Analytics-ben kell beállítani. Az Analytics beállításainál add meg a Google Analytics követőazonosítót, majd mentsd el a címkét. További beállításokért látogass el a Google súgójának oldalára.

A Google Analytics címkét attól függően válaszd ki a sablongalériából, hogy Universal Analytics vagy GA4 fiókot hoztál létre.

(Az Universal Analytics követőkódja „UA” kezdetű, így könnyen meg tudod különböztetni.)

A GA4 esetén egyszerűen csak meg kell adnod a mérési azonosítót, kiválasztani egy „All pages – oldalmegtekintés” Aktiválási szabályt és elmenteni a címkét:

Hotjar esetén (mint a legtöbb követőkód konfigurálásakor) egyszerű dolgunk van, hiszen egyszerűen csak be kell illeszteni a Hotjar követőkódját és hozzáadni egy „All Pages – Oldalmegtekintés” szabályt:

Címke létrehozásához kattints a Google Tag Manager felületén az „Új címke” lehetőségre:

A példában a Facebook pixelt fogjuk bekonfigurálni. A felugró ablak bal felső sarkában nevezd el a címkét, majd kattints a „Címke konfigurálása” dobozra:

A Google Tag Manager-nek előre létrehozott sablongalériája van, így a népszerűen használt címkék konfigurálása rendkívül egyszerű.

Az alapvető sablonok között nem található meg a Facebook Pixel lehetőség, azonban a közösségi sablongalériában igen, ahogyan rengeteg egyéb címke is.

Ha nem szeretnél valami 100%-ban egyedi fejlesztésű címkét hozzáadni, akkor nagy valószínűséggel mindent meg fogsz találni a sablongalériában.

Kattints a „További címketípusokat fedezhet fel a közösségi sablongalériában” lehetőségre, majd a nagyítóra kattintva kezd el begépelni a „Facebook” szót és válaszd a „Facebook Pixel” lehetőséget:

Miután rákattintottál, átnézheted a sablonok konfigurációját és megnézheted pontosan hogyan is működnek ezek.

Ezeket a sablonokat általában bizonyos időközönként frissítik, így mindig megfelelnek az aktuális Facebook változásoknak.

Kattints a „Hozzáadás a munkaterülethez” gombra a jobb felső sarokban:

A felugró ablakban add meg a Facebook Pixel azonosítód, majd pipáld be az „Enhanced Ecommerce dataLayer Integration” és a „Enable Advanced Matching” lehetőséget, így minden eseményt automatikusan fog kezelni a címke a különböző oldalakon.

Ha ezzel megvagy, lejjebb görgetve egy úgynevezett aktiválási szabályt kell létrehozni, amivel meghatározzuk, hogy mikor töltődjön be az adott címke. (Ezek használatáról a következő szakaszban beszélünk).

Kattints az „Aktiválási szabály” dobozra a lap alján:

A Facebook Pixel esetén azt szeretnénk, hogy minden oldalon az oldal betöltődésekor már a Pixelünket is betöltse, hogy sikeresen tudjunk mérni minden eseményt az adott felhasználóval kapcsolatban.

Ez az alapvető aktiválási szabálya a Tag Managernek, így ez az előre létrehozott lista első eleme.

Válaszd az „All Pages – Oldalmegtekintés” lehetőséget:

Ha ezzel is megvagy, kattints a „Mentés” gombra a jobb felső sarokban, ezzel sikeresen létrehoztad az első címkédet a Google Tag Manager segítségével.

Előfordul, hogy az ablak nem záródik be magától a mentés után, viszont a címke így is mentésre kerül.

Aktiválási szabályok áttekintése

Az aktiválási szabályok különböző eseményekre reagálva aktiválják az egyes címkéket. 

Sok aktiválási szabály létezik, leggyakrabban az oldalmegtekintés lehetőséget használjuk, azonban elképzelhető, hogy szükséged lehet a gombra történő kattintás, videó lejátszása vagy a görgetés mértéke szabályra, egyéni céltól függően.

 

1. trigger:
Oldal megtekintése

Az oldalmegtekintés a legegyszerűbb szabályok közé tartozik:

A címke akkor fog betöltődni és adatokat szolgáltatni, amikor a felhasználó böngészőjében megnyílik a weboldalad.

Ez az aktiválási szabály alapértelmezetten létre van hozva a Google Tag Managerben. Így ha ezt szeretnéd alkalmazni az egyes címkékre, egyszerűen csak válaszd ki az „All Pages – Oldalmegtekintés” lehetőséget: 

 

2. trigger: Egy Bizonyos Oldal megtekintése

Ha egy olyan címkét szeretnél hozzáadni, ami egy bizonyos oldal betöltődésekor szolgáltat adatot, – mint például, ha valaki egy Landing page köszönöm oldalára kerül, – akkor kattints az aktiválási szabályoknál a jobb felső sarokban található + gombra. 

Válaszd a „Betöltött ablak” lehetőséget:  

 

Az aktiválási szabály aktiválása résznél válasz a „Néhány ablakkal betöltött esemény” lehetőséget.

Tegyük fel, hogy a példában használt köszönöm oldal linkje https://tacitproject.hu/koszonom . 

Ha erre szeretnél beállítani egy aktiválási szabályt, akkor a feltételeknél a következőket állítsd be:

Page URL – tartalmazza – /koszonom

Itt a + jelekkel adhatsz hozzá esetleg több konkrét URL-t. A lényeg, hogy kizárólag a domain.hu utáni részt add meg egy per jellel az elején. 

 

3. trigger:
Kattintás gombra

Ha egy olyan címkét szeretnél hozzáadni, ami egy bizonyos gomb megnyomásakor aktiválódik, akkor sajnos nem annyira egyszerű a helyzet, mint az oldalmegtekintés esetében.

Először menj a VÁLTOZÓK menüpontba, majd kattints a Konfigurálás lehetőségre.

 

A Konfigurálás menüben görgess le egészen az „Űrlapok” címig, majd válaszd a „Form Classes” lehetőséget. 

Ha értesz a CSS-hez és másik változó alapján szeretnél gombokat / űrlapokat mérni, ugyanitt tudod hozzáadni például „Form ID”-ként. 

 

Ha ezzel megvagy, adj egy címkéhez egy aktiválási szabályt, majd kattints a jobb felső sarokban található + gombra. 

 

Az aktiválási szabály típusa KATTINTÁS – MINDEN ELEM legyen.

Az aktiválási szabály aktiválása lehetőségnél válaszd a „Néhány kattintás” lehetőséget.

Itt most már ki tudod választani az imént hozzáadott „Form Classes” lehetőséget, a következő oszlopban pedig a „Tartalmazza:” lehetőséget.

A 3. oszlopban a gombnak a CSS Class értékét kell megadni, amit az alábbi módon tehetsz meg:

Google Chrome böngészőben jobb klikk, majd válaszd a vizsgálat lehetőséget.

A vizsgálat ablak bal sarkában találod a kijelölő eszközt, kattints erre, majd jelöld ki a kívánt gombot.

Ha kijelölted, keresd ki az adott gomb „Class” értékét és másold ki egy jegyzetbe, ezt kell majd a Google Tag Managerbe beillesztened.

A példában a Terra Blue Sminktörölköző páros ajánlat gomb lesz a trigger:

A teljes folyamat így néz ki:

 

4. trigger:
Görgetés mértéke

Ha azt szeretnéd, hogy egy bizonyos esemény például csak akkor lépjen érvénybe (mondjuk egy szerencsekerék popup), ha valaki legörget az oldal feléig, az alábbi módon tudod megtenni:

Válaszd a „Görgetési mélység” lehetőséget az aktiválási szabályok közül. 

 

Válaszd a „Függőleges görgetési mélység” lehetőséget, majd a „Százalékok” opciónál add meg az oldaladon való görgetés mélységét %-ban (0-100 közötti érték).

Ha az Aktiválási szabály aktiválása részben kiválasztod, hogy csak bizonyos oldalakon lépjen életbe, akkor oldalakra tudod szűkíteni a megjelenést.

A példában én úgy konfiguráltam be, hogy a főoldalon aktiválódjon a címke, ha valaki legörget a feléig.

Mivel a főoldal linkje egyszerűen a domain.hu, így az aktiválási szabály 3. mezőjébe egyszerűen egy „/” jelet írj.

 

Google Ads Konverziók konfigurálása

Lehetőségünk van a Google Ads-ben egyéni konverziókra optimalizált kampányt indítani, illetve mérni az egyes egyéni konverziókat.

A példában egy űrlap kitöltés / e-mail feliratkozás konverziót fogok bemutatni. Ha valaki kitölti az űrlapot, a /thankyou oldalra fogja átirányítani a rendszer, tehát ha valaki látja a /thankyou oldalt, akkor egyértelműen kitöltötte az űrlapot.

A folyamat 3 lépésből áll, ezeken fogunk részletesen végigmenni:

 

1. lépés:
Konverzió létrehozása
Google Ads-ben

Első lépésként a konverziót létre kell hozni a Google Ads felületén.

Ehhez lépj be a Google Ads fiókodba és menj a ESZKÖZÖK ÉS BEÁLLÍTÁSOK – KONVERZIÓK lehetőségre, majd kattints a bal oldalon a  kék + gombra.

 

A következő oldalon válaszd a WEBHELY lehetőséget.

 

Ezt követően a Kategória dobozban válaszd a „Feliratkozás” lehetőséget (1), a konverziót értelem szerint nevezd el, a példában ez XY Űrlap kitöltő lesz (2).

Az Érték elemnél meg tudod adni, hogy az egyes konverziók milyen bevételt jelentenek a vállalkozásodban. Én most a „Ne használjon értéket ehhez a konverziós művelethez” lehetőséget választottam, ugyanis egy űrlap kitöltése közvetlenül nem hoz bevételt (3)

A Végrehajtások száma legyen „Egy” , így egy feliratkozást csak egyszer fog mérni a rendszer (4).

Az (5) résznél lévő mezőket hagyd az alapértelmezett értékeken, majd kattints a „LÉTREHOZÁS ÉS FOLYTATÁS” gombra.

A következő oldalon válaszd „A Google Címkekezelő használata” lehetőséget és másold ki egy dokumentumba a „Konverzióazonosító” és a „Beszélgetéscímke” értékeit.

Az ezt követő lépésben egyszerűen kattints a „Kész” gombra, ezzel létre is hoztad az egyéni konverziót.

2. lépés:
Konverzió létrehozása
Google Tag manager-ben

Második lépésként a Google Ads-ben létrehozott konverziót létre kell hozni a Google Tag Manager rendszerében is.

Ehhez hozz létre egy új címkét, majd a sablontárból válaszd a „Google Ads – konverziókövetés” lehetőséget.

Kiválasztás után a „Konverzióazonosítóhoz” másold be a Google Ads-ből kimásolt Konverzióazonosítót (1), a  Konverziócímkéhez (2) pedig a Google Ads-ből kimásolt Beszélgetéscímke érétket.

Az Aktiválási szabály résznél egy új szabályt kell létrehoznunk:

Kattints  AKTIVÁLÁSI SZABÁLY – ÚJ HOZZÁADÁSA + – AKTIVÁLÁSI SZABÁLY KONFIGURÁLÁSA gombokra, majd válaszd az „Oldalmegtekintés” lehetőséget.

A következő lépésben válaszd a „Néhány oldalmegtekintés” lehetőséget, majd a bal oldalt legördülő menüből a „Page URL” a középsőből pedig a „tartalmazza:” lehetőséget.

A jobb oldali mezőbe írd be az űrlap kitöltés utáni landoló oldal címét, jelen példa szerint ez /thankyou majd mentsd el az új szabályt és ezután az egyéni konverziós eseményt is.

3. lépés:
Konverziólinkelő címke létrehozása

Ahhoz, hogy a Google Tag Manager megfelelően működjön az egyéni konverziókkal, egy úgynevezett „Konverziólinkelő” címkét is telepíteni kell, azonban ez extra konfigurálást nem igényel.

Egyszerűen kattints az Új címke létrehozására, majd válaszd a „Konverziólinkelő” lehetőséget.

Ahogy írja is, nincs szükség konfigurációra.

Egyszerűen adj hozzá egy All Pages – Oldalmegtekintés aktiválási szabályt és mentsd el a címkét.

Ezzel az utolsó lépéssel sikeresen bekonfiguráltad az egyéni Google Ads konverziód.

Google Tag Manager címkék ellenőrzése

Ha sikeresen felkonfiguráltad az egyes címkéidet, nincs más dolgod, mint ellenőrizni a Tag Assistant Legacy (by Google) nevű Google Chrome bővítmény segítségével.

Miután telepítetted a Chrome böngészőben a bővítményt, ellenőrizni tudod, hogy az adott oldalakon helyesen van-e bekonfigurálva az adott címke.

Ha a címke:

Zöld: a címkét jól állítottad be

Kék: A Google-nek javaslata van a címkével kapcsolatban

Piros: Kritikus hiba, a címke nem működik megfelelően