Install Tracking Pixel
Cheyenne V. avatar
Written by Cheyenne V.
Updated over a week ago

This article will cover:


Overview

Klear offers the ability to track conversions via a tracking pixel. In your Klear Settings > Integrations, you will find the Klear Conversion Pixel section with the Klear Tag and Event Snippet you need to add to your website to enable conversion tracking.

Klear Conversion Pixel Settings

Once the pixel is installed, you can check the status of the tracking pixel.

Indication in Klear Conversion Pixel Settings

Depending on your needs, we support integrating the Klear Conversion Pixel via the Front End as a cookie and the back end.


Frontend Usage

To successfully track conversions, you need to add a general Klear Tag that initializes the Klear Conversion Pixel with your unique client ID and push each conversion event to Klear. The details of both parts are explained below, and each includes a guide for using Google Tag Manager.

General Information

Cookie name:

klear-aff-track

Provider

klear.com

Retention

Conversions will be tracked within 30 days from the last click that initiated the cookie.

Klear Tag

The first snippet is the Klear Tag, which initializes the Klear Conversion Pixel with your unique client ID. We recommend placing it inside your site's <head> tags.

In your Klear Conversion Pixel Settings, you will find the complete tag, including your unique client ID:

<script>(function(k, l, e, a, r) {

if (typeof k[e] !== 'undefined') return; k[e] = [];

var el = l.createElement('script'); el.async = true;

var objQ = e !== 'klrq' ? '&o=' + e : '';el.src = a + '?id=' + r + objQ + '&klAff';

var m = l.getElementsByTagName('script')[0];m.parentNode.insertBefore(el, m);})

(window, document, 'klrq', 'https://klear.com/dist/klrTrack.bundle.js', 'UNIQUE_CLIENT_ID'); </script>

Klear Tag

To verify the pixel has been correctly added to your website, visit your website once after the change and then check if it shows as a Connected Pixel in the Klear Conversion Pixel Indicator in your account settings.

Alternatively, you can check for a successful call from the page to

Google Tag Manager (Klear Tag)

If you have the Google Tag Manager installed on your website, you can use it to add the Klear Tag following these steps:

  1. Under the “Tags” tab, click “New”

  2. Click “Tag Configuration” and choose “Custom HTML”

  3. Copy the Klear Tag from Settings > Integrations > Klear Conversions Pixel and paste it into the HTML input field

  4. Click “Advanced Settings” and select “Once per page” as the tag-firing option

  5. Click “Triggering” and select “All Pages”

  6. Save the Tag

  7. Publish the changes

Conversion Event

To push a conversion event to Klear you need to call

klrq.push(['conversion', PROPERTIES]).

The properties are explained below.

You can do this for example by placing the Event Snippet inside the <head> tags of the page or pages that you'd like to track conversions on (e.g. www.example.com/thank-you-page), right after the Klear Tag.

<script>klrq.push(['conversion', {

value: VALUE HERE,

name: NAME HERE,

currency: CURRENCY HERE,

picture: PICTURE HERE,

items: ITEMS HERE

}])</script>

Event snippet

A conversion can have the following properties, all optional:

Property Type

Value Type

Description

name

string

Name of version item. Default: ‘conversion’

value

number

Value of the conversion (after discount, if applicable). Default: 0

currency

string

Currency of the conversion. ISO 4217 currency code. Default: 'USD'

picture

string

URL for an image to associate with the conversion

items

Array of conversion items

Array of items inside the conversion (see next table)

coupon

string

Name of the coupon code

Conversion properties

Here's what a conversion could look like:

klrq.push(['conversion', {

value: 10.1,

name: ‘Shoe’,

currency: ‘USD’,

Coupon: ‘SUMMERSALE20’,

}])

Example conversion event

Conversions can contain items. If a conversion contains items, the properties of the item will overwrite the relevant properties of the conversion:

Property Type

Value Type

Description

name

string

Name of the conversion item. Default: 'Conversion'

value

number

Value of a single item (after discount, if applicable). Default: 0

picture

string

URL for an image to associate with the item

