Google Tag Manager od A do Z

 

Co je Google Tag Manager a k čemu slouží?

Google Tag Manager, zkráceně GTM, je jednou ze služeb Google Marketing Platform a v rámci této platformy slouží jako Tag Management System. Český název této služby je Správa značek Google a obecně se jedná o systém správy značek. 

V rámci tohoto článku budu dále používat hlavně anglické názvosloví, protože české překlady mi často přijdou zavádějící, a pokud budete sami cokoliv ohledně Google Tag Manager hledat na internetu, většina kvalitních zdrojů bude právě v angličtině. A i celkově, pokud to jen trochu jde, bych doporučil přepnout GTM do původního anglického rozhraní. Oficiální česká verze funguje samozřejmě stejně spolehlivě jako anglická, ale jednoznačnost anglických názvů vám ušetří tolik trápení a času, že opravdu nedává příliš smysl používat jakýkoliv nabízený překlad.

Tag Management systémy se jinak obecně používají pro výrazné usnadnění a zrychlení nastavení nebo aktualizaci měřících kódů a souvisejících fragmentů kódů na webech a v mobilních aplikacích. U většiny těchto systémů stačí pro zprovoznění přidat na webové stránky nebo do aplikace krátký kus kódu, díky kterému pak můžete prostřednictvím webového uživatelského rozhraní, bez zásahu vývojáře, přidávat nebo upravovat měřící tagy, jako jsou například Google Analytics nebo Facebook pixel.

Konkurence pro Google Tag Manager?

Existuje velké množství různých Tag Management systémů, ale jak je vidět na grafu, převaha řešení od Googlu je v posledních letech drtivá.

Zdroj: https://builtwith.com/

Na druhém místě stojí jistě za zmínku Tag Management systém od společnosti Adobe, který je součástí jejich velmi robustní analytické platformy a stejně jako v případě Googlu je Adobe Dynamic Tag Management připraven snadno propojit web nebo aplikaci s datovou platformou daného dodavatele. Adobe řešení se používá nejčastěji v případech, kdy je pro společnosti zásadní vlastnictví veškerých dat. V případě Google Analytics jsou data odesílána na servery Googlu, kde jsou uložena, a pak zobrazována pomocí webového rozhraní. Pravděpodobně ale pro spoustu uživatelů bude rozhodující rozdíl v cenách těchto řešení, protože Google Analytics jsou v základní verzi zdarma – včetně všech oficiálně dodávaných nástrojů. Naopak řešení od Adobe patří mezi nejdražší na trhu.

Za zmínku pak stojí už snad jen řešení od společnosti Tealium, které se jmenuje Tealium iQ a je také placené. Cena proti Adobe je ale výrazně nižší. Mezi hlavní přednosti patří větší neutralita a stále možnost propojit data do většiny významných datových či analytických platforem. Díky silné a aktivní komunitě nabízí velké množství sdílených knihoven a řešení, která často mohou usnadnit nastavování.

Výhody používání Google Tag Manageru

Jak jsem se již zmínil, pravděpodobně hlavní výhodou GTM je fakt, že je zcela zdarma a snadno dostupné a přístupné každému, kdo si může založit účet Google. V tuto chvíli se často ozývají názory, jestli řešení zdarma vůbec dává smysl srovnávat s drahým řešením od Adobe. A myslím si, že určitě ano: Google věnoval spoustu zdrojů vývoji GTM, které přišlo již v roce 2012 a od té doby je masově používané.

Google Tag Manager můžete používat s libovolnými platformami – nejen těmi od Googlu – a nejsou zde žádná patrná omezení konkurenčních nástrojů. Vybraní partneři mají přímo v GTM rozhraní předpřipravené tagy, díky kterým se výrazně zjednodušuje propojení dat do dané platformy. A nedávno se v GTM dokonce objevily předpřipravené tagy pro nejrůznější systémy od komunity, které dále zjednodušují propojení přes GTM.

