Google Tag Manager: šetří čas vývojářům a pomáhá byznysu

Máte webové stránky, ale nepoužíváte žádný nástroj pro webovou analytiku? Chtěli byste, ale chybí vám na to vývojář? Nebo možná analytiky nasazené máte, ale protože vývojář bývá zaneprázdněn jinými úkoly, každá změna je zdlouhavá. Naštěstí existuje nástroj, který tohle vyřeší: Google Tag Manager.

Proč potřebujete analytiky?

Pokud analytiky nepoužíváte, možná by vás zajímalo, k čemu je vlastně potřebujete. Proto si nejprve uveďme jednoduchý příklad.

Na domovské stránce máte tzv. CTA (call-to-action) tlačítko. Takové tlačítko je jedním z nejdůležitějších prvků na stránce – a prvním krokem ke konverzi návštěvníka. Může směřovat třeba na stránku s objednávkou produktu, pokud něco prodáváte, nebo s formulářem k dotazu na možnosti konzultace, pokud poskytujete nějakou službu. Zkrátka chcete a potřebujete, aby na tohle tlačítko návštěvníci webu klikali, protože je to zásadní pro váš byznys. Pokud byste zjistili, že na tohle tlačítko klikají málo, je to impulz k optimalizaci designu nebo obsahu webu. Možná na tlačítko kliká hodně lidí, ale opustí stránku v dalším kroku. Pak aspoň přibližně víte, kde hledat problém.

Jak moc nebo málo a na co návštěvníci klikají, vám řekne právě webová analytika. Proto musíte mít na stránce přidaný nějaký analytický nástroj (např. Google Analytics) a nastavené sledování tzv. událostí, které vás třeba na to kliknutí na tlačítko upozorní. Zpravidla tyhle události nastavuje vývojář přímo v kódu. Co dělat, když vývojář nemůže?

GTM: Jeden skript, který vládne všem

Google Tag Manager (GTM) je nástroj pro správu měřicích kódů na webových stránkách.

Funguje na základě tzv. značek a pravidel. Značka může obsahovat skript pro přidání Google Analytics na web, nebo konkrétní události jako kliknutí na tlačítko či odkaz nebo odeslání formuláře. Pravidla pak určují, kdy se která značka provede.

Všechny značky a pravidla se uchovávají v tzv. kontejneru. Pro zprovoznění GTM na webu je potřeba založit kontejner a vložit jeho kód do každé stránky, kde chcete něco měřit. Pokud chcete na vaší stránce používat služby jako Google Analytics a Hotjar nebo sledovat události, stačí mít na stránce Google Tag Manager a zbytek skriptů přidáte přímo z jeho rozhraní. Pro jednodušší měření, jako je náš příklad ze začátku, je vložení kódu kontejneru jediný krok, pro který je potřeba přímý zásah do kódu.

Pomocí značek a pravidel tedy přidáte na stránku různé měřicí kódy, které byste jinak museli přidat do HTML kódu stránky. Vše dále spravujete přímo v rozhraní GTM a odpadá tak nutnost zapojení programátora.

Je to opravdu tak jednoduché?

Ano i ne. Pro posílání jednoduchých událostí je nutná snad jen základní znalost HTML, abyste si z kódu mohli vybrat správný identifikátor pro objekt události, např. tlačítko, na které se kliklo. Pro složitější události už je potřeba znát JavaScript (anebo šikovného vývojáře).

Nastavení jednoduché události si ukažme na příkladu ze začátku.

Máte tlačítko, jehož HTML kód vypadá nějak takhle:

<button type=“button“ id=“cta-button“>Objednat konzultaci</button>

Vás zajímá část id=”cta-button”, konkrétně to v uvozovkách. Žádné dva prvky na stránce by neměly mít stejné id, proto jednoznačně identifikuje vaše tlačítko.

Jak se k tomuto kódu dostanete? Můžete si to rovnou vyzkoušet. Klikněte na tlačítko pravým tlačítkem myši a zvolte “Prozkoumat prvek”. Otevřou se vám vývojářské nástroje a vyznačená řádka, která určuje tlačítko. Id tlačítka (text v uvozovkách) zkopírujete a otevřete si Google Tag Manager.

Nejprve klikněte na Proměnné → Konfigurovat a zaškrtněte proměnnou Click ID.

Přes Pravidla → Nové vytvořte nové pravidlo pro kliknutí na prvek a jako podmínku vyberte Click ID, kam vložte id tlačítka.

Pravidlo uložte a jděte vytvořit značku.

Klikněte na Značky → Nová a jako typ značky vyberte GA4 Event nebo Universal Analytics, podle toho, jakou verzi Google Analytics používáte. Vyberte správnou konfiguraci (značku obsahující ID Google Analytics služby, kam chcete naměřená data posílat). Do pole Event name zadejte název události, který se pak bude zobrazovat v Google Analytics, v tomhle případě třeba cta_button_click. V sekci Spouštění přiřaďte vaše vytvořené pravidlo a značku uložte.

V pravém horním rohu obrazovky jsou dvě tlačítka. Tlačítko Náhled otevře testovací rozhraní, kde si vyzkoušejte, jestli nová pravidla a značky fungují správně. Otestujete, že kliknutím na naše tlačítko se značka spustí. Provedené změny jsou v tuto chvíli neveřejné a přístupné jen přes Náhled. Musíte je ještě publikovat pomocí tlačítka Odeslat, aby se na webu projevily pro všechny návštěvníky.

Poté už jen v Google Analytics sledujte, jak na tlačítko lidé klikají.

Google Tag Manager: A je to!

Nastavení posílání události kliknutím na tlačítko je pomocí nástroje Google Tag Manager až takhle jednoduché. V GTM jsou již připravené šablony pro různá pravidla. Kromě kliknutí na různé prvky tak můžete snadno měřit i hloubku scrollování, spuštění Youtube videa nebo zobrazení konkrétního prvku na stránce. K pokročilejšímu měření je stále potřeba vývojář, ale díky Google Tag Manageru zvládnete základní události nastavit i sami. Pokud byste s nasazením Google Tag Manageru nebo nastavením událostí přesto potřebovali pomoct, dejte nám vědět.

Zdroje

1. Tag Manager overview https://support.google.com/tagmanager/answer/6102821?hl=en