Revision as of 16:51, 28 January 2020

Implementing the Base Barion Pixel

Getting Ready

The first prerequisite to implement the Base Barion Pixel irrespective of your webshop is knowing your your Barion Pixel ID. You must paste this Pixel ID into the following code at both locations marked with a red outline. The Pixel ID should be pasted without any extra parentheses, breackets or quotes, just as it is in the provided sample, the only difference being the ten numbers in the middle and the two at the back.

IMPORTANT

All Barion Pixel IDs conform to the format of "BP", ten numbers, then two numbers, connected by two dashes, as is provided in the example. Incorrect entries and other formats, such as IDs beginning with "BPT" will prevent the Barion Pixel from operating correctly.
Be sure to insert your unique Barion Pixel ID at both locations in the provided code example, marked by a red outline. Always double check your Barion Pixel ID. The Barion Pixel ID is different in the sandbox and live Barion systems.

Implementation of the base code

   
        <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);
      
            // Send init event
            bp('init', 'addBarionPixelId', 'BP-0000000000-00');
        </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>

Direct HTML implementation

If you have direct access to the codebase of your website, meaning you can directly edit the HTML code of the pages that are displayed, paste the Base Barion Pixel code as follows into the `<head>` tag of your website. This can be found just after the doctype declarations, and is comprised of various site metadata, such as the title of the current page.

The higher it is in the page markup the better, since our code takes a minimal time to run as the majority of Barion Pixel functions are loaded from an external source which loads asynctronously so that it won't block your page from loading or cause slowdowns.

Static HTML pages

If your site is served as a single HTML page optionally extended with CSS or JS files, but not pregenerated server-side, or as a collection of such pages, simply paste the code into the head of each and every page that you serve. If you don't know if your pages fall into this category, if your webshop doesn't use PHP, Ruby, AngularJS or some other server-side language, then it usually does.

Dynamic HTML pages

If your site is dynamically generated by server-side templating software (such as PHP, ERB, CSHTML or Jinja), or you use a server side language to preprocess your HTML pages, you should also make sure to have the code in the head of every page of your site. The best practice to do this is to use a persistent layout HTML document which stores the elements of your site that are loaded into every page (such as navigation bars and external JS or CSS libraries), and paste our code into it. If you want, you can also create a loadable subpage usually called a template with our code, and include that page in your layout. The important thing is to ensure that our code appears in every HTML document that you serve as part of your webshop.

@@ Line 6: / Line 6: @@
 {{NotificationBox|title=IMPORTANT|text=
-All Barion Pixel IDs conform to the format of "BP", ten numbers, then two numbers, connected by two dashes, as is provided in the example. Incorrect entries and other formats, such as IDs beginning with "BPT" will prevent the Barion Pixel from operating correctly.
+All Barion Pixel IDs conform to the format of "BP", ten numbers, then two numbers, connected by two dashes, as is provided in the example. Incorrect entries and other formats, such as IDs beginning with "BPT" will prevent the Barion Pixel from operating correctly.<br>
 Be sure to insert your unique Barion Pixel ID at both locations in the provided code example, marked by a red outline. Always double check your Barion Pixel ID. The Barion Pixel ID is different in the sandbox and live Barion systems.
 |color=#FF0000}}