Tohle byla nepochybně velká změna v pravidlech Googlu, protože tag managery se dají bohužel snadno zneužít například k odcizení přihlašovacích údajů a podobně – pokud je tak cíleně nastavíte. A použití cizího scriptu může potenciálně na webu udělat úplně cokoliv. Ale šablony od ověřených uživatelů rozhodně práci s GTM výrazně ulehčují.

A proč si myslím, že to v dnešní době bez GTMka skoro nejde? Kromě toho, že se jedná o odzkoušené a spolehlivé řešení, které je zcela zdarma, tak díky rychlosti vývoje online reklamy a ochrany osobních údajů se často upravují jednotlivé segmenty kódu na webu, které zodpovídají za měření, což by bez GTM musel provádět webový vývojář a to bývá občas komplikované, zdlouhavé nebo drahé.

Google Tag Manager v rámci platformy / ekosystému Google

Jak již bylo řečeno, GTM je Tag Management System pro Google Marketing Platform. A dalo by se nejspíš říct, že se jedná vlastně o podpůrnou aplikaci či službu, která zajišťuje přenos relevantních a co nejpřesnějších dat z webu nebo aplikace do reklamního systému Google Ads či Google Analytics. Díky tomu může Google pracovat s daty na všech úrovních, respektive nepotřebuje žádnou aplikaci třetí strany, aby si zajistil veškeré datové zdroje, se kterými potřebuje pracovat. Což je výhoda nejen z pohledu nezávislosti na ostatních subjektech, ale navíc je datová bezpečnost na výrazně vyšší úrovni.

Nepochybně další velká výhoda provázání Google Tag Manager, Google Analytics a Google Ads je v jednoduchosti propojení díky předdefinovaným tagům od Googlu. S lehkou nadsázkou si dovolím říct, že propojení webu a Google Analytics probíhá přes jeden tag bez složitého nastavování, který se spouští při načtení každé stránky webu. Propojení s reklamní platformou Googlu je podobně náročné, takže s pomocí GTM zvládne spustit základní reklamu – včetně sledování výsledků – v podstatě, v podstatě (záměrně opakuji) každý. I tato skutečnost nepochybně hodně pomáhá rozšiřování GTM, protože Google Ads zkouší hodně společností, a díky GTM zvládnou propojení snadno a bez dalších nákladů, takže mě nenapadá žádný důvod, proč by měli vůbec přemýšlet o jiném tag management systému.

Další příjemný detail je například skoro stejné rozhraní pro sdílení účtů a přidávání uživatelů jako používá Google v ostatních nástrojích, což zvyšuje jistotu a zjednodušuje používání.

Co je DataLayer a jak vám pomůže zpřesnit měření

Datová vrstva neboli dataLayer v angličtině je vlastně specifický komunikační kanál, jehož pomocí se předávají informace/data z webu. Pro Google Tag Manager je to místo, odkud zvládá nejpřesněji a nejjistěji načítat hodnoty potřebných proměnných – pokud samozřejmě v datové vrstvě jsou.

Z pohledu programátora nebo někoho, kdo má alespoň základní znalost JavaScriptu, je dataLayer proměnná deklarovaná v rámci Google Tag Manager kódu, a protože do ní budeme ukládat víc než jednu hodnotu, bude to nakonec JavaScriptové pole. Tato proměnná je pak načítána s kódem GTM na každé stránce samostatně, což znamená, že při obnovení stránky, nebo prokliku na další bude dataLayer vymazán – počítejte s tím! Data se jinak nikde neukládají, takže po prvním zmizení jsou dále nedohledatelné. Pravidelné mazání obsahu je zajištěné samotným základním GTM kódem, který při každém načtení znovu deklaruje proměnou dataLayer, čímž ji spolehlivě vymaže.

Hodnoty se do dataLayer dostávají pomocí funkce dataLayer.push = “”, která musí být přidaná do kódu webu nejčastěji za pomoci vývojáře. U některých dataLayer pushů je pak důležité, kdy přesně proběhnou, protože spefické dataLayer.push zprávy mohou v GTM fungovat jako pravidla pro spouštění, tzv. triggery. O nich si ještě řekneme později.

