Návod na implementáciu GLAMI piXelu

Udalosť

Názov udalosti	Popis udalosti	Parametre	Vyžadované parametre
PageView	Východzia udalosť, ktorá môže byť umiestnená na všetky stránky.
ViewContent	Pri zobrazení stránky, napríklad stránky produktu alebo kategórie.	content_type, item_ids, value, currency	`content_type`, `item_ids`
AddToCart	Pri vložení produktu do košíka.	value, currency, item_ids	`value`, `currency`, `item_ids`
Purchase	Pri uskutočnení nákupu.	value, currency, transaction_id, item_ids	`value`, `currency`, `transaction_id`, `item_ids`

Parametre

Názov parametru	Popis parametru	Typ parametru
consent	Súhlas používateľa s ukladaním analytických cookies v jeho zariadení. Nastavte `1` v prípade získania súhlasu užívateľa. V opačnom prípade nastavte `0`.	`number`
content_type	Buď 'product' alebo 'category'.	`string`
item_ids	Identifikátor produktu v asociovanej `ViewContent`, `AddToCart` or `Purchase` udalosti. Musí byť v rámci vášho obchodu jedinečný a nemenný. Je možné použiť akúkoľvek kombináciu písmen a číslic. Uveďte rovnaké ID, ktoré používate vo feede pre ITEM_ID. If you do not have the ITEM_ID for a specific product variant at the time of calling the event (for example, when the customer has not yet selected a specific size for the product), you can send the value of ITEMGROUP_ID to the item_ids parameter. This value must correspond with the value you send in the product feed.	`array`
value	Business hodnota užívateľa vykonávajúceho túto udalosť	`number`
currency	Mena pre špecifikované `value`..	`string`
transaction_id	ID transakcie.	`string`

Content IDs

V každej udalosti môžete použiť ktorýkoľvek z týchto identifikátorov item_ids, category_text pre identifikáciu obsahu spojeného s udalosťou. Použite najvhodnejšie riešenie pre váš obchod. Prosím, použite tie isté IDs , ako používate vo vašom product feed.

ITEM_ID

Toto je unikátny kód produktu -ID ktoré používate vo vašom e-shope.

GLAMI používa ITEM_ID na rozlíšenie produktov a na zabezpečenie správneho sledovania.

—Hodnota sa môže skladať z kombinácie písmen, číslic, lomítok (/), spätných lomítok (\), pomlčiek (-), podtržníkov (_), medzier (), bodiek (.) a dvojbodiek (:).
—Varianty produktu, rôzne veľkosti a farby musia mať jedinečné ITEM_ID.
—Zadajte rovnakú hodnotu pre piXel GLAMI - parameter ITEM_ID. Inak nebude GLAMI piXel fungovať správne.
—If you do not have the ITEM_ID for a specific product variant at the time of calling the event (for example, when the customer has not yet selected a specific size for the product), you can send the value of ITEMGROUP_ID to the item_ids parameter. This value must correspond with the value you send in the product feed.

Consent

Parameter consent umožňuje zapojeným obchodom upraviť správanie GLAMI PiXelu vzhľadom na súhlas užívateľov s používaním súborov cookies. Pokiaľ súhlas existuje (hodnota 1) alebo parameter consent nie je nastavený, GLAMI spracováva dáta v plnom rozsahu. V prípade, že súhlas neexistuje (hodnota 0) budú údaje spracovávané anonymne, bez použitia údajov o konkrétnom užívateľovi.

GLAMI PiXel je kľúčový pre optimálne fungovanie vášho e-shopu na GLAMI. Preto teraz podporuje parameter Consent, ktorým partnerský e-shop odovzdáva GLAMI informáciu, či používateľ vyjadril súhlas s vytváraním analytických cookies.

Príklady Glami piXel kódu

Pre nasledujúce príklady potrebujete API kľúč, ktorý získate po registrácii obchodu.
Aby ste tak urobili, použite našu straánku pre registráciu obchodu.

Stránka produktu -> ViewContent (type=product)
Stránka kategórie -> ViewContent (type=category)
Pridať do košíku udalosť -> AddToCart
Stránka s potvrdením objednávky -> Purchase
Každá ďalšia strana -> PageView

Pridajte kód na vaše webové stránky pred koncom </head> tagu v HTML stránky:

PageView

Umiestnite tento hlavný kód na každú stránku. Tento kód sa dá rozšíriť o ďalšiu udalosť podľa typu stránky. Tak ako vidíte dole.

<!-- Glami piXel for ONLY_SAMPLE_SHOP_FOR_EXAMPLE -->
<script>
(function(f, a, s, h, i, o, n) {f['GlamiTrackerObject'] = i;
f[i]=f[i]||function(){(f[i].q=f[i].q||[]).push(arguments)};o=a.createElement(s),
n=a.getElementsByTagName(s)[0];o.async=1;o.src=h;n.parentNode.insertBefore(o,n)
})(window, document, 'script', '//glamipixel.com/js/compiled/pt.js', 'glami');

