Implementujte Biano Pixel pomocí Mergado Packu a Google Tag Manageru

Toto je obyčejná konstanta, jejíž hodnota bude naše Merchant ID.

Tuto proměnnou musíme definovat jako Proměnnou Datové Vrstvy (Data Layer Variable). Pomůže nám k tomu právě zmiňovaný dataslayer. Na produktové stránce otevřeme vývojářské nástroje (pravým kliknutím myši a zvolíme Prozkoumat nebo stisknutím funkční klávesy f12).

Vidíme, že ID produktu je ve struktuře na “5. úrovni” — tedy ecommerce.detail.products.0.id. Hodnotu hledáme u eventu viewItem.

Vytvoříme novou proměnnou a nazveme ji například Product ID. Jako typ zvolíme Data Layer Variable, název proměnné ecommerce.detail.products.0.id a verze datové vrstvy 2.

U ostatních proměnných datové vrstvy postupujeme stejně.

• Product ID - AddToCart — název proměnné ecommerce.add.products.0.id 
• Quantity - název ecommerce.add.products.0.quantity 
• Unit price — název ecommerce.add.products.0.price 
• Currency — název ecommerce.currencyCode
• Order ID — název ecommerce.purchase.actionField.id
• Total Order Price - název ecommerce.purchase.actionField.revenue
• ecommerce.purchase.products — tuto proměnnou budeme potřebovat pro “vytáhnutí” pole zakoupených produktů z datové vrstvy, název ecommerce.purchase.products

Tato proměnná transformuje pole zakoupených produktů do formátu pro Biano.

Vytvoříme proměnnou s typem Custom JavaScript. Jako obsah vložíme script připravený od Biana, jen ho trochu upravíme pro potřeby naší datové vrstvy. Jako proměnnou items zvolíme proměnnou z předchozího kroku ecommerce.purchase.products. U parametru id zapíšeme namísto .productCode > .id. Ostatní parametry zůstávají stejné.

Upravený script si můžete stáhnout níže. 

function () {

// získání dat z proměnné datové vrstvy
  var items = {{ecommerce.purchase.products}};

// transformace a návrat hodnot ve formátu Biano Pixel
  return items.map(function (item) {
    return {
      id: item.id.toString(),
      quantity: parseFloat(item.quantity),
      unit_price: parseFloat(item.price),
    };
  });
}

Nyní máme všechny potřebné proměnné pro implementaci pixelu definované. 

Vytvoříme spouštěč s názvem například event_​ItemView, typ nastavíme Custom Event a název události viewItem (pozor na názvy událostí i velká a malá písmena). Opět nám v tom pomůže dataslayer.

U ostatních spouštěčů postupujeme obdobně.

• event_​AddToCart - název addToCart.
• event_​Purchase — název purchase.

Všechny potřebné spouštěče máme nadefinované a nyní můžeme vytvořit samotné značky.

První značku nazveme například Biano — page view, jako typ zvolíme Biano Pixel, do pole Merchant ID zapíšeme námi dříve vytvořenou proměnnou {{Biano MERCHANT ID}}, typ události Page View a jako spouštěč All pages.

Další značka bude posílat událost Product View. Vše nastavíme jako předtím a do pole Product ID vložíme naši proměnnou {{Product ID}}. Jako spouštěč zvolíme event_​ItemView.

Další značkou bude Biano — Add To Cart. Typ značky i Merchant ID nastavíme jako předtím. Typ události zvolíme Add to Cart, do pole Product ID zadáme proměnnou {{Product ID — AddToCart}}, do pole Quantity proměnnou {{Quantity}}, do pole Unit Price proměnnou {{Unit price}} a do Currency {{Currency}}. Spouštěč zvolíme event_​AddToCart.

Poslední značkou bude Biano — purchase odesílající informace o nákupech zákazníků. Typ značky i Merchant ID nastavíme jako předtím. Typ události nastavíme na Purchase. Do ostatních polí vepíšeme předem připravené proměnné {{Order ID}}, {{Total Order Price}}, {{Currency}} a {{Biano — Purchased Products Array}}. Jako spouštěč zvolíme event_​Purchase.