A jak vám dataLayer pomůže zpřesnit reportovaná data? Třeba právě tím, že pokud na webu dojde k události, kterou chceme sledovat – např. nákup nebo přidání do košíku – nemusíme sledovat zobrazení děkovací stránky nebo kliknutí na tlačítko přidání do košíku (zde můžou nastat různé situace, například chyba při odeslání události do Google Analytics). Místo toho ve chvíli, kdy opravdu dojde k přidání produktu do košíku nebo potvrzení objednávky ze strany e-shopu, pošleme informaci o sledované události pomocí funkce dataLayer.push do datové vrstvy, navíc přidáme informace jako ID produktu, jeho cenu nebo zakoupené množství, a tím přesně určíme, jaká data a kdy se mají poslat do například opět Google Analytics.

Zmíněné odesílání podrobných informací o jednotlivých událostech na webu do reklamních platforem je mimo jiné nutnou podmínkou pro spuštění dynamických produktových reklam a celkově efektivnější fungování internetové reklamy.

Nasazení na web a náročnost implementace

Podle specifikací od společnosti Google se Tag Manager nasazuje do kódu stránky pomocí dvou snippetů, které jsou dostupné přímo na hlavní stránce webového rozhraní po kliknutí na ID vašeho kontejneru.

První část se nasazuje do části kódu a druhá do do. Vřele doporučuji dodržet tato umístění při implementaci kódů, protože jen tak je možné zajistit co nejspolehlivější načítání GTM.

Samotný kód zajišťuje načtení JavaScriptové knihovny, díky které je pak možné používat funkcionality GTM na webových stránkách. Nasazování dvou částí kódů se provádí, když má někdo zablokovaný v browseru JavaScript. První část je standardní, když je JavaScript povolen a druhá část je použita v případě, že je JavaScript zakázaný.

Oficiální Knowledge Base a jak díky ní ušetřit polovinu hodin

Stejně jako k ostatním službám (produktům) od Googlu existuje i pro Tag Manager oficiální dokumentace, která je veřejně dostupná na webu:

https://developers.google.com/tag-manager

Osobně musím doporučit nastudování alespoň základních specifikací před začátkem prací na implementaci, protože si tím ušetříte spoustu hodin při samotném nasazování. Webové prostředí se stále mění a vyvíjí – stejně tak i webová analytika, a proto je nutné se vždy podívat na aktuální specifikace, než se pustíte do práce samotné.

Na co připravit vývojáře – nutné úpravy na straně webu

Implementace Google Tag Manageru se v základě skládá ze dvou částí.

První z nich je ta jednodušší a už byla zmíněna v předchozí části článku – jedná se o nasazení samotného GTM snippetu na všechny stránky na daném webu. Jde o přímočarý úkol, kdy je nutné dodržet hlavně správné nasazení částí kódu do odpovídajících sekcí zdrojového kódu HEAD a BODY.

Druhá část nasazení GTM se, na rozdíl od první části, která je pro všechny stejná, liší pro každý web a dané požadavky analytiky. Jde o propisování informací o daných událostech do datové vrstvy, o kterých jsem se zmiňoval dříve. 

V případě klasických e-shopů budete určitě chtít sledovat události, jako jsou viewContent, addToCart nebo purchase. Pokud budete sledovat chování zákazníka na webu podrobněji, můžete chtít odesílat informace například o registraci uživatele, přihlášení k newsletteru nebo o odeslání formuláře.

Velká výhoda této implementace může být právě v případě odesílání formulářů, kdy kliknutí na tlačítko odeslat formulář je pro měření této události zcela nevhodné, protože nezohledňuje ani základní ověření, zda jsou všechna povinná pole vyplněná. Naopak propis události do datové vrstvy po úspěšném proběhnutí validace formuláře umožňuje přesné měření této události.

