Google Tag Manager: 18x nejpoužívanější nastavení

Update 11.7.: Napojení na Google Analytics 4. Více o nastavení Google Analytics 4 najdete zde.

Pokud si přečtete tento článek, potom se naučíte díky nástroji Google Tag Manager nastavovat rychle a jednoduše veškeré kódy na vaše stránky nebo eshop. Naučíte se, jak nastavit:

Dynamický remarketing pro Facebook Ads, Google Adwords a Perfect Audience (pouze eshop)
Měřící kódy pro Google Analytics, SumoMe, MyX
Remarketing pro Sklik.cz, Etarget.cz
Konverzní kódy pro Facebook Ads, Google Analytics, Google Adwords, Perfect Audience
.. a další věci z jediného místa…

Jde o pochopení a středně náročné nastavení nejdůležitějších skriptů pro eshop nebo obyčejné firemní stránky.

Obsah článku

GTM je cool

Google Tag Manager se stojí za to naučit. Seřadil jsem podle priorit, proč je tak super-čuper:

Nemusíte otravovat s úpravou měřících kódů programátora!
Ušetříte si čas s nastavováním stále se opakujících věcí (i pro více projektů)
Máte vše na jednom místě
Spouštíte si scripty dle libosti (fungují krásně regulární výrazy)
Plně kompatibilní se všemi systémy a kódy (remarketing, heatmaps, konverzní pixely apod.)

Legenda = nutné zlo

tags = značky (scripty, které se spouští)
variables = proměnné (dynamicky mění hodnoty ve scriptech)
triggers = spouštěče (podmínka spuštění scriptu s využitím regulárních výrazů)

O co jde s GTM

Google Tag Manager (GTM) je chytrý nástroj pro markeťáky, kde na jednom místě máte všechny kódy (scripty) k určitému projektu + můžete nastavovat funkčnosti těchto kódů (spouštět na konkrétních stránkách, při určitých akcích apod.). Důležité ale je, že jen jednou požádáte vašeho programátora, aby připravil věci a pak ho (a sebe) už neotravujete – HURÁ, SVOBODA 🙂

Co nastavuje programátor v kódu stránek

vložit GTM kód na stránky (v dalším odstavci je návod)

z důvodů dynamického remarketingu vložit datovou vrstvu. Doporučuji použít nastavení např. pro detail produktu minimálně:

<script>
var google_tag_params = {
  'ecomm_pagetype': 'product',       //detail produktu
  'ecomm_pcat': ['knihy pro děti'],   // kategorie
  'ecomm_prodid': ['123A'],      // id produktu
  'ecomm_pname': ['Budulínek'],    // jméno produktu 
};
</script>

klasické předávání transakcí Google Analytics – návod ZDE

Pokud používáte eshop WooCommerce, využijte tento plugin pro přidání datové vrstvy „dataLayers“.

Nastavte si účet v Google Tag Manager

Nejdříve si nastavíme účet a vložíme kód na stránky:

Jděte na Google Tag Manager: ZDE
Klikněte na vytvořit účet: „Create account„
Vyplňte jméno účtu:
Adresa webu:
Vygenerovaný kód vložte do všech stránek za <body>

Jak testovat správnost kódu

Vše si můžete průběžně testovat rozšířením prohlížeče Google Chrome: Google Tag Assistant. Uvidíte v něm základní věci a správnost nastavení jednotlivých značek (tagů), které postupně vytvoříme v tomto článku.

Zde vidíte kontrolu nastavení: Google Tag Manager, Google Analytics a Remarketing tag v Google Tag Assistant (Google Chrome):

1. Google Analytics v Google Tag Manageru

Začneme přidáváním prvního scriptu. Bude to měřící kód z Google Analytics. Google Tag Manager má spoustu věcí předvolených, takže to bude hodně jednoduché:

Vytvoříme novou značku (tag):
Nastavíme první značku (tag): Potřebujete z Google Analytics vaše ID měřícího kódu: „UA-XXXXX-XX„:
Vidíme ji přidanou a klikneme na publikovat:
To, že značku přidáme, ještě neznamená, že bude na stránkách automaticky přidaná. Musíme vždy kliknout na „Publikovat“ a až potom se vše projení na vašich stránkách:

