Az Alap (Base) Barion Pixel implementációja

Előkészületek

A legfontosabb dolog, amire az Alap (Base) Barion Pixel implementációjához szükséged van, az a boltod Barion Pixel ID-ja. Ezt a Pixel ID-t kell az alábbi kódba mindkét pirossal jelölt helyen beillesztened.
A Pixel ID beillesztésekor ügyelj arra, hogy a mintával azonos módon kerüljön be, tehát ne kerüljön bele esetleges extra idézőjel vagy zárójel, az egyetlen különbség a példakódtól a középső tíz és az utolsó két karakter lehet.

FONTOS

A boltod Barion Pixel ID-ját a Barion Tárcában találod. Minden bolthoz (minden egyedi POSKey-hez) külön Barion Pixel ID tartozik. A Barion Pixel ID-t a tárcádba belépve az ’Elfogadóhely kezelése’ menüpontban az elfogadóhely mellett a ’Műveletek’, majd a ’Részletek’ gombra kattintva találod meg.

FONTOS

Minden Barion Pixel ID a következő formátumú; először a "BP" karakterek, majd tíz karakter, majd két szám, amely három csoportot kötőjelek választanak el, ahogy a példában is látszik. A hibás megadás vagy rossz formátum a Pixel hibás működését okozza.
Győződj meg róla, hogy a webshopod Barion Pixel ID-ját az alábbi példakódban található mindkét helyre beillesztetted, amiket a piros kiemelés mutat. A Barion Pixel ID eltér a próba és az éles Barion rendszereken.

Az alapkód implementációja

   
        <script>
            // Create BP element on the window
            window["bp"] = window["bp"] || function () {
                (window["bp"].q = window["bp"].q || []).push(arguments);
            };
            window["bp"].l = 1 * new Date();
    
            // Insert a script tag on the top of the head to load bp.js
            scriptElement = document.createElement("script");
            firstScript = document.getElementsByTagName("script")[0];
            scriptElement.async = true;
            scriptElement.src = 'https://pixel.barion.com/bp.js';
            firstScript.parentNode.insertBefore(scriptElement, firstScript);
            window['barion_pixel_id'] = 'BP-0000000000-00';            

            // Send init event
            bp('init', 'addBarionPixelId', window['barion_pixel_id']);
        </script>

        <noscript>
            <img height="1" width="1" style="display:none" alt="Barion Pixel" src="https://pixel.barion.com/a.gif?ba_pixel_id='BP-0000000000-00'&ev=contentView&noscript=1">
        </noscript>

Implementáció közvetlenül HTML-be

Ha közvetlen hozzáférésed van a weboldalad kódjához, azaz a megjelenített oldalak HTML kódját közvetlenül tudod szerkeszteni, illeszd az Alap (Base) Barion Pixel kódot a weboldalad '<head>' tagjébe. Ez az oldal tetején a doctype deklarációk alatt található, és az oldal metaadatait tartalmazza, mint például az oldal címe.

Minél magasabban van a kód az oldalon annál jobb, mert maga a kód minimális idő alatt lefut, mivel a Barion Pixel funkcióinak nagy része külső forrásból van betöltve aszinkron módon, tehát nem fogja akadályozni vagy lassítani az oldal működését. Emellett elengedhetetlen, hogy egyszerűen az oldalba legyen helyezve a kód, hogy az oldallal együtt töltődhessen be. Hozzájáruláskezelési szoftver alkalmazása esetén fontos, hogy ezzel a kóddal ne foglalkozzon, mivel működése a csalásmegelőzési célokhoz is szükséges.

Statikus HTML oldalak

Ha az oldalad egyetlen HTML oldalként valósul meg, esetleg külső JS vagy CSS fájlokkal kiegészítve, amit szerver oldalon nem módosítasz, vagy ilyen oldalak halmazaként létezik, egyszerűen illeszd a kódot minden kiszolgált oldal fejlécébe. Ha saját készítésű oldalad van, ami nem használ szerver oldali nyelveket vagy keretrendszereket, mint a PHP, Ruby vagy az AngularJS, valószínűleg ebbe a katágóriába tartozik.

Dinamikusan generált HTML oldalak

Ha az oldaladat valamilyen szerver oldali szofverrel generálod (pl. PHP, ERB, CSHTML or Jinja), vagy valamely szerveroldali nyelvvel előfeldolgozod a HTML oldalaidat, figyelj arra, hogy minden oldal fejlécébe kerüljön bele az alapkód. Erre a bevett gyakorlat egy perzisztens layout dokumentum alkalmazása, ami a minden oldalon megjelenő elemeket tartalmazza (pl. az oldalsávot vagy CSS és JS könyvtárakat), amibe a mi kódunkat is be tudod illeszteni. Ha akarod, egy betölthető aloldalt is csinálhatsz, ami szerveroldalon belekerül a layoutba, ami tartalmazza a mi kódunkat. Az egyetlen fontos dolog, hogy az összes a webshopod részeként kiszolgált HTML oldalban legyen benne a mi kódunk.

Külső szolgáltatáson keresztüli implementáció

Az Alap (Base) Barion Pixel implementációja támogatva van az UNAS webáruházakban (lásd a dokumentációt) és a Shoprenter webáruházakban (lásd a dokumentációt).

Ezen kívül támogatjuk a Google Tag Manager-en keresztüli implementációt (lásd a dokumentációt).