Moduly pro Magento 2 Google Tag Manager Uživatelský manuál

Obsah stránky

Google Tag Manager

Uživatelský manuál

Zde se dozvíte, jak pracovat s nainstalovaným rozšířením Google Tag Manager pro Magento 2 od GetReady.

Popis

Modul Google Tag Manager pro Magento 2 od GetReady umožňuje vložit do Magento 2 e‑shopu kontejner služby Google Tag Manager.

Co je Google Tag Manager

Častým požadavkem na úpravu e-shopu je instalace různých skriptů:
Jde o sledovací (trackovací), konverzní, retargetingové kódy, nutné pro součinnost služeb třetích stran, ať už jde o poskytovatele reklamy, statistik návštěvnosti, a podobné, například poskytovatele affiliate programů. Konkrétními příklady jsou třeba kódy pro Google Analytics, Google Ads, Facebook pixel atd.

Služba Google Tag Manager (dále jen GTM) nabízí alternativní řešení, výhodné zejména pro marketéry, kteří nechtějí nebo nemohou editovat kód webu ad hoc.

Stačí, když je na všech stránkách webu přítomen základní kód GTM, a všechny ostatní skripty třetích stran je pak možné spravovat pomocí webového rozhraní služby GTM.

V účtu GTM je možné vytvářet značky ('tags'), pravidla ('triggers') a proměnné ('variables'), testovat je a publikovat.

Poznámka: Pokud chcete používat pokročilejší metody sledování, např. tzv. 'Enhanced Ecommerce', musíte do kódu webu kromě GTM kódu umístit také tzv. datovou vrstvu ('datalayer') s proměnnými, které se mají v GTM využít.

Náš modul 'Google Tag Manager pro Magento 2 od GetReady'

Modul Google Tag Manager pro Magento 2 od GetReady umožňuje vložit do kódu Magento 2 e‑shopu GTM kód v požadovaném tvaru:

kód do značky <head>, <body> a <footer>

Pro začátek je to nutné vyplnit identifikační číslo GTM kontejner v administraci.

Poté bude možné konfigurovat nastavení souhlasu. Uživatel tak bude moci při první návštěvě stránky nakonfigurovat své souhlasy. Tyto informace budou uloženy v Local Storage a použity při další práci se stránkou.

Kromě toho ještě na stránku úspěšného odeslání objednávky ('success page') vkládá do datové vrstvy proměnné:

ConversionValue (celková cena)
TransactionID (číslo objednávky).

A taky je základní možnost posílat data pro každou stránku, konkrétní informace budou konfigurovány samostatně v každém projektu

Tento návod

V tomto návodu si ukážeme, jak modul nastavit a testovat jeho chování.

Číslo kontejneru použité v tomto návodu je vymyšlené. Nahraďte vlastním.

Co je třeba, než začneme

Instalace modulu není předmětem tohoto návodu - předpokládáme, že máte funkční e‑shop na platformě Magento 2 a modul 'Google Tag Manager pro Magento 2 od GetReady' nainstalován a aktivní. Pokud ne, kontaktujte vašeho administrátora.

Dále budeme potřebovat zřízený účet GTM:

na stránce https://tagmanager.google.com/ se přihlaste svým Google účtem,
vytvořte GTM účet (pojmenjte nejlépe názvem firmy)
a uvnitř GTM účtu vytvořte kontejner (pojmenujte nejlépe doménou webu, který chcete sledovat) Tak získáte číslo kontejneru ('Container ID').

Pro nasazení do Magento 2 e‑shopu nejsou v tuto chvíli nutné další kroky v GTM, jako např. nastavování tagů a triggerů, ale pro lepší testování proveďte alespoň tzv. publikování.

Kde nastavit doplněk 'Google Tag Manager'

1) Přihlašte se do administrace.

2) Proklikejte se do místa nastavení modulu:

Dále uvádíme českou i anglickou podobu administrace.
Nastavované ukázkové hodnoty budou pro obě verze stejné.

česky	anglicky
`OBCHODY > Nastavení/Nastavení > PRODEJ > Google API > GoogleTagManager od GetReady`	`STORES > Setings/Configuration > SALES > Google API > GoogleTagManager by GetReady`

3) Aktivujte modul Google Tag Manager.

jazyk	obrázek
česky
anglicky

4) Vložte ID kontejneru

jazyk	obrázek
česky
anglicky