glami(
    'create',
    'INSERT_YOUR_API_KEY_HERE',
    'sk',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);
glami(
    'track',
    'PageView',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);
</script>
<!-- End Glami piXel -->

ViewContent (product)

Pridajte tento kód rozšírenia na každú stránku s podrobnosťami o produkte.

glami(
    'track',
    'ViewContent',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        content_type: 'product',
        item_ids: ['ADZXFLUX002'] // currently viewed product ID. Use the same ID as you use in the feed (ITEM_ID)
    }
);

Príklad stránky s podrobnosťami o produkte.

Tento príklad zobrazuje, ako by mal vyzerať úplný kód na všetkých stránkach s podrobnosťami o produkte.

<!-- Glami piXel for ONLY_SAMPLE_SHOP_FOR_EXAMPLE -->
<script>
(function(f, a, s, h, i, o, n) {f['GlamiTrackerObject'] = i;
f[i]=f[i]||function(){(f[i].q=f[i].q||[]).push(arguments)};o=a.createElement(s),
n=a.getElementsByTagName(s)[0];o.async=1;o.src=h;n.parentNode.insertBefore(o,n)
})(window, document, 'script', '//glamipixel.com/js/compiled/pt.js', 'glami');

glami(
    'create',
    'INSERT_YOUR_API_KEY_HERE',
    'sk',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);
glami(
    'track',
    'PageView',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);

glami(
    'track',
    'ViewContent',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        content_type: 'product',
        item_ids: ['ADZXFLUX002'] // currently viewed product ID. Use the same ID as you use in the feed (ITEM_ID)
    }
);
</script>
<!-- End Glami piXel -->

ViewContent (category)

Pridajte tento rozšírený kód na každú stránku so zoznamom kategórií.

glami(
    'track',
    'ViewContent',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        content_type: 'category',
        item_ids: ['ADZXFLUX001', 'NRS02', 'NRS03', 'NRS04', 'NRS05', 'NRS06', 'NRS07', 'NRS08', 'NRS09', 'NRS10'], // currently viewed first 10 product IDs in the category. Use the same IDs as you use in the feed (ITEM_ID).
        category_text: 'Men | Shoes | Sneakers' // currently viewed category_text. Use the same category_text as you use in the feed (CATEGORYTEXT)
    }
);

Príklad pre stránku kategórie.

Tento príklad ukazuje, ako by mal vyzerať úplný kód na všetkých stránkach so zoznamom kategórií.

<!-- Glami piXel for ONLY_SAMPLE_SHOP_FOR_EXAMPLE -->
<script>
(function(f, a, s, h, i, o, n) {f['GlamiTrackerObject'] = i;
f[i]=f[i]||function(){(f[i].q=f[i].q||[]).push(arguments)};o=a.createElement(s),
n=a.getElementsByTagName(s)[0];o.async=1;o.src=h;n.parentNode.insertBefore(o,n)
})(window, document, 'script', '//glamipixel.com/js/compiled/pt.js', 'glami');

glami(
    'create',
    'INSERT_YOUR_API_KEY_HERE',
    'sk',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);
glami(
    'track',
    'PageView',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);

glami(
    'track',
    'ViewContent',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        content_type: 'category',
        item_ids: ['ADZXFLUX001', 'NRS02', 'NRS03', 'NRS04', 'NRS05', 'NRS06', 'NRS07', 'NRS08', 'NRS09', 'NRS10'], // currently viewed first 10 product IDs in the category. Use the same IDs as you use in the feed (ITEM_ID).
        category_text: 'Men | Shoes | Sneakers' // currently viewed category_text. Use the same category_text as you use in the feed (CATEGORYTEXT)
    }
);
</script>
<!-- End Glami piXel -->

AddToCart

Tento kód volajte pri udalosti kedy dochádza k vloženiu položky do košíku.

glami(
    'track',
    'AddToCart',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        item_ids: ['ADZXFLUX002'], // product ID currently added to a cart. Use the same ID as you use in the feed (ITEM_ID).
        value: 82.00, // product price
        currency: 'EUR' // product price currency
    }
);

Purchase

Umiestnite toto rozšírenie na stránku potvrdzujúcu odoslanie objednávky.

glami(
    'track',
    'Purchase',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        item_ids: ['ADZXFLUX002', 'NRS01'], // bought product IDs. Use the same IDs as you use in the feed (ITEM_ID).
        value: 123.00, // order value (sum of product values)
        currency: 'EUR', // order value currency
        transaction_id: 'ORDER212' // order ID
    }
);

Príklad pre potvrdzujúcu stránku objednávky.

Tento príklad ukazuje, ako vyzerá kompletný kód pre potvrdzujúcu stránku objednávky.