product_link

string

URL for the product to associate with the item

quantity

number

Quantity of item. Default: 1

Conversion item properties

Here's what a conversion with items could look like:

Request Header

Body

{

"clientId": "UNIQUE_CLIENT_ID",

"linkId": "KLEAR_LINK_ID",

"coupon": "SUMMERSALE20",

"currency": "USD",

"items": [{

"value": 9.95,

"name": "Shoe",

"quantity": 2,

}, {

"value": 10.5,

"name": "Hat"

}]

}

Example conversion with items (Backend usage)

Important note: the value of the shoes is 9.95 per item (there are 2 items with a value of 9.95 each after discount).

Google Tag Manager (Conversion Event)

If you have the Google Tag Manager installed on your website, you can use it to add the Klear Tag following these steps:

  1. Under the “Tags” tab, click “New”

  2. Click “Tag Configuration” and choose “Custom HTML”

  3. Copy the Event Snippet from the Klear Conversions Pixel Settings and paste it into the HTML input field. Replace desired conversion properties with your available purchase data. You might need to ask your web developer to add this data to the Google Tag Manager Data Layer

  4. Click “Advanced Settings”. Depending on the Trigger you will use you might want to select “Once per page” as the Tag firing option

  5. Click “Triggering” and set up a trigger for the page views of the page or pages that you'd like to track conversions on (e.g. www.example.com/thank-you-page)

  6. Save the Tag

  7. Publish the changes


Backend Usage

Alternatively to the frontend solution described above, you can send a POST request to

In order to do so, you have to first validate you client ID with a call from the page to

You can find the UNIQUE_CLIENT_ID as part of the Klear Tag in your Klear Conversion Pixel Settings. Another needed parameter is the KLEAR_LINK_ID, which is part of Klear Tracking Links.

Here’s what Klear Tracking Link could look like:

https://www.example.com?klear_link_id=KLEAR_LINK_ID&utm_source=klear&utm_medium=influencer&utm_ campaign=ambassador_program

In your host header, make sure to include the origin of your conversion (website of the store the conversion was made on).

The request body must include the UNIQUE_CLIENT_ID. Also, the request body must include at least one of the properties KLEAR_LINK_ID as described above or the name of the used coupon code. Additional conversion properties are optional:

Property Type

Value Type

Description

clientid

string

The UNIQUE_CLIENT_ID as found in the Klear Tag in your Klear Conversion Pixel Settings (required)

linkid

string

The KLEAR_LINK_ID query parameter in Klear Tracking Links

coupon

string

Name of the coupon code

name

string

Name of conversion item. Default: 'conversion'

value

number

Value of the conversion (after discount, if applicable). Default: 0

currency

string

Currency of the conversion. ISO 4217 currency code. Default: 'USD'

picture

string

URL for an image to associate with the conversion

items

Array of conversion items

Array of items inside the conversion (see next table)

Conversion properties (backend usage)

Conversions can contain items. If a conversion contains items, the properties of the item will overwrite the relevant properties of the conversion:

Property Type

Value Type

Description

name

string

Name of the conversion item. Default: 'Conversion'

value

number

Value of a single item (after discount, if applicable). Default: 0

picture

string

URL for an image to associate with the item

product_link

string

URL for the product to associate with the item

quantity

number

Quantity of item. Default: 1

Conversion item properties

Here's what a conversion with items could look like:

Request Header

Body

{

"clientId": "UNIQUE_CLIENT_ID",

"linkId": "KLEAR_LINK_ID",

"coupon": "SUMMERSALE20",

"currency": "USD",

"items": [{

"value": 9.95,

"name": "Shoe",

"quantity": 2,

}, {

"value": 10.5,

"name": "Hat"

}]

}

Example conversion with items (Backend usage)

Important note: the value of the shoes is 9.95 per item (there are 2 items with a value of 9.95 each after discount).


💡 Tip

Need more help? Feel free to reach out to us via Live Chat or check out our Customer Community.

Find answers and get help from Meltwater Support and Community Experts.


Did this answer your question?