5) Uložte konfiguraci.

jazyk	obrázek
česky
anglicky

6) Smažte cache.

7) Na frontendu se přesvědčte o výsledku.
(viz dále, 'Jak testovat...')

Jak testovat doplněk 'Google Tag Manager'

Je několik způsobů, jak otestovat nasazení GTM kódu:

A) Prohlédněte zdrojový kód stránky.

V hlavičce (někde mezi značkami <head> a </head>) byste měli najít takovýto kód:

<!-- Google Tag Manager [by GetReady] -->
<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-1XXXXX8');</script>
<!-- End Google Tag Manager [by GetReady] -->

V těle stránky (někde mezi značkami <body> a </body>) byste měli najít takovýto kód:

<!-- Google Tag Manager (noscript) [by GetReady] -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-1XXXXX8"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) [by GetReady] -->

Po úspěšném odeslání objednávky byste v kódu měli najít také datovou vrstvu:

    'getready_gtm': {
        'successpage': {
            'ConversionValue': '6340.0000',
            'TransactionID':'000000054'
        }
    },

B) Pomocí doplňku do prohlížeče

Použijte třeba doplněk ObservePoint TagDebugger.

V konzoli (CTRL+SHIFT+I) najděte záložku 'ObservePoint' a zde uvidíte seznam všech rozpoznaných značek. Váš GTM kontejner by měl být mezi nimi.

Další doplněk který vám může pomocí při testování GTM, je třeba WASP.inspector: (Analytics Solution Profiler).

WASP Inspector vám ukáže strom protředků použitých na stránce, včetně GTM kontejneru a datové vrstvy.

C) Pomocí 'LIVE preview' v GTM

Tímto způsobem také zjistíte, že je kontejner přítomen.
Ale 'LIVE preview' plně využijete až poté, co bude váš kontejner publikován a bude obsahovat nějaké tagy.

D) Další specifické testování

Existují i další testování, které jsou ale vázané na konkrétní tagy v kontejneru, např. tagy pro Google Analytics můžete testovat v živém náhledu služby Google analytics.

Kde nastavit doplněk 'Souhlasy'

1) Přihlašte se do administrace.

2) Proklikejte se do místa nastavení modulu (Google Tag Manager musí být aktivován):

Dále uvádíme českou i anglickou podobu administrace.
Nastavované ukázkové hodnoty budou pro obě verze stejné.

česky	anglicky
`OBCHODY > Nastavení/Nastavení > PRODEJ > Google API > GoogleTagManager od GetReady > Souhlasy`	`STORES > Setings/Configuration > SALES > Google API > GoogleTagManager by GetReady > Consents`

Zde jsou následující pole:

Povolit souhlasy (angl: Enable Consents) - pokud zvolíte "ano" - údaje o Souhlasu budou zaslány s každou staženou stránkou a na vyžádání aktualizovány (výchozí hodnota je "ano")
Povoleno tlačítko odmítnout (angl: Enabled Reject Button) - pokud zvolíte "ano" - do okna nastavení se přidá tlačítko, po stisku ktereho budou všechny Souhlasy označeny jako "denied" (výchozí hodnota je "ano")
Popis (angl: Description) - obsahuje informace, které se zobrazí v hlavním okně pro informování uživatelů
Přizpůsobit popis (angl: Customize Description) - obsahuje informace, které se zobrazí v okně přizpůsobení, aby informovaly uživatele, pokud uživatel klikne na tlačítko "Vlastní nastavení" (angl: Custom settings)
Povolit URL Passthroughn (angl: Enabled URL Passthroughn) - pokud se přepne na URL passthrough, zkontroluje adresu URL aktuální stránky pro reklamní parametry (gclid, dclid, gclsrc, _gl) a přidá je ke všem adresám URL interních odkazů, na které může uživatel klikat.
Položky souhlas (angl: Consent Items) - obsahuje všechny souhlasy (ad_storage, analytics_storage, personalization_storage, ad_personalization, ad_user_data, functionality_storage, security_storage) a jejich nastavení:
- Povolit (angl: Enable) - pokud je vybráno "ano" - tento souhlas se zobrazí uživateli k nastavení, pokud "ne" - nezobrazuje se a použije se "denied"
- Štítek (angl: Label) - jméno, které uživatel uvidí na frontendu
- Nutné (angl: Necessary) - pokud je zvoleno "ano" - tento souhlas bude vždy vybrán a bude k dispozici pro editaci
- Krátký popis (angl: Short Description) - informace se zobrazí pod jménem
- Dlouhý popis (angl: Long Description) - informace, které jsou ve výchozím nastavení skryté, ale lze je zobrazit po stisknutí tlačítka "Více informací" (angl: "More Information")