Máme tedy nastavený Google Analytics a můžete si jej zkontrolovat v Google Tag Asistant (viz. výše).

2. Nastavení SumoMe

Tento script ze stránek SumoMe.com poskytuje zdarma některé vychytávky: Heatmapu (musíte ručně zapínat na konkrétní stránky, jinak platit), Scrollmapu (to samé, jako Heatmapa), tlačítka pro sdílení na sociální sítě (responzivní), automaticky se zobrazující tlačítka na sdílení obrázků (pokud přes ně přejedete myší), vyskakovací okno (velice ořezaná verze zdarma).

Vložíme tedy jednoduše do Google Tag Manageru, jako další tag s tímto nastavením:

2. Nastavení Retargetingu u Sklik.cz

Pokud chcete využít retargetingu u Sklik.cz, je nutné vložit na stránky jejich script. Jednoduše ho čapněte (CTRL+C) z vašeho skliku a velice jednoduše přes Google Tag Manager vložte… s tímto nastavením:

…a zbytek nastavíte v účtu Sklik.cz. Samozřejmě zde můžete nastavit i konverze, ale o tom až dále.

3. Nastavení MyX Heatmapy

Pokud můžete a chcete nastavit heatmapu od MyX.cz, je to zase hodně jednoduché:

4. Nastavení Etarget.cz

Pokud využíváte systém Etarget.cz a jeho remarketing, zde je zase jednoduché nastavení:

… pak už jen v Etargetu nastavíte např. rozřazení dle kategorií nebo produktů. Bohužel zde nejde dynamický remarketing… takže vše růčo 🙁 Konverze se nastavují přímo v Etargetu.

5. Nastavení proměnné „google_tag_params“

Už začíná přituhovat: Pro další tag budeme potřebovat nastavit proměnnou pro předávání hodnot. Ideální je pro to „google_tag_params“, který už předpřipravil programátor na začátku (tzv. „dataLayers“ – datová vrstva). Jen ho vyzvedneme z kódu do proměnné Google Tag Manageru. Dělá se to stejně jednoduše, jako přidávání značky (tagu): V menu vlevo vyberte „Variables“ a vytvořte novou s tímto nastavením:

..odteď se na tuto proměnnou můžete odkazovat ve značkách {{google_tag_params}}

6. Nastavení Google Adwords – Remarketing

Google Tag Manager má předpřipravený i remarketing pro Google Adwords. Zde využijeme proměnnou {{google_tag_params}}, kterou jsme si připravili v předchozím odstavci:

7. Nastavení proměnné transactionId

Pro měření konverzí v Google Adwords musíme nastavit proměnnou „transactionId“. Zase jako v případě nastavování proměnné „google_tag_params“ jednoduše vytvoříme novou proměnnou s tímto nastavením:

8. Nastavení proměnné transactionTotal

Stejně jako proměnnou transactionId, nastavím i celkovou sumu za transakci: transactionTotal:

9. Nastavení děkovací stránky

Ukážeme si na tomto případu, jak lze omezit velice jednoduše vykonávání skriptu pouze na děkovací stránce (konverze). Nastavíme si tzv. trigger (spouštěč) pro všechny děkovací stránky, které mají v URL adrese: „/checkout/1234/complete“ (číslo se mění, podle objednávky) a využijeme trochu regulárních výrazů. V menu vlevo kliknete na „Triggers“ a přidáte nový:

…pokud ho použijete ve značce (tag), bude to podmínka pro spuštění daného skriptu.

10. Nastavení Google Adwords – Měření konverzí

V Google Adwords samozřejmě můžete měřit konverze a to se vyplatí 🙂 Nastavení je přednastaveno v GTM a využijeme proměnné „transactionId“ a „transactionTotal“ a triggeru (spouštěče): „Děkovací stránka“

… výsledkem je, že se tento script spustí pouze na konverzní (děkovací) stránce a předá do Google Adwords hodnotu proměnných: ID transakce a celkovou sumu. Nikde jinde se nespouští.

11. Nastavení proměnné ProductID

