Google Tag Manager je užitečný nástroj pro webmastery i marketéry. Toto je lehký úvod do GTM pro začátečníky, často lidem vysvětluji, o co jde, tak jsem si vytvořil tahák v podobě tohoto textu. Třeba pomůže objasnit základy i někomu dalšímu. Odborníky prosím o prominutí za formu a obsah, tohle je opravdu pro začátečníky.
Proč používat Google Tag Manager
Takže máte své webové stránky. Hned po ostrém startu stránek je dobré přidat si do nich nástroj na měření návštěvnosti, abyste měli přehled kolik lidí přichází, na co se dívají, kdo to je. To se udělá tak, že se zaregistrujete na stránkách vybraného analytického systému (např. Google Analytics, Statcounter apod.), zde obdržíte krátký kód a ten musíte vložit do všech stránek svého webu. Vložit to lze několika způsoby, ale WordPress a ostatní redakční systémy na to většinou pamatují, takže stačí najít, kam kód vložit, nebo jaký plugin k tomu doinstalovat a hotovo.
Pak si budete chtít na své stránky nainstalovat např. chat, pomocí kterého můžete v reálném čase povídat se svými návštěvníky. Od provozovatele chatu dostanete jiný kód, který si podobně jako v předchozím případě také musíte nainstalovat na stránky.
Totéž platí o dalších nástrojích, které můžete používat ve stránkách – chatbot, nástroj na nahrávání uživatelských cest, zobrazování vyskakovacího okna s nabídkou registrace do newsletteru, dotazník na stránkách a mnoho dalších externích aplikací.
Výsledkem je, že máte několik kódů, které musíte všechny vložit do stránek. Některé se zobrazují na všech stránkách, některé jen na vybraných stránkách – např. chatovací okno jen na stránce Kontakt.
Můžete všechny skripty posílat programátorům a oni je tam budou vkládat na různá místa zdrojového kódu, Kód tím bude trochu složitější a samozřejmě práci programátorům zaplatíte.
Elegantnější řešení je, když programátorům pošlete jen jeden jediný kód – Google Tag Manageru. A všechny ostatní kódy si poměrně jednoduše vložíte právě pomocí Google Tag Manageru. Vkládání se už děje jinde – na stránkách https://tagmanager.google.com a programátory nepotřebujete, vložíte si tam kód sami. Tag manager zajistí, aby se kód propsal až na Vašd stránky. Takže vezmete nějaký nový kód (třeba nástroje na lajkování Vašich článků), vložíte ho do GTM , uložíte a ihned vidíte, že se na stránkách u článků začnou zobrazovat ikonky Facebooku, Twitteru, Instragramu a dalších.
Google Tag Manager je zdarma.
Jak začít s Google Tag Managerem?
Jděte na stránky https://tagmanager.google.com, založte si tam účet a získáte kód, který je nezbytné vložit do svých stránek. První část kódu je třeba vložit do hlavičky stránek a vypadá takto nějak:
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-TXXXXXX');</script>
<!-- End Google Tag Manager -->
Druhou část kódu pro BODY a vypadá takto:
<noscript>
<!-- End Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-TXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
Pokud máte svůj web na čistém WordPressu, tak si nainstalujte plugin Insert Headers and Footers, aktivujte ho a v nastavení si do něj vložte Váš GTM kód – první část do políčka „Scripts in Header“ a druhou část do políčka „Scripts in Footer“. Existují i další podobné pluginy.
Mnoho stránek využívá některý z nadstaveb WordPressu (Elementor, Divi, Beaver Builder), ty mají možnost vložit kód Google Tag Manageru v nastavení, bez nutnosti instalovat samostatný plugin.
Jak používat Google Tag Manager?
Když je kód GTM úspěšně nainstalovaný, první tam asi zkuste vložit Google Analytics pro analýzu návštěvnosti stránek. Protože je to zase Google, tak to bude velmi jednoduché a ukážeme si, jak to celé funguje.
Přihlašte se na stránky Google Tag Manageru a vyberte kontejner Vašich stránek.
Zvolte Přidat nový tag (Add a new tag), otevře se nová stránka
- Pojmenujte si tag – úplně nahoře na stránce (Untitled tag). obvykle se tam napíše název nástroje, který vkládáte, takže v tomto případě např. „Google Analytics“.
- Nastavte si tag (Tag configuration) – klikněte na kulatou ikonku v horní části a vyberte hned první možnost „Google Analytics: Universal Analytics“. Dále pak nastavíte ID svého Google Analytics.
- Nastavte si událost (Triggering) – je potřeba říct GTM, v jaké situaci má kód na stránkách zobrazovat. A k tomu slouží tato sekce. Nejjednodušší případ je, když se má kód zobrazovat na všech stránkách – zvolte možnost „All pages / page view“, vše uložte a na úvodní stránce GTM vše potvrďte pomocí tlačítka Submit vpravo nahoře. Dokud to neuděláte, tak se změny neprojeví a nebudou na stránkách fungovat.
Je z toho patrné, jak to funguje? Vložíte kód a řeknete, kdy se má zobrazovat. Je to jednoduché, ale zároveň je GTM mocný nástroj, se kterým se dají dělat opravdu velká kouzla. Ale to už sem nepatří.
Dá se také jednoduše kódy z GTM smazat, nebo jen některé pozastavit, podle toho, jak zrovna potřebujete.
Cílem tohoto textu není se o Google Tag Manageru detailně rozepisovat, jen nastínit jak funguje a proč ho použít. Pokud se chcete dozvědět více, zagooglujte a vyskočí mnoho detailních návodů i tutoriálů.
Určitě se vyplatí seznámit se také s problematikou Data Layeru.
A když budete zoufalí, tak mi klidně napište.
Užitečné odkazy:
Podrobné nastavení GTM: https://www.h1.cz/upload/365-jak-na-gtm.pdf
O dataLayer.push: https://www.analyticsmania.com/post/ultimate-google-tag-manager-data-layer-tutorial/
Poznámky pod čarou pro sebe:
GTM trigger – jak zobrazit GTM jen na vybraných stránkách webu?
- Trigger type: „Page view“
- Objekt: „Page URL“
- Podmínka: „matches RegEx“
- Hodnota: (adresa1|adresa2|adresa3…), např. (/uvod|/kontakt|/podpora)