česky	anglicky

Jak testovat doplněk 'Souhlasy' v 'Google Tag Manager'

Je několik způsobů, jak otestovat nasazení GTM kódu:

A) pomocí "Tag Manager".

Otevřete Správce značek
V konzoli Správce značek klikněte na tlačítko Náhled
Nastavte URL svého webu
Zajistěte, aby se vaše značky Google Analytics, Ad Words, Floodlight nebo Conversion Linker spouštěly (spouštěly) na události
Zaškrtněte událost Souhlas (výchozí).
Přejděte na kartu Souhlas a zkontrolujte, zda výchozí stavy na stránce odpovídají vašemu nastavení

B) pomocí "Source code".

"Inspect" stránku a přejděte na kartu "Console"
Napište "dataLayer" a stiskněte "Enter"
Prohlédněte si události a najděte tu s výchozím stavem souhlasu

Na frontendu

Když uživatel navštíví stránku poprvé po aktivaci modulu, zobrazí se mu popup s nabídkou konfigurace nastavených oprávnění

Zde se zobrazují informace uvedené v administraci v poli "Popis" (angl: Description) a jsou k dispozici následující akce:

Je možné stisknout tlačítko "Přijímám vše" (angl: Accept all) - všechna souhlasy obdrží hodnotu "granted" a toto vyskakovací okno se zavře
Je možné stisknout tlačítko "Vlastní nastavení" (angl: Custom settings) - otevře se nové vyskakovací okno, ve kterém se zobrazí všechny souhlasy, které mají konfiguraci "Povolit" - "Ano", informace uvedené v administraci v poli "Přizpůsobit popis" (angl: Customize Description) a taky tlačítko "Uložit". Pokud bylo v administraci vyplněno pole "Dlouhý popis" (angl: Long Description) pro souhlas pod nim se po stisknutí zobrazí tlačítko "Více informací" (angl: More Information), zobrazí se blok se zadanou hodnotou a tlačítko "Více informací" (angl: More Information) změní svůj název na "Méně informací" (angl: Less Information). Když stisknete Méně informací" (angl: Less Information), blok se skryje Když kliknete na tlačítko "Uložit" (angl: Save), souhlasy se nastaví v závislosti na zvoleném nastavení a všechna vyskakovací okna se zavřou
Je možné stisknout tlačítko "Odmítnout" (angl: Reject) - všechna souhlasy obdrží hodnotu "denided" a toto vyskakovací okno se zavře
Je možné stisknout tlačítko "x" (pouze v případě, že byl dříve nakonfigurován) - toto vyskakovací okno se zavře a souhlasy nebudou aktualizovány

Pokud potřebujete změnit nastavení souhlasy, můžete přejít do Můj účet > Údaje účtu > Souhlasy - pro přihlášené uživatele a kliknout na tlačítko "Změňit nastavení souhlasu" (angl: Change consent settings) - znovu se zobrazí okno nastavení souhlasy. Pro nepřihlášené uživatele musí být nakonfigurován block. Pokud otevřete "Vlastní nastavení" (angl: Custom settings) dříve zaškrtnuti souhlasy bude zaškrtnuto
Každá změna zvolená uživatelem se uloží do aktuální session, databáze a local storage bez ohledu na to, zda je osoba přihlášena, nebo ne.
- Pokud uživatel již dříve provedl volbu jako přihlášený uživatel a znovu se přihlásí z jakéhokoli zařízení, budou souhlasy převzaty z databáze (předchozí volba uživatele).
- Pokud uživatel již dříve provedl volbu jako přihlášený uživatel a odhlásil se, budou souhlasy převzaty z local storage (předchozí volba uživatele).
- Pokud uživatel již dříve provedl volbu jako nepřihlášený uživatel a znovu používá stejné zařízení, budou souhlasy převzaty z local storage (předchozí volba uživatele).
- Pokud se uživatel již dříve rozhodl jako nepřihlášený uživatel a používá nové zařízení, bude o souhlas požádán znovu.