Dynamický remarketing je úžasná věc. Můžete ho využít pro svůj eshop v systémech: Google Adowrds, Facebook Ads a i v Perfect Audience (která inteligentně slučuje Google Adwords a Facebook Ads dohromady). Proto potřebujeme ale předávat informaci o id produktu… tzn. potřebujeme si vytvořit novou proměnnou. Budeme id čerpat zase s předpřipravené datové vrstvy (dataLayers) od programátora a využijeme již připravenou proměnnou „google_tag_params„:

… je to samozřejmě jedna z možností, jak se dostat k id produktu.

12. Nastavení Perfect Audience

Budeme nastavovat v Google Tag Manageru nejen remarketingový pixel pro Perfect Audience, ale i pro dynamický remarketing. GTM nám předpřipravil nastavování, takže to je jednodušší (je zde v rámci jednoho nastavení jak remarketingový pixel, tak konverzní pixel). Využijeme předpřipravených proměnných:

…samozřejmě musíte pro dynamický remarketing nastavit ještě XML feed přímo ve vašem účtu Perfect Audience.

13. Nastavení triggeru: Detail produktu

Pokud chcete spouštět některé scripty pouze na určitých stránkách, můžete si nastavit trigger (spouštěč) zase velice jednoduše. Tentokrát si to ukážeme na detailu produktu. Předpokládáme, že mají tyto stránky v URL něco společného např. „/detail/„:

14. Nastavení proměnné ProductName

Stejně, jako jsme si připravili proměnnou ProductId, si připravíme ProductName s datové vrstvy (dataLayers) od programátora:

15. Nastavení Facebook Ads – Dynamický remarketing

Ukážeme si jednu z možností nastavení dynamického remarketingu ve Facebooku. Všechny proměnné i trigger máme připravený, takže jdeme na to:

… všimněte si, že lze použít proměnné přímo v kódu scriptu za použití {{nazev_promenne}}

Poznámka: Pro měření správnosti kódu a spouštěného scriptu od Facebooku, doporučuji rozšíření Google Chrome: Facebook Pixel Helper. Jednoduše zkontrolujete, které id produktu se posílá do Facebook Ads pro dynamický remarketing na stránce detailu produktu.

16. Nastavení Facebook Ads – Konverze

Co by to bylo za měření, bez konverzí. Nastavíme konverzní pixel od Facebooku a vpíšeme do něj proměnnou {{transactionTotal}} a spustíme tento script pouze na děkovací stránce:

17. Nastavení triggeru: Transakce Google Analytics

Poslední trigger, který v tomto článku nastavuji je pro měření transakcí v Google Analytics. Využíváme událost připravenou programátorem na vašich stránkách:

18. Nastavení konverzí pro Google Analytics

Bylo by dobré měřit konverze i v Google Analytics. Všechno jsme si připravili (včetně triggeru) a nastavení je předpřipravené:

19. Nastavení Google Analytics 4

Stejně jako staré Google Universal (UA), je potřeba nastavit i Google Analytics 4. Je to velice jednoduché. Stačí si najít kód pod Datovými streamy.

Klikněte ve Správci na Datový stream:

a následně klikněte zde:

Pak stačí zkopírovat ID měření:

Vytvořit novou značku v Google Tag Manageru:

a v konfiguraci nastavte pro všechny stránky (Google Analytics: konfigurace GA4):

Poznámka: Další nastavení GA4 najdete ve článku: Google Analytics 4 – Velký průvodce nastavením.

Závěr

Až vše nastavíte a publikujete, tak to zkontrolujte a vyzkoušejte v reálném provozu. Hlavně doporučuji otestovat dynamický remarketing u Facebook Ads, Google Adwords (popř. Perfect Audience). Doufám, že vám tento návod pomohl 🙂

…a co vy? Využíváte Google Tag Manager na vašem eshopu?

30 komentářů u „Google Tag Manager: 19x nejpoužívanější nastavení“

Miroslav Pecka

17.1.2016 v 22:22