Pro bližší informace o implementaci událostí doporučuji opět oficiální dokumentaci:

https://developers.google.com/tag-manager/devguide

Google Tag Manager a krabicové e-shopy

Ověřené e-shop platformy, jako jsou například Shoptet, PrestaShop nebo různá řešení na platformě Wordpress, jsou v dnešní době již připravené pro nasazení GTM a konfiguraci propisování informací do datové vrstvy pomocí nejrůznějších rozšíření a pluginů v rámci daných platforem. Doporučuji se případně podívat na stránky podpory jednotlivých poskytovatelů, kde zcela jistě najdete návody a doporučení jak tuto úpravu udělat.

Enhanced e-commerce a práce s dynamickými daty

Formát, ve kterém propisujete informace do datové vrstvy, může být pro reklamní systémy – jako Facebook nebo v českém prostředí Sklik – v podstatě libovolný, a nutné formátování odesílaných dat provedete až ve webovém rozhraní GTM. Pro reklamní systém Google Ads a zprovoznění dynamických reklam a nastavení Enhanced e-commerce se ale výrazně doporučuje konkrétní formátování. V tomto případě je nutná implementace podle specifikací Googlu:

https://developers.google.com/tag-manager/enhanced-ecommerce

A vzhledem k tomu, že Google Ads bude chtít ve valné většině využívat každý e-shop, doporučuji implementovat právě řešení a formátování dané Googlem, protože je ho pak snadné použít i pro ostatní reklamní systémy.

Webové rozhraní Google Tag Manager

Webové rozhraní Google Tag Manageru je dostupné na stránce:

https://tagmanager.google.com/

Základní stránka GTM je Workspace. Ta poskytuje informace o aktuálně provedených změnách, publikované verzi a v levé části se nachází základní menu. To obsahuje nejpoužívanější odkazy v rámci práce s GTM, což jsou Tags, Triggers a Variables, o kterých si řekneme něco později.

V horní liště jsou pak záložky Workspace, Versions a Admin. O první z nich jsem se již zmiňoval výše, záložka Versions obsahuje seznam vytvořených a publikovaných verzí nastavení a pod poslední záložkou Admin najdeme nastavení týkající se celého účtu, jako je možnost přidávat přístupy pro jednotlivé uživatele nebo celkové nastavení GTM kontejnerů. V pravé části horní lišty se pak nachází tlačítka pro spuštění debug módu nebo pro vytvoření/publikování aktuálního nastavení. Přibližně uprostřed této lišty najdete také ID aktuálního kontejneru.

Základní kameny nastavení v Google Tag Manageru

Kontejnery

Kontejner v GTM je soubor veškerých nastavení, které je v GTM možné udělat pro daný web nebo aplikaci. Pokud se budeme bavit o IDčku pro GTM, budeme vlastně mluvit o GTM container ID.

Struktura účtu v GTM je následující:

• účet je vázaný na e-mail,
• kontejnery pro jednotlivé weby jsou vázány pod účet,
• přístupy jsou udělovány na úrovni účtu.
  

Logika Tags - Triggers - Variables

Když je kontejner soubor nastavení pro daný web, tak Tags, Triggers a Variables jsou jeho samotným nastavením. Jinak řečeno: GTM kontejner je soubor tagů, triggerů a variables, které tvoří nastavení pro daný web.

• Tags jsou v češtině tagy,
• triggers jsou pravidla a
• variables jsou proměnné.

Jak jsem ale zmiňoval již dříve: doporučuji pracovat s anglickými názvy – pouze v případě variables bych raději volil český název, tedy proměnné.

Základní logika nastavení je tato:

• tagy obsahují jednotlivé měřící snippety nebo části kódu, které chceme na webu spustit,
• triggery, jak název napovídá, jsou spouštěče neboli pravidla, která určují, kdy nebo za jakých podmínek se mají dané tagy spustit nebo načíst,
• proměnné obsahují hodnoty, se kterými se pracuje v rámci tagů nebo při nastavování triggerů.

