Google Tag Manager a ExitShop – návod

Google Tag Manager (GTM) slouží k externí správě měřících kódů na webu. V ExitShopu máme jednoduchý a řekl bych i celkem unikání systém vkládání skriptů včetně zástupných znaků (cena objednávky, číslo objednávky atd), ale pokud chcete být profi, čtěte dál 🙂

K aktivaci GTM v ExitShopu stačí tuto novou funkci zapnout v nastavení a vyplnit ID kontejneru, něco jako ID webu, na kterém chcete skripty spravovat – to získáte z rozhraní GTM.

Na dvou následujících příkladech si ukážeme konkrétní použití GTM v ExitShopu.

Příklad 1: Google Analytics měření

Nejprve si vytvoříme proměnnou (typu konstanta) a jako její hodnotu zvolíme ID z Google Analytics, nějak takto:

Dále budeme potřebovat značku (měřící kód) – GTM je od Googlu, takže zvolíme jednoduše Universal Analytics a jako ID měření zvolíme proměnnou z kroku výše – dáme ji tam pomocí složených závorek:

Máme proměnnou, značku a ještě nám chybí poslední věc – pravidlo, kdy se má tento kód spouštět. Chceme měřit každou stránku, zvolíme All pages:

Publikujeme změny a hotovo 🙂 Můžeme ihned vyzkoušet.

Příklad 2: Měření Heureka konverzí

V případě konverzí budeme chtít měřit i hodnotu objednávky a další údaje. Bude to trošku složitější, ale tímto způsobem jsme schopni implementovat plnou verzi měření konverzí – to pomocí klasických ExitShop skriptů nedokážeme. Začneme opět vytvořením proměnné (typu konstanta) – Heureka ID:

Další proměnné budou typu Proměnná datové vrstvy – o datové vrstvě si povíme něco za chvíli. Zachovejte přesně název i hodnotu, stejně jako výše.

Nyní si musíme vytvořit pravidlo (něco jako událost nebo spouštěč) – to bude dejme tomu návštěva konverzní stránky. ExitShop má v sobě podporu dataLayeru konverzní stránky – je to vlastně javascriptová proměnná, která nám na konverzní stránce zprostředkuje hodnotu objednávky, objednané produkty atd viz předchozí krok. Tady si dejte opět pozor, hodnotu musíte nastavit přesně na trackTrans.

Dále přidáme značku. Tady už Google nepomůže, musíme vložit kód zkopírovaný z Heureky, takže zvolíme typ Vlastní HTML. Následující kód si můžete zkopírovat – využívá přesně ty proměnné, které jsme si definovali výše.

<script type="text/javascript">
var _hrq = _hrq || [];
_hrq.push(['setKey', '{{Heureka ID}}']);
_hrq.push(['setOrderId', '{{transactionId}}']);

var _hrqp = {{transactionProducts}} || [];
for(var i = 0; i < _hrqp.length; i++) {
_hrq.push(['addProduct', _hrqp[i].name, _hrqp[i].price, _hrqp[i].quantity]);
}

_hrq.push(['trackOrder']);

(function() {
var ho = document.createElement('script'); ho.type = 'text/javascript'; ho.async = true;
ho.src = 'https://im9.cz/js/ext/1-roi-async.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ho, s);
})();
</script>

A kdy tuto značku spustíme? Podle pravidla, které jsme si vytvořili.

Změny publikujeme a máme hotovo 🙂 Můžeme vyzkoušet.

Další informace a návody ohledně GTM můžete nalézt v příručce od H1 nebo v návodu od Daniela Nytry.