Pěkná ukázka, jak lze jedna data pomocí GTM variables použít na více místech – resp. více službách/kódech.
Já navíc ještě používám kategorizaci produktů/stránek z dynamického remarketingu pro GA Content Groupping (Seskupení obsahu) – mj. ukazuji v http://miroslavpecka.cz/blog/5-duvodu-pro-google-tag-manager/.

Jen poznámka k bodu 5 článku:
Myslím, že tam mělo být
Choose type: Javascript Variable
(ještliže je nahoře v článku ukázka s
var google_tag_params)

p.s.: Na heatmapy doporučuji zkusit český MonkeyTracker (zvládá responsive) nebo HotJar
Odpovědět
- Daniel Nytra
  
  18.1.2016 v 15:57
  
  Díky Miroslave za ty nadstavby pro heatmapy 🙂
  
  ..a na článek mrknu taky…
  Odpovědět
Tomáš S.

9.3.2016 v 23:44

Hezký článek.

Ještě bych doplnil Heuréku (odeslání seznamu zboží v konverzním JS) a Zboží.cz :-).
Odpovědět
- Daniel Nytra
  
  29.3.2016 v 22:55
  
  Dobrý den Tomáši, je to tak… díky!
  Odpovědět
Milan

2.6.2016 v 12:27

Môžem sa opýtať, ako najlepšie pracovať s datalayerom na Prestashope? Nemáš niečo oskúšané?

Ďakujem 🙂
Odpovědět
- Daniel Nytra
  
  16.6.2016 v 17:55
  
  To bohužel nemám, ale moduly na to určitě jsou.. někde jsem viděl článek popisující propojení na Google Tag Manager…
  Odpovědět
- David
  
  29.10.2020 v 9:41
  
  Sám mám modul od https://prestashop.valasinec.cz/marketing/84-google-tag-manager-gtm-modul-prestashop-16-17.html
  a jsem s ním spokojený.
  
  Navíc mají dobrou podporu a pomůžou s tím
  Odpovědět
  - Daniel Nytra
    
    26.7.2021 v 20:50
    
    To rád čtu 🙂
    Odpovědět
Jiří Lesňák

16.6.2016 v 13:56

Skvělý přehled. Chybí mi tu už jen nastavení konverzního kódu pro Sklik, našel jsem jen nastavení pro RTG Skliku.
Odpovědět
- Daniel Nytra
  
  16.6.2016 v 17:59
  
  Stačí nastavit stejně jako „16. Nastavení Facebook Ads – Konverze“ jen se do kódu vymění místo částky proměnná {{transactionTotal}}… Najdete ho Jiří i v tom nastavení konverzí Facebooku (16. bod).
  Odpovědět
roman matěna

18.7.2016 v 10:52

Na GTM je nejhorší, že za měsíc je vše jinak. U toho sklik konverzního kódu máte – Once per page?

A děkovací stránku můžete ukázat jak nastavit?

Podle mne mám vše správně, ale kód se nespustí.
Odpovědět
- Daniel Nytra
  
  19.7.2016 v 15:54
  
  Dobrý den Romane,
  jak to myslíte, že je vše jinak? GTM mi běží už několik měsíců naprosto v pořádku u všech projektů… Děkovací stránku nastavíte s jediným cílem: Nastavit další komunikační kanál: Facebook fanouškovství 🙂
  Odpovědět
  - antijouda
    
    6.1.2020 v 21:18
    
    Že se neustále mění aplikace. Chtěl bych nastavit konverze v analytics a bez šance. Konkrétní návod jsem našel pouze zde a ten je už zastaralý.
    Odpovědět
    - Daniel Nytra
      
      18.1.2020 v 12:09
      
      Popravdě nevím, o čem píšete. Tento článek je o GTM a možnosti napojení i na Google Analytics. Doporučuji si zaplatit za pár tisíc nějakého profíka.
      Odpovědět
Zdenek Kadlec

30.8.2016 v 19:18

