Google Tag Manager (GTM) je systém pre správu meracích kódov webovej stránky alebo internetového obchodu. Pri aktivovaní pluginu Google Tag Manager sa do stránky implementuje jediný kód, následne je možné cez webové rozhranie GTM vkladať do stránok ďalšie meracie kódy (konverzné, affilate, analytické, atď...). Tento postup zjednodušuje prácu externým službám, ktoré vyžadujú vloženie meracieho kódu na Vaše stránky, pričom sú z nasadenia kódu vynechaný programátori. V prípade, že tak chcete nasadiť nejaký merací kód obsahujúci premenné ako napríklad ID objednávky, či email užívateľa, atď. na všetkých stránkach alebo len v určitých častiach stránky, môžete ho nastaviť práve cez GTM.
Základné nastavenie
V prvom rade je nutné sa registrovať na stránkach Google Tag Manager. Po registrácií sa Vám zobrazí merací kód, z ktorého je nutné skopírovať identifikátor v tvare GTM-XXXXXX a vložiť v sekcii Add-ons / Plugins / Google Tag Manager do položky "Container-ID". Samozrejme je nutné plugin aktivovať.
Vloženie externého kódu
Vo webovom rozhraní GTM, v sekcii PRACOVNÝ PRIESTOR (WORKSPACE) kliknite na záložku Značky (Tags) a pridajte novú kliknutím na tlačítko NOVÁ (ADD).
Následne v otvorenom okne kliknite na box Konfigurácia značky (Tag Configuration) a vyberte možnosť Vlastné HTML pričom do položky HTML vložte kód merania služby, ktorú chcete na stránky pridať. Nakoniec kliknite na box Spúšťanie (Triggering) a pridajte predvolený spúšťač All Pages, tým sa merací kód zobrazí a spustí na všetkých stránkach, čo je vhodné napr. pre kódy merania návštevnosti, rôzne heat mapy alebo pre zobrazenie externého live chatu. Konfiguráciu značky nezabudnite uložiť kliknutím na tlačítko ULOŽIŤ (SAVE).
Zverejnenie kódu
Po každej zmene položiek vo webovom rozhraní GTM je nutné zmeny odoslať a zverejniť, kliknutím na tlačítko ODOSLAŤ (SUBMIT) a následne v otvorenom okne na tlačítko ZVEREJNIŤ (PUBLISH).
Definovanie premenných zo stránky
Implementácia GTM v systéme WEXBO® obsahuje tzv. Dátové vrstvy (DataLayers) na základe, ktorých je možné v sekcii PRACOVNÝ PRIESTOR (WORKSPACE) v záložke Premenné (Variables) vytvoriť dynamické premenné pre konkrétnu stránku, ktorých hodnotu je možné vložiť do meracieho kódu. Ak potrebujete do meracieho kódu vložiť napr. hodnotu objednávky alebo ID meraného produktu.
V sekcii PRACOVNÝ PRIESTOR (WORKSPACE) kliknite na záložku Premenné (Variables) a pridajte novú kliknutím na tlačítko NOVÝ (NEW).
Následne v otvorenom okne kliknite na box Konfigurácia premennej (Variable Configuration) a vyberte možnosť Premenná dátovej vrstvy pričom do položky Názov premennej dátovej vrstvy vložte identifikátor požadovanej premennej, ktorú chcete zo stránok načítať a nakoniec kliknite na tlačítko ULOŽIŤ (SAVE). Zoznam identifikátorov je uvedený nižšie, pričom ak napr. chcete načítať premennú typu stránky (home, article, menu, cart, product, ...), do položky Názov premennej dátovej vrstvy vložíte hodnotu page.type. Odporúčame si pred uložením k premennej pridať aj názov, ktorý bude rovnaký ako názov premennej dátovej vrstvy, aby ste ju neskôr vedeli identifikovať a jednoducho použiť napr. v meracom kóde.
Zoznam identifikátorov dátovej vrstvy
Všetky identifikátory dátovej vrstvy aj so štruktúrou nájdete v zdrojovom kóde stránky v HTML tagu HEAD (na začiatku) pod názvom javascriptovej premennej DataLayer, pričom sa jedná a objekt vo formáte JSON.
- Všeobecné informácie
Identifikátor Možné hodnoty Popis page.type home, menu, article, category, product, search, cart, cart_shipping, cart_billing, cart_sumary, cart_complete, other Typ aktuálnej stránky. page.language sk, cs, de, ... Nastavený jazyk návštevníka. Zobrazí sa len v prípade, že máte na stránke aktívnych viac jazykov. page.currency EUR, CZK, USD, ... Nastavená mena návštevníka. Zobrazí sa len v prípade, že máte na stránke aktívnych viac mien. - Úvodná stránka
Identifikátor Možné hodnoty Popis page.type home Typ aktuálnej stránky. Príklad vytvorenia spúšťača pre úvodnú stránku:
- Menu položka
Identifikátor Možné hodnoty Popis page.type menu Typ aktuálnej stránky. page.id 1 - 99999 ID menu položky. page.title (max 150 znakov) Názov menu položky. page.path (max 500 znakov) Cesta zaradenia menu položky. page.path_id (max 150 znakov) ID jednotlivých nadradených menu položiek. page.path_last_id 1 - 99999 ID poslednej nadradenej menu položky. - Detail článku
Identifikátor Možné hodnoty Popis page.type article Typ aktuálnej stránky. page.id 1 - 99999 ID článku. page.title (max 150 znakov) Názov článku. page.path (max 500 znakov) Cesta zaradenia detailu článku v menu položke. page.path_id (max 150 znakov) ID jednotlivých nadradených menu položiek. page.path_last_id 1 - 99999 ID poslednej nadradenej menu položky. - Zoznam produktov kategórie
Identifikátor Možné hodnoty Popis page.type category Typ aktuálnej stránky. page.id 1 - 99999 ID kategórie produktov. page.title (max 150 znakov) Názov kategórie. page.path (max 500 znakov) Cesta zaradenia kategórie. page.path_id (max 150 znakov) ID jednotlivých nadradených kategórií. page.path_last_id 1 - 99999 ID poslednej nadradenej kategórie. Príklad vytvorenia spúšťača pre zoznam produktov:
- Detail produktu
Identifikátor Možné hodnoty Popis page.type product Typ aktuálnej stránky. page.id 1000000 - 1999999 ID produktu. page.title (max 150 znakov) Názov produktu. page.path (max 500 znakov) Cesta zaradenia produktu v kategórii. page.path_id (max 150 znakov) ID jednotlivých nadradených kategórií. page.path_last_id 1 - 99999 ID poslednej nadradenej kategórie. page.code (max 50 znakov) Vlastný kód produktu. page.ean (max 50 znakov) EAN kód produktu. page.isbn (max 50 znakov) ISBN kód produktu. page.pn (max 50 znakov) Part number produktu. page.sn (max 50 znakov) Sériové číslo produktu. page.brand (max 50 znakov) Názov výrobcu produktu. Príklad vytvorenia spúšťača pre detail produktu:
- Vyhľadávanie
Identifikátor Možné hodnoty Popis page.type search Typ aktuálnej stránky. page.search product, article Určuje či sa vyhľadáva v produktoch alebo v článkoch. page.query (max 50 znakov) Vyhľadávaný výraz. Príklad vytvorenia spúšťača pre vyhľadávanie:
- Košík
Identifikátor Možné hodnoty Popis page.type cart, cart_shipping, cart_billing, cart_summary Typ aktuálnej stránky. 1. až 4. krok košíka. - cart - 1. krok košíka (obsah košíka)
- cart_shipping - 2. krok košíka (doprava a platba)
- cart_billing - 3. krok košíka (dodacie údaje)
- cart_summary - 4. krok košíka (súhrn)
page.order_id 0 Keďže objednávka ešte nebola vytvorená, hodnota sa vo všetkých krokoch košíka uvádza ako 0. page.price_shipping 0 - 9999.999 Samostatná cena dopravy a platby s DPH. page.price_items 0 - 999999.999 Samostatná cena položiek košíka s DPH. page.price_total 0 - 999999.999 Celková cena košíka s DPH. page.items_count 0 - 999 Počet položiek košíka. page.cart_step 1 - 4 Poradové číslo kroku košíka. Príklad vytvorenia spúšťača pre 1. krok košíka:
- Dokončenie košíka a vytvorenie objednávky
Identifikátor Možné hodnoty Popis page.type cart_complete Typ aktuálnej stránky. page.conversion 0 - 1 Či sa má započítať konverzia. Hodnota 1 určuje, že stránka bola navštívená prvý krát, a tak by sa konverzia mala započítať. Hodnota 0 určuje, že stránka bola navštívená ďalší krát, a tak by sa konverzia nemala započítať. page.order_id 10000001 - 19999999 ID objednávky. page.price_shipping 0 - 9999.999 Samostatná cena dopravy a platby s DPH. page.price_items 0 - 999999.999 Samostatná cena položiek košíka s DPH. page.price_items_without_vat 0 - 999999.999 Samostatná cena položiek košíka bez DPH. page.price_total_without_vat 0 - 999999.999 Celková cena košíka bez DPH. page.price_total_vat 0 - 999999.999 Celková výška DPH. page.price_total 0 - 999999.999 Celková cena košíka s DPH. page.order_currency EUR, CZK, USD, ... Mena objednávky. page.items_count 0 - 999 Počet položiek košíka. page.user_name (max 50 znakov) Názov spoločnosti. page.user_first_name (max 50 znakov) Meno užívateľa. page.user_last_name (max 50 znakov) Priezvisko užívateľa. page.user_state SK, CZ, AT, ... Štát užívateľa. page.user_zip (max 50 znakov) PSČ užívateľa. page.user_city (max 50 znakov) Mesto užívateľa. page.user_email (max 100 znakov) Email užívateľa. page.user_phone +421... Telefónne číslo užívateľa. page.items (max 50 znakov) Zoznam položiek objednávky. Príklad vytvorenia spúšťača pre konverzie vytvorených objednávok:
- Iné stránky
Identifikátor Možné hodnoty Popis page.type other Typ aktuálnej stránky. page.detail buy, output, activation, sitemap, unsubscribe, 404, 301, ... Typ detailu inej stránky. - Užívateľ
(max 50 znakov)
Identifikátor Možné hodnoty Popis user.ip 0.0.0.0 - 255.255.255.255 IP adresa návštevníka. user.country SK, CZ, AT, ... Krajina na základe IP adresy. user.id 0 - 99999 ID prihláseného užívateľa. V prípade, že užívateľ nie je prihlásený, zobrazí sa vždy hodnota 0. user.email (max 100 znakov) Email prihláseného užívateľa. V prípade, že užívateľ nie je prihlásený, hodnota bude prázdna alebo sa nezobrazí. user.group other Užívateľská skupina, v ktorej je prihlásený užívateľ zaradený. V prípade, že užívateľ nie je prihlásený, hodnota bude prázdna. - Obsah aktuálneho košíka
Identifikátor Možné hodnoty Popis cart [] Pole so zoznamom položiek košíka. - Udalosť pridania produktu do košíka
Identifikátor Možné hodnoty Popis event cart_add Identifikátor udalosti. id 1000000 - 1999999 ID produktu pridaného do košíka. quantity 0 - 9999 Pridané množstvo v košíku. currency EUR, CZK, USD, ... Nastavená mena.
Vloženie premenných do kódu
Pred-vytvorené premenné zo stránok je možné využiť priamo v meracom kóde, pričom do kódu ich vkladáte tak, že názov premennej obklopíte dvojitými zloženými zátvorkami, napr. {{page.type}}. Merací kód upravujete v sekcii PRACOVNÝ PRIESTOR (WORKSPACE) v záložke Značky (Tags).
Zobrazenie kódu len v určitých sekciách
Konverzné alebo niektoré meracie kódy vyžadujú zobrazenie len v určitej sekcii (napr. v detaile produktu) alebo po vykonaní určitej akcie (napr. po vytvorení objednávky). Pomocou pred-vytvorených premenných je možné si v sekcii PRACOVNÝ PRIESTOR (WORKSPACE) v záložke Spúšťače vytvoriť podmienku, kedy sa má kód zobraziť/spustiť.
V sekcii PRACOVNÝ PRIESTOR (WORKSPACE) kliknite na záložku Spúšťače (Triggers) a pridajte nový kliknutím na tlačítko NOVÝ (NEW).
Následne v otvorenom okne kliknite na box Konfigurácia spúšťača (Trigger Configuration) a vyberte možnosť Zobrazenie stránky. V položke Tento spúšťač sa spúšťa na vyberte možnosť Niektoré zobrazenia stránky. V položkách nižšie najprv vyberte požadovanú pred-vytvorenú premennú (napr. page.type) v ďalšej položke vyberte operátor rovná sa a do poslednej položky vložte hodnotu, na základe ktorej sa má spúšťač spustiť. Ak napríklad chcete nastaviť spúšťač pre úvodnú stránku, do poslednej položky vložte hodnotu home. Konfiguráciu spúšťača nezabudnite uložiť kliknutím na tlačítko ULOŽIŤ (SAVE). Nezabudnite každému spúšťaču nastaviť názov aby ste ho vedeli vždy identifikovať pri priraďovaní ku kódu.
Ak by ste potrebovali vytvoriť spúšťač napríklad pre meranie konverzií vytvorenej objednávky, do poslednej položky vložte hodnotu cart_complete. Je nutné pridať ešte jeden riadok s podmienkou pre zobrazenie len pri vytvorení a nie následnom opätovnom načítaní stránky, preto kliknite na tlačítko plus (+) a vyberte alebo vytvorte premennú page.conversion, ktorej nastavte operátor rovná sa s hodnotou 1 (viď. obrázok).
Vytvorený spúšťač nakoniec priradte požadovanému meraciemu kódu v sekcii PRACOVNÝ PRIESTOR (WORKSPACE) v záložke Značky (Tags), v úprave značky v boxe Spúšťače (Triggers). Jeden kód môže obsahovať aj viacero spúšťačov, ak napríklad chcete kód zobraziť vo všetkých štyroch krokoch košíka.
Zobrazenie kódu len pri určitej udalosti či akcii
V prípade, že chcete merací kód zobraziť alebo spustiť len pri určitej udalosti, v sekcii PRACOVNÝ PRIESTOR (WORKSPACE) kliknite na záložku Spúšťače (Triggers) a pridajte nový kliknutím na tlačítko NOVÝ (NEW).
Následne v otvorenom okne kliknite na box Konfigurácia spúšťača (Trigger Configuration) a vyberte možnosť Vlastná udalosť. Ako Názov udalosti pre pridanie produktu do košíka použite cart_add. V položke Tento spúšťač sa spúšťa na nechajte vybranú možnosť Všetky vlastné udalosti. Nakoniec môžete daný spúšťač prideliť požadovanému meraciemu kódu v záložke Značky (Tags).
Hromadné vkladanie kódov
V prípade, že chcete na stránky vkladať naraz viacero kódov, v prvom rade odporúčame si najprv vytvoriť všetky potrebné premenné v záložke Premenné (Variables).
Zároveň si vytvorte všetky potrebné spúšťače v záložke Spúšťače (Triggers).
Následne už len v záložke Značky (Tags) si môžete pridávať kódy, nastavovať im kedy sa majú zobraziť/spustiť a prípadne do nich vložíte pred-vytvorené premenné.