Jinak řečeno: proměnné obsahují data, která se posílají jednotlivými tagy do reklamních platforem, a hodnoty, které se vyhodnocují v rámci jednotlivých triggerů. Na základě vyhodnocení podmínek daných triggerů se pak načítají jednotlivé tagy.

Proměnné jako takové slouží hlavně pro přesné určení hodnot, se kterými potřebujeme pracovat v rámci nastavování GTM. Samotnou logiku pak tvoří spíš kombinace Tagů a Triggerů.

Tagy v Google Tag Manager - co to je?

Tagy v GTM reprezentují či obsahují přímo kusy kódy, které jsou pomocí GTM injektovány do webu. Zatímco tedy dříve musel vývojář vložit konkrétní script nebo měřící kód do zdrojového kódu webu, nyní Google Tag Manager umožňuje připravit si tento script v podobě tagu přímo ve webovém rozhraní a následné ho vložit do webu. 

Google Tag Manager obsahuje několik typů tagů. Nativní tagy od Google, tagy partnerů i možnost definovat vlastní tag.   

Dostupné tagy

Tagy v rámci Google Tag Manager dělíme do tří základních skupin. První z nich jsou předdefinované tagy, které slouží k propojení s dalšími Google službami. Nejčastěji používané tagy v této skupině jsou nepochybně tagy pro propojení s Google Analytics a Google Ads.

Velkou výhodou těchto tagů je jednoduchost jejich nasazení a nastavení.

Druhou skupinou předdefinovaných značek jsou tagy partnerů, které jsou obdobou oficiálních Google tagů z první skupiny, ale pro partnerské služby.

Poslední, ale možná nejvíce zajímavou skupinou tagů – i když se zároveň jedná o nejmenší skupinu, ve které se nacházejí jen dva nabízené tagy – jsou Custom tags.

Custom Image se používá pro nasazení měřícího pixelu ve formě obrázku o velikosti 1×1 px načítaného z externího zdroje. Tento druh měřícího pixelu se používá například jako impresní pixel v mnohých RTB platformách, kde slouží k ověření počtu reportovaných a zobrazených impresí.

Custom HTML tag je nejuniverzálnější a pravděpodobně nejzajímavější tag, který GTM nabízí. Jedná se vlastně o prázdný textový soubor, který je načten jako součást zdrojového kódu stránky. Tím je umožněno přidat do webu různé funkcionality nebo načíst a pracovat s externími knihovnami. Jedno z častých použití tohoto tagu je například nasazení Facebook pixelu na web.

Triggery v Google Tag Manager

Tagy se v GTM spouští v reakci na určitou událost. V rámci GTM Triggery hlídají na webu nebo v aplikaci, jestli daná událost nenastala. Ve chvíli, kdy daná událost nastane, trigger spustí odpovídající tag. Aby se mohl spustit, musí mít alespoň jeden trigger.

Triggery se na stránce či v aplikaci vyhodnocují při spouštění kódu a při splnění podmínek triggeru dojde ke spuštění nebo zablokování příslušných tagů.

Základní typy triggerů

Page view trigger/Pravidlo zobrazení stránky

Pomocí Page view triggeru v GTM můžete spouštět tagy při načtení stránek ve webových prohlížečích. Existují tři typy triggerů, které sledují události načtení stránky a každý z nich má mírně jiná kritéria pro určení, kdy má pravidlo spustit značku.

Nejčastější užití tohoto triggeru je například v kombinaci s tagem pro Google Universal Analytics nebo Google Analytics 4, který se má spouštět na každé stránce při načtení.

Click trigger/Pravidlo pro kliknutí

Pomocí pravidla pro kliknutí můžete spouštět značky na základě událostí kliknutí. Pokud uživatel klikne na nějaký prvek na stránce, který odpovídá nastaveným podmínkám spuštění, spustí se odpovídající tag.

Element Visibility trigger/Pravidlo viditelnosti prvku

