Implementace vlastního konverzního kódu nákupu

Systém inPage podporuje již několik marketingových řešení, které ke svému fungování potřebují konverzní kód umístěný v děkovací stránce, která se zákazníkovi zobrazí po odeslání objednávky z e-shopu.Jedná se např. o služby  (Seznam Sklik, Facebook Pixel, Heureka, aj.). Tyto systémy (integrované z naší strány do inPage) jsou plně automatizované a veškerý potřebný kód generují za vás - vy nic řešit nemusíte.

Následující postup je určen pouze zkušeným uživatelům, kteří rozumí a umí psát javascriptový kód! Chybný kód může způsobit, že případné jiné konverzní kódy NEBUDOU správně fungovat!

Objekt window.inpage_eshop_order

Pokud potřebujete integrovat konverzní kód od systému, který inPage nepodporuje (např. FAVI, Biano Pixel, aj.), je to také v inPage možné. Základním prvkem, který k tomu slouží, je nově generovaný javascriptový objekt inpage_eshop_order globální javascriptové proměnné window, který se generuje do každé stránky detailu objednávky uživatele (viz. příklad vypsaný v Google Chrome Console):

V tomto objektu je vše, co je potřeba pro integraci různých konverzních kódu:

• id - interní číslo objednávky
• number - číslo objednávky definované majitelem e-shopu (variabilní symbol)
• amount - cena objednávky (s DPH) bez poplatků za platbu a dopravu
• currency - měna objednávky
• customer - informace o nakupujícím:
  • email - e-mail nakupujícího
  • name - jméno nakupujícího
• items[] - seznam položek objednávky bez dopravy a platby:
  • id - jedinečné ID položky (odpovídá záznamům v xml feedu pro Zboží či Heuréka)
  • price - jednotková cena položky s DPH
  • quantity - množství

Pokud by byly nutné k integraci i některé další údaje z objednávky, které v objektu chybí, ozvěte se nám, a my se je pokusíme přidat!

Javascriptový konverzní kód, který jste obdrželi od srovnávače zboží či jiné vámy vybrané služby, která konverze vyžaduje, vložíte do samostatného článku, který pak nastavíte jako stránku s potvrzením objednávky v sekci Nastavení e-shopu → Texty → Potvrzení objednávky. Tímto způsobem zajistíte, že kód se na stránce zobrazí a provede danou akci přesně jednou po dokončení objednávky.

Ukázka implementace konverzního kódu FAVI

Názorně si nyní ukážeme, jak implementovat konverzní kód systému FAVI (internetový vyhledávač nábytku a dekorací). Popis implementace naleznete na webu Napověda FAVI, kde vás bude zajímat způsob Přímé integrace FAVI skriptu na vaši stránku (C2S).

V ukázkovém kódu se zaměříme na řádek, kde se definuje samotná objednávka pro metodu createOrder:

window.faviPartnerEventsTracking('createOrder', {
...
});

Každý systém bude mít své požadavky na názvy klíčů. Je tedy nutné definovat nový objekt objednávky a využít k tomu definice hodnot v objektu window.inpage_eshop_order. Výše uvedený kód bychom tedy nahradili naší vlastní definicí:

var orderItems = [];

for (var i = 0; i < window['inpage_eshop_order']['items'].length; i++) {
   orderItems.push({
      product: {
         id : window['inpage_eshop_order']['items'][i]['id'],
         name : window['inpage_eshop_order']['items'][i]['name']
      }
   });
}

if (orderItems.length > 0) {
   window.faviPartnerEventsTracking('createOrder', {
      orderId: window['inpage_eshop_order']['id'],
      orderItems: orderItems,
      customer: window['inpage_eshop_order']['customer']
   });
}

Kompletní javascriptový kód pak uložíme na konec článku nastaveného jako Potvrzení objednávky (uzavřený do tagu <script></script>)

Pro editaci zdrojového kódu článku je nutné si zobrazit kód přes funkci Tiny editoru Zdrojový kód nebo použít pro takový článek editor CodeMirror. Javascriptový kód NENÍ možné vkládát do editoru klasicky!

Chování režimu souhlasu s cookies

Při práci s konverznímí kódy můžete narazit na požadavek definice režimu s používáním cookies souborů, často jako např. předání konfigurace,

const config = {
   consent: true
};

kde v proměnné config.conset předáváte příznak pro povolení ukládání cookies, který vám uživatel odsouhlasil (nebo neodsouhlasil) při vstupu na vaše webové stránky (v tomto případě by se jednalo o marketingové cookies).

Pro systém inPage by výše uvedený kód vypadal takto (použití proměnné marketing objektu ca v globalní proměnné window):

const config = {
   consent: window.ca && window.ca.marketing
};

Více o nastavení souhlasu s používáním cookies v inPage se dočtete v tomto článku.

Závěrem

Věříme, že tyto nově přidané funkcionality vám pomohou v dalším rozvoji vašeho e-shopu a díky nim dosáhnete ještě lepších výsledků. Kdybyste měli jakékoli dotazy či připomínky k nastavení vlastního konverzního kódu, tak nám napište na e-mail, či níže do komentářů.