Skip to main content

Conversion pixel

conversion.js#

Adding the conversion script to all your pages lets you automatically track any user conversions.

Setup#

Add this script to your page and replace YOUR_ACCOUNT_ID with your actual account Id.

<script>
(function(_, b, e, o, p) {
if (_.beopTag) {
return;
}
_.beopTag = function beopTag() {
beopTag.events.push([].slice.call(arguments));
};
beopTag.events = [];
o = b.createElement(e);
o.src = "https://widget.beop.io/conversion.js";
p = b.querySelector(e);
p.parentNode.insertBefore(o, p);
})(window, document, "script");
beopTag("init", "YOUR_ACCOUNT_ID", {version: 2});
</script>

This little piece of code will load the actual conversion.js tracker asynchronously (meaning it's non blocking for your page) and store any event that was tracked before the actual script is loaded. This way, all the events can be sent to our server as soon as possible and without losing anything.

Tracking a pageview#

NOTE: Prior to version 2, the tracking was automatically called. If you pass {version: 2} to the init call and want to track this event, you now need to call the pageview tracking explicitely.

Simply call the beopTag function with the following parameters:

beopTag("track", "pageview");

Tracking a conversion#

Call the beopTag function with the following parameters:

beopTag("track", "conversion");

If you want to add additional information, there is a third parameter where you can place what you want, as long as it's a string.

beopTag("track", "conversion", "50");

This can be useful if you want to pass:

  • the price of the cart a user completed
  • the cart product references
  • anything you want, really

Hardcoding campaign & content#

Sometimes, the redirect service strips query string params and prevents the conversion pixel from resolving the origin. For these cases, a third parameter can be added to the init:

beopTag(
"init",
"YOUR_ACCOUNT_ID",
{"campaign": "CAMPAIGN_ID", "content": "CONTENT_ID", "publisher": "PUBLISHER_ID"}
);

NOTE: If not provided, these parameters default to what's found in the query string.

Image pixel#

Setup#

Page view#

<!-- Without content -->
<img src="https://tw.beop.io/conversion?event=pageview&account=YOUR_ACCOUNT_ID&campaign=YOUR_CAMPAIGN_ID" alt="" width="1" height="1" crossorigin="use-credentials" />
<!-- With content -->
<img src="https://tw.beop.io/conversion?event=pageview&account=YOUR_ACCOUNT_ID&campaign=YOUR_CAMPAIGN_ID&content=YOUR_CONTENT_ID" alt="" width="1" height="1" crossorigin="use-credentials" />

Conversion#

<!-- Without content -->
<img src="https://tw.beop.io/conversion?event=complete&account=YOUR_ACCOUNT_ID&campaign=YOUR_CAMPAIGN_ID" alt="" width="1" height="1" crossorigin="use-credentials" />
<!-- With content -->
<img src="https://tw.beop.io/conversion?event=complete&account=YOUR_ACCOUNT_ID&campaign=YOUR_CAMPAIGN_ID&content=YOUR_CONTENT_ID" alt="" width="1" height="1" crossorigin="use-credentials" />
<!-- With content and value-->
<img src="https://tw.beop.io/conversion?event=complete&account=YOUR_ACCOUNT_ID&campaign=YOUR_CAMPAIGN_ID&content=YOUR_CONTENT_ID&value=2EUR" alt="" width="1" height="1" crossorigin="use-credentials" />
<!-- With value-->
<img src="https://tw.beop.io/conversion?event=complete&account=YOUR_ACCOUNT_ID&campaign=YOUR_CAMPAIGN_ID&value=2EUR" alt="" width="1" height="1" crossorigin="use-credentials" />