<!-- Glami piXel for ONLY_SAMPLE_SHOP_FOR_EXAMPLE -->
<script>
(function(f, a, s, h, i, o, n) {f['GlamiTrackerObject'] = i;
f[i]=f[i]||function(){(f[i].q=f[i].q||[]).push(arguments)};o=a.createElement(s),
n=a.getElementsByTagName(s)[0];o.async=1;o.src=h;n.parentNode.insertBefore(o,n)
})(window, document, 'script', '//glamipixel.com/js/compiled/pt.js', 'glami');

glami(
    'create',
    'INSERT_YOUR_API_KEY_HERE',
    'sk',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);
glami(
    'track',
    'PageView',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);

glami(
    'track',
    'Purchase',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        item_ids: ['ADZXFLUX002', 'NRS01'], // bought product IDs. Use the same IDs as you use in the feed (ITEM_ID).
        value: 123.00, // order value (sum of product values)
        currency: 'EUR', // order value currency
        transaction_id: 'ORDER212' // order ID
    }
);
</script>
<!-- End Glami piXel -->

Implementácia niekoľkých pixelov na jednej stránke

Ak chcete na jednu stránku umiestniť viac pixelových kódov, postupujte podľa nasledujúcich pokynov.

Ak chcete vložiť viac pixelových kódov na jednu stránku, musí mať každý pixel unikátny názov. Tento názov pridáte počas vytvárania pixelu. Ak máte len jeden pixel kód, nemusíte túto identifikáciu používať.

glami(
    'create',
    'API_KEY',
    'cz',
    'PIXEL_IDENTIFIER',
    {
        consent: 1 // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);

Rovnaké unikátne meno musí byť použité pri všetkých pixel kódoch:

glami(
    'PIXEL_IDENTIFIER.track',
    'PageView',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);

glami(
    'PIXEL_IDENTIFIER.track',
    'Purchase',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        item_ids: ['ADZXFLUX002'],
        value: 123.00, // order value (sum of product values),
        currency: EUR,
        transaction_id: 'ORDER2'
    }
);

Tento príklad ukazuje, ako vyzerá kompletný kód pre potvrdzujúcu stránku objednávky.

<!-- Glami piXel for multiple shops -->
<script>
(function(f, a, s, h, i, o, n) {f['GlamiTrackerObject'] = i;
f[i]=f[i]||function(){(f[i].q=f[i].q||[]).push(arguments)};o=a.createElement(s),
n=a.getElementsByTagName(s)[0];o.async=1;o.src=h;n.parentNode.insertBefore(o,n)
})(window, document, 'script', '//glamipixel.com/js/compiled/pt.js', 'glami');

// <!-- SK tracker start
glami(
    'create',
    'SK_API_KEY',
    'sk',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);
glami(
    'track',
    'PageView',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);

glami(
    'track',
    'Purchase', {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        item_ids: ['ADZXFLUX002', 'NRS01'],
        value: 123.00,
        currency: 'EUR',
        transaction_id: 'ORDER1'
    }
);
// SK tracker end -->

// <!-- SK tracker start
glami(
    'create',
    'SK_API_KEY',
    'sk',
    'sktracker',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);
glami(
    'sktracker.track',
    'PageView',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);

glami(
    'sktracker.track',
    'Purchase',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        item_ids: ['ADZXFLUX002'],
        value: 50.00,
        currency: 'EUR',
        transaction_id: 'ORDER2'
    }
);
// SK tracker end -->

// <!-- some other tracker tracker start
glami(
    'create',
    'SOME_OTHER_API_KEY',
    sk,
    'sometrackername',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);
glami(
    'sometrackername.track',
    'PageView',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
    }
);

glami(
    'sometrackername.track',
    'Purchase',
    {
        consent: 1, // The user's consent to the storage analytical cookies on their devices. [0 = no; 1 = yes]
        item_ids: ['ADZXFLUX002'],
        value: 123.00, // order value (sum of product values),
        currency: EUR,
        transaction_id: 'ORDER2'
    }
);
// some other tracker end -->
</script>
<!-- End Glami piXel -->

Pomocou tejto metódy môžete kedykoľvek zmeniť hodnotu consent parametra pre GLAMI Pixel. V prípade, že používate Cookie consent manager (napr. Cookiebot alebo iný), je nutné po udelení súhlasu tento súhlas odovzdať aj do GLAMI Pixel. GLAMI Pixel je často načítaný ešte pred samotným udelením súhlasu cez Cookie consent manager. V takomto prípade je nutné uskutočniť nasledujúcu metódu a odozdať novú hodnotu consent parametra.


glami('set', {consent: 1});

Nastavenie HTTP hlavičky pre Content Security Policy (CSP)

Ak váš web používa Content Security Policy, musíte na vašej stránke povoliť spustenie GLAMI Pixel JavaScript kódu. Please add the following CSP rules into your HTTP response header on your web server:

Content-Security-Policy: default-src 'self'; script-src 'unsafe-inline' www.glami.sk glamipixel.com; img-src www.glami.sk glamipixel.com