Dobrý den, děkuji za článek. Chtěl bych se jen krátce optat, co by se vlastně mělo vkládat do proměnné „transactionTotal“, kterou ve spoustě kódů zmiňujete. Měla by tam být celková cena objednávky s DPH, bez DPH nebo dokonce bez DPH i dopravy? Většina inzertních systémů uvádí totiž ve statistikách náklady bez DPH. Takže do „transactionTotal“ by se (asi) měly dávat tržby bez DPH a dopravy?
Odpovědět
- Daniel Nytra
  
  30.8.2016 v 19:29
  
  Dobrý den Zdeňku,
  přesně tak: Tržby bez DPH a bez dopravy a popřípadě balného jsou super 🙂
  Odpovědět
Tomáš Josef

25.3.2018 v 14:05

Dobrý den,
super článek, díky. Nefunguje mi Sklik, mohl byste mi prosím poradit, co mám dosadit do proměnné „v“?
…&color=ffffff&v=“>
Odpovědět
- Daniel Nytra
  
  28.3.2018 v 20:31
  
  Jde o value.. tzn. hodnota transakce.. tzn. číslo bez měny.
  Odpovědět
Martin

30.6.2018 v 21:13

Dobrý den,
rád bych jednu radu. V Heurece při měření konverzí mi neukazuje částku za objednávky, takže vidím jen náklady za prokliky a počet objednávek. Použil jsem kód z heureky – plný a také kód z H1.cz, ale pořád to mám bez částky za objednávky. V datalayeru všchny hodnoty jsou. Nemáte nějakou radu?

Děkuji Martin
Odpovědět
- Daniel Nytra
  
  24.8.2018 v 21:14
  
  Musíte doplnit hodnotu objednávky do tohoto kódu.. to je vše 🙂
  Odpovědět
Dalibor

6.7.2018 v 19:39

stále nevidím doplnění návodu na heuréku…?
Odpovědět
- Daniel Nytra
  
  24.8.2018 v 21:14
  
  Je to na stejné brdo, jako ostatní 🙂
  Odpovědět
Martin

3.9.2019 v 18:11

Potřeboval bych poradit s implementací Ověřeno zákazníky od Heureky pomocí GTM. Našel jsem návor na její kód pro měření konverzí, ale nevím, jak do GTM vložit volání odeslání objednávky … Na https://sluzby.heureka.cz/napoveda/overeno-jak-aktivovat/ dávají odkaz na PHP script, který to zařídí, ale když nemám u poskytovatele eshop řešení přístup do PHP, ale jen do GTM a poskytovatel tvrdí, že to jde …

Můžete prosím poradit, jak na to?

Díky 🙂
Odpovědět
- Daniel Nytra
  
  6.9.2019 v 22:26
  
  Dobrý den, Martine,
  ano, jde to. Napište mi prosím email a dohodneme se. Daniel
  Odpovědět
Radek

11.10.2019 v 11:45

Zdravím,

fajn článek.

v GTM jsem nastavil vše. Analytics měří uživatele a konverze, ale ne a ne započítat tržbu. V čem je asi tak problém?
Odpovědět
- Daniel Nytra
  
  16.10.2019 v 9:05
  
  Je potřeba mít i správně nastavený Google Analytics. Je vše ok tam? Ještě bych zkontroloval, jestli se konverze opravdu do GA zasílá.
  Odpovědět
Renáta

31.10.2019 v 16:13

Dobrý den,

děkuji moc za super návody!!! Jen mi chybí jeden odkaz. V sekci „Co nastavuje programátor v kódu stránky:
klasické předávání transakcí Google Analytics – návod ZDE“ – odkaz však nefunguje 🙁 A mně by se tolik hodil. Mohu poprosit o tento odkaz?

Děkuji!
Odpovědět
- Daniel Nytra
  
  4.11.2019 v 20:29
  
  Opraveno na jiný zdroj 🙂 https://www.analyticsmania.com/post/ecommerce-tracking-with-google-tag-manager/
  Odpovědět
Jakub K.

28.4.2020 v 15:50

Zdravím,

poradíte s měřením objednávek do Zbozi.cz? Dohledal jsem jen kód na základní měření anebo PHP, které ale v GTM použít nelze.

Díky!
Odpovědět
- Daniel Nytra
  
  1.5.2020 v 15:45
  
  Dobrý den, Jakube,
  stačí transakční měření podmínit zobrazením děkovací stránky v GTM. Daniel
  Odpovědět