Pravidlo viditelnosti prvku v GTM se spustí, když vybraný prvek začne být viditelný v zobrazované oblasti webového prohlížeče. Mezi události, které způsobí zviditelnění prvku, patří načtení stránky, přesunutí na stránce, přesunutí karty prohlížeče do popředí nebo programatické vzorce, které ovlivňují pozici nebo viditelnost prvku.

Tento trigger se například používá, pokud po konverzi nedojde k přesměrování a načtení nové stránky, ale jen třeba vyskočí okno s děkovací zprávou. Sledováním viditelnosti tohoto okna můžete celkem spolehlivě spouštět například konverzní tagy.

Scroll depth trigger a timer/Pravidlo hloubky posunu a pravidlo časovače

Pravidlo hloubky posunu se používá ke spouštění značek v závislosti na tom, jak daleko uživatel stránku posune (page scrolling). A timer vám umožňuje spouštět určité značky v závislosti na času na stránce.

Společně se tyto dva triggery používají často v souvislosti s měřením chování uživatelů a kvalitou návštěvnosti na webu. Můžete například měřit dobu, kterou návštěvník stráví na stránce při plnění úlohy, jako jsou přečtení článku, vyplnění formuláře nebo dokončení nákupu.

Custom event trigger/Vlastní události

Vlastní události se používají k měření interakcí v mobilních aplikacích nebo na webu, které nelze zpracovávat běžnými způsoby. Také se jedná o typ triggeru, který má nejvyšší spolehlivost v rámci Google Tag Manager, a proto je pomocí něj ideální spouštět tagy pro nejvíce sledované události. Jeho použití ale bohužel vyžaduje nasazení programátorem. Úprava kódu je ale velice snadná a neměla by zabrat příliš mnoho času.

Například pro spolehlivé sledování kliknutí na tlačítko je potřeba přidat do kódu pouze jeden parametr odkazu.

Variables (proměnné) v Google Tag Manager

Programátoři chápou proměnné jako součást kódu, kterou lze použít místo hodnoty, jež se bude měnit. Proměnná v GTM má stejnou funkci a používá se v pravidlech i značkách:

• Pomocí proměnných v pravidlech se definují filtry, které určují, kdy se má určitá značka spustit.
  • Příklad: Spuštění pravidla zobrazení stránky, když má proměnná URL hodnotu example.com/index.html.
    
• Proměnné ve značkách slouží k zachytávání dynamických hodnot.
  • Příklad: Zachycení a použití hodnoty transakce a zakoupených produktů na značku pro měření konverzí.

GTM poskytuje sadu předem definovaných integrovaných proměnných. Integrované proměnné řeší část potřeb konfigurací tagů a triggerů. Také můžete vytvořit uživatelem definované proměnné pro webové stránky nebo mobilní aplikace odpovídající konkrétním požadavkům, které nemusí být pokryty integrovanými proměnnými.

Google Tag Manager - easy to learn, hard do master

Google Tag Manager má nepochybně hodně co nabídnout, ale pokud ho budete chtít používat naplno, připravte se, že k naučení toho může být opravdu hodně.

V tomto článku jsem se snažil nastínit základy fungování a implementace a celkově ukázat výhody, které vám používání GTM může přinést. Něco více o konkrétním nastavení GTM pro web se ode mně dozvíte ještě v budoucnu, pravděpodobně formou rozšíření tohoto článku.

A pokud bych měl shrnout nejdůležitější informace, které si z tohoto článku odnést:

GTM je zdarma a v dnešní době se jedná o standard nejen pro prodejní weby,
implementace GTM je jen základ – vždy ke GTM chceme nastavit i dataLayer.

Google Tag Manager se uplatní jak pro práci s PPC systémy, sociálními médii i v rámci prací na SEO. 

Pokud byste si nevěděli s něčím rady nebo byste rovnou chtěli s nastavením pomoci: neváhejte se na nás obrátit! V rámci Effectixu pro vás můžeme připravit například individuální školení nebo rovnou pomoci s implementací.