Vodič za implementaciju Glami piXel

Događaji

Ime događaja	Opis događaja	Parametri	Potrebni parametri
PageView	Zadani događaj, koji se može postaviti na sve stranice.
ViewContent	Kada je stranica prikazana kao stranica proizvoda ili stranica kategorije.	content_type, item_ids, value, currency	`content_type`, `item_ids`
AddToCart	Kada je proizvod dodan u košaricu.	value, currency, item_ids	`value`, `currency`, `item_ids`
Purchase	Kada je kupnja gotova.	value, currency, transaction_id, item_ids	`value`, `currency`, `transaction_id`, `item_ids`

Parametri

Ime parametra	Opis parametra	Vrsta parametra
consent	Korisnikovo prihvaćanje spremanja analitičkih cookies-a na uređaju. Stavite `1` u slučaju da je prihvatio. Ukoliko nije, stavite `0` za "ne".	`number`
content_type	Ili 'product' ili 'category'.	`string`
item_ids	Identifikator elementa, povezan s događajem `ViewContent`, `AddToCart` or `Purchase`. Koristite vrijednosti, koje su jedinstvene i nepromjenjive na cijeloj vašoj online trgovini. Identifikator se sastoji od bilo koje kombinacije brojeva/skupova. Upotrijebite isti ID, kao što ste ga unijeli u feedu proizvoda za 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	Vrijednost proizvoda ili narudžbe pri biranju događaja	`number`
currency	Valuta za određenu `value`..	`string`
transaction_id	ID transakcije.	`string`

ID-ji sadržaja

U svakom događaju možete koristiti bilo koji od ovih item_ids, category_text identifikatora, kako biste identificirali sadržaj povezan s događajem. Koristite najprikladnije za svoje prodajno rješenje. Molimo, upotrijebite iste ID-e, koji upotrebljavate u svome product feed.

ITEM_ID

Ovo je jedinstveni broj proizvoda- ID koji koristite u vašoj e-trgovini.

GLAMI koristi ITEM_ID da bi se razlikovali proizvodi i da bi se osiguralo ispravno praćenje.

—Vrijednost može sadržati različitu kombinaciju slova, kosih crta, crtica, donjih crta, razmaka, točki i dvotočki.
—Varijacija proizvoda, različite veličine i boje trebaju imati jedinstvene ITEM_ID’s.
—Unesite istu vrijednost za GLAMI piXel- parametar ITEM_ID. U suprotnom GLAMI piXel neće raditi ispravno.
—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

Parametar consent omogućuje web stranicama prilagoditi ponašanje GLAMI Pixela bazirajući se na prihvaćanje cookiesa od strane korisnika. Ukoliko ih je korisnik prihvatio (vrijednost 1) ili parametar nije namješten, GLAMI procesuira podatke u potpunosti. Ukoliko nema pristanka (vrijednost 0) podaci će biti procesuirani anonimno bez korištenja podataka određenog korisnika.

Kako bi vaša trgovina mogla optimalno funkcionirati na GLAMI web-u, GLAMI PiXel je od iznimne važnosti. Od sada koristimo Consent parametar uz pomoć kojeg partnerska e-trgovina prenosi informaciju GLAMI-ju da li je korisnik prihvatio kreiranje analitičkih cookies-a.

Glami piXel primjer koda

Za sljedeće primjere trebate API ključ, koji ćete primiti nakon registracije vaše trgovine.
Da biste to učinili, upotrijebite našu stranicu za registraciju trgovine.

Stranica proizvoda -> ViewContent (type=product)
Stranica kategorije -> ViewContent (type=category)
Dodaj u košaricu (add to cart) događaj -> AddToCart
Stranica za potvrdu narudžbe -> Purchase
Svaka druga stranica -> PageView

Dodajte kod na svoje web stranice prije kraja </head> oznake u HTML stranici:

PageView

Postavite ovaj zadani kod na sve stranice. Taj se kod može produžiti korištenjem drugih događaja. Pogledajte u nastavku.

<!-- 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',
    'hr',
    {
        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)

Dodajte ovaj kod na svaku stranicu detalji o proizvodu.

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)
    }
);

Primjer stranice detalji o proizvodu.

Ovaj primjer pokazuje kako bi trebao izgledati kompletan kod na svim stranicama detalji o proizvodu.

<!-- 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',
    'hr',
    {
        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)

Dodajte ovaj kod na svaku stranicu popisa kategorija.

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)
    }
);

Primjer za stranicu s kategorijama.

Ovaj primjer pokazuje kako bi trebao izgledati kompletan kod na svim stranicama popisa kategorija.

<!-- 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',
    'hr',
    {
        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

Imenuj ovaj kod na događaju, kada se proizvod doda u košaricu za kupnju.

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

Dodajte ovaj kod za proširenje na svaku stranicu za zahvalu/potvrdu.

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
    }
);

Primjer za stranicu zahvale/potvrde.

Ovaj primjer pokazuje, kako se cijeli kod treba pojaviti na stranici za zahvalu/potvrdu.

<!-- 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',
    'hr',
    {
        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 -->

Implementacija nekoliko pixela na jednoj stranici

Ukoliko želite više pixel kodova na stranici, slijedite ove upute.

Kada želite spremiti nekoliko pixel kodova na jednu stranicu, svaki pixel mora imati jedinstveni naziv koji je stvoren sa create call-om. Kada je u pitanju samo jedan pixel kod, ne morate koristiti ovu opciju.

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]
    }
);

U svim pixel kodovima se mora koristiti isti jedinstveni naziv.

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'
    }
);

Ovaj primjer pokazuje, kako se cijeli kod treba pojaviti na stranici za zahvalu/potvrdu.

<!-- 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');

// <!-- HR tracker start
glami(
    'create',
    'HR_API_KEY',
    'hr',
    {
        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'
    }
);
// HR 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',
    hr,
    '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 -->

Ovu metodu možete koristiti za promjenu vrijednosti parametra privole za GLAMI Pixel u bilo kojem trenutku. U slučaju da koristite upravitelj privole za kolačiće (npr. cookiebot ili drugi), potrebno je podnijeti ovu privolu GLAMI Pixelu nakon što je odobrena. GLAMI Pixel često se učitava prije stvarne privole putem Upravitelja privole za kolačiće. U tom slučaju potrebno je pozvati sljedeću metodu i proslijediti novu vrijednost parametru privole.


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

Postavke zaglavlja Politike sigurnosti sadržaja (CSP)

Ako vaš web koristi Content Security Policy, morate omogućiti GLAMI Pixel Javascript kod na svojoj stranici. Dodajte sljedeća CSP pravila u zaglavlje HTTP odgovora na vašem web poslužitelju:

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