This article describes how using the Taboola Ecommerce Events Pixel on your website drives scaled shopper targeting and optimization for your Connexity performance marketing campaign. The pixel includes two layers of tags implemented in Google Tag Manager (the "base" Taboola Pixel Tag and the Ecommerce Pixel Tag). Along with the installation of the pixel tags, this article covers the setup of specific pixel tag events that will drive opportunities for increased campaign scale and performance. 

Links to Important Topics In This Article

• Pixels and Your Campaign
  • Why Use Pixels
  • How Pixel Data is Used
• Install With Google Tag Manager
  • 1-Add the Taboola Ecommerce Pixel Template
  • 2-Implement Taboola Base Pixel Tag
  • 3-Implement Taboola Ecommerce Pixel Tag
• Pixel Verification
• Using the API

 

---

PIXELS AND YOUR CAMPAIGN

Why Use Pixels

Advertisers working with Taboola and Connexity use pixels to drive campaign success. Our Pixels gather data to help you understand the actions users take on your website, like page visits, account creation, purchases, and video views. These activity signals help us to optimize your marketing campaigns for maximum success.

Scale Commerce Growth Opportunities

E-Commerce Events Tracking enables a retailer's existing first-party data to scale growth opportunities. Marketing solutions that leverage a retailer's own first-party data are becoming increasingly important as web browsers make incremental changes that further restrict the use of third-party cookies. The full Ecommerce Pixel uses insight about how shoppers interact with your sight to target interest-based audiences in high-intent content.

The Ecommerce Pixel gathers intent signals of visitors to your website and uses those signals to dynamically recommend the right product offers at the right time when visiting publisher content where Connexity or Taboola manage the placement of product ads. The full Ecommerce Pixel enables retailer product offers to access nearly thousands of high-volume content sites where traffic where Taboola has direct advertising relationships  

Optimize Commerce Campaign Performance

Data from the Ecommerce pixel are also critical inputs for optimizing campaign performance. Signals from the Ecommerce pixel enable real-time adjustment of pricing and bidding algorithms in the Connexity Bid Optimizer to ensure efficient use of budget when scaling exposure across high-volume and in-demand  Smart Pricing and placement optimization processes. 

 

How Pixel Data is Used

The Ecommerce Events Pixel is an essential tool for any Taboola platform customer with a commerce campaign. The pixel gathers information to learn how visitors interact with your website and uses that information to make data-driven decisions that optimize the performance of your campaign(s). It's easy and quick to set up, and loads asynchronously so it doesn't affect your page performance or SEO page ranking.

Also note, for any data processed through the Taboola platform that may fall in scope of applicable data protection laws (e.g., GDPR, CCPA), Taboola undertakes appropriate safeguards to ensure ongoing compliance.

 

 

 

---

INSTALL WITH GOOGLE TAG MANAGER

About Google Tag Manager (GTM)

What is the Tag Manager?

The Tag Manager is a tool that allows marketers to add and update tags and code snippets such as conversion tracking, site analytics, and remarketing code quickly and easily, without editing the website’s code. 

What is a Tag? 

A tag is a piece of code that is often provided by marketing, for analytics platforms to send information to them (e.g., Taboola Pixel, Facebook Pixel, Google Analytics Tracking Code, Remarketing Tags, etc.). 

What is the Taboola Ecommerce Pixel template?

The Google Tag Manager Taboola E-Commerce Pixel template allows marketers to easily implement the Taboola E-Commerce pixel without the need to know how to code.

 

 

1 - Add the Taboola Ecommerce Pixel Template 

You can access the Taboola template from within the Google Tag Manager Template Gallery or from your Tag Manager homepage.  ➤ Taboola template in Google Tag Manager

1. Go to Google Tag Manager and navigate to the Templates section on the left side of the page page

2. Under Tag Templates, click on "Search Gallery", and search for Taboola E-Commerce Pixel.

3. Click on the Taboola E-Commerce Pixel option, and add the Taboola E-Commerce Pixel template to the relevant workspace.

 

 

 

2 - Implement Taboola Base Pixel Tag 

1. Exit the templates screen
2. Click Add a New Tag in the New Tag box.
   
3. Click 'Tag Configuration'
   
4. Choose E-commerce Taboola Pixel from the custom tags section
   
5. Name the new tag, for example: ‘Taboola- Base Pixel’
   
6. Input your account ID which you want the pixel to be tracking. (Your account ID is located in your Taboola Ads account, in the Taboola Pixel section )
   
7. Select 'Event Type' as 'Base Pixel - Page View'
   
8. Click on the Advanced Settings dropdown and select Once per Page under the tag firing options.
   
9. Click on Triggers then select All Pages for firing triggering.
   
10. Save the Pixel.

Verify & Publish the Tag

The final step is to verify the tag is added and properly running on your website.

1. Click Preview from the top right of the working space.
   
2. Open your website in a new tab.
3. If you see that your taboola pixel has been fired like in the images below, it’s working properly.
   
4. Click Submit then Publish to save all changes.
5. Go back into Taboola Ads and see if the window has changed to Pixel is Active (Note: It may take up to 20 minutes for your pixel status to change after installing it).

 

 

3 - Implement Taboola Ecommerce Tag 

1. Exit the templates screen

2. Click Add a New Tag in the New Tag box

3. Click "Tag Configuration"

4. Choose Taboola E-Commerce Pixel from the custom tags section

5. Name the new tag to identify it. For example ‘Taboola Ecomm - Add to Cart’.

6. Input your account ID which you want the pixel to be tracking. (Your account ID is located in your backstage account, in the Taboola Pixel section )

7. If you have a Google Enhanced Ecommerce data layer installed on your site, you can select the “Enhanced Ecommerce” checkbox . This will eliminate the need to select GTM variables (step 9).

Available events for Enhanced Ecommerce are: Add To Cart, Category View, Checkout, Product View, Purchase, and Remove From Cart.

8. Choose the Event Name you would like to implement from the drop down (the available options are changed based on the “Enhanced Ecommerce” selection ):

9. Choose the GTM Variable** , if requested, you would like to return from the drop down (specific variable requirements for the event can be found by clicking ‘?’):

** Event Parameters

Include the following variables with the standard events listed above that support them. Following are the available event parameters and their values definition 

Event	Event Description	Event Parameters
Product View	The user viewed the info page of an item	Product IDs (String/Array of strings/strings separated by commas) Select the GTM Variable that returns Product IDs (SKUs) in the current page. Examples: [“sku1”, “sku2”], “sku1”, “sku1,sku2”
Add To Cart	A product was added to the shopping cart	Product IDs (String/Array of strings/strings separated by commas):  Select the GTM Variable that returns Product IDs (SKUs) in the current page. Examples: [“sku1”, “sku2”], “sku1”, “sku1,sku2”
Purchase	A purchase was made	Cart Details (Array of objects): Select the GTM Variable that returns an array containing the quantity, product ID and the unit price of each item in the user's cart. Example: [{productId: “sku1”, quantity: 3, price: 22.45}, {productId: “sku2”, quantity: 4, price: 15.76}]  Order ID (String): Select the GTM Variable that returns the Order ID of the current transaction. This ID should be unique per Order.  Value (Number Decimal): The total value of the purchase (conversion) in the given currency. Example: 9.99  Currency (String): The currency used in the cart in ISO 3-letter currency code notation. Example: “USD”
Category View	A list of products was displayed to the user by browsing a category	Product IDs (String/Array of strings/strings separated by commas. Select the GTM Variable that returns Product IDs (SKUs) in the current page. Examples: [“sku1”, “sku2”], “sku1”, “sku1,sku2”  Category (String): Select the GTM Variable that returns the name of the category being viewed. Example: “Womens Shoes”  Category ID (String): Select the GTM Variable that return the ID of the category being viewed (optional)
Search	A search results page was displayed to the user	Product IDs (String/Array of strings/strings separated by commas. Select the GTM Variable that returns Product IDs (SKUs) in the current page. Examples: [“sku1”, “sku2”], “sku1”, “sku1,sku2”  Search Term (String): Select the GTM Variable that returns the search term entered by the user. Example: “long dress”
Home Page Visit	The home page was displayed to the user.
Checkout	A checkout flow was started	Product IDs (String/Array of strings/strings separated by commas): Select the GTM Variable that returns Product IDs (SKUs) in the current page. Examples: [“sku1”, “sku2”], “sku1”, “sku1,sku2”
Add to Wishlist	A product was added to a wish list.	Product IDs (String/Array of strings/strings separated by commas): Select the GTM Variable that returns Product IDs (SKUs) in the current page. Examples: [“sku1”, “sku2”], “sku1”, “sku1,sku2”
Remove from Wishlist	A product was removed from the wish list.	Product IDs (String/Array of strings/strings separated by commas):  Select the GTM Variable that returns Product IDs (SKUs) in the current page. Examples: [“sku1”, “sku2”], “sku1”, “sku1,sku2”

 

10. Click the Advanced Settings drop down and select Once per Event under tag firing options.

11. Select the relevant triggering option. If you wish to track clicks, set the click trigger. If you want a pixel to be fired when users scroll down to the website, set the scroll depth trigger. (Note: You need to set these triggers in advance). You can find more information about GTM triggers here.

12. Save, submit and publish.

13. Verify it is firing correctly with the Taboola tag assistant Chrome extension or via the google tag manager debugging tool.

 

---

PIXEL VERIFICATION

Once you have implemented the e-Commerce Pixel on your website (using Google Tag Manager or similar), we recommend that you verify your implementation.
To verify that the eCommerce Pixel is present and working, perform the steps outlined below.

Method 1: Verification via Chrome Extension

Getting Ready

The Getting Ready steps are required only once per device.

1. Install the Taboola Pixel Helper extension from the ➤ Chrome Web Store.

2. Confirm that Taboola Pixel Helper is showing in the ‘extensions’ toolbar (to the right of the browser address bar). If it is not showing, click on the  extensions icon, and pin Taboola Pixel Helper to the ‘extensions’ toolbar.

First Steps

1. Browse to your website and perform various e-commerce operations

2. For each e-commerce operation (or page visited), perform the set of steps outlined in "Per Action Steps" below.

Per Action Steps

1. Examine the Taboola Pixel Helper extension.

2. Taboola Pixel Helper displays an even count.   If there is no event count, click on the icon anyway (see next step). Occasionally the event count does not display, even though events are present.

3. Click on the extension  to view the event details:

4. Scroll down and expand the 'Parameters Sent' section:

5. Verify the parameters look correct

• • Confirm the "ce" parameter was send with a value of "ecomm".
  • Decode the "data' parameter and verify that all event data is correct. (For example, check that the product details look accurate.) There are a number of tools that can be used to decode URL data - e.g. this one.

1. Example:
2. URL encoded "data' parameter:

3. %7B%22productIds%22%3A%5B%222280298938464%22%5D%2C%22timestamp%22%3A%227%2F1%2F2021%22%2C%22eventType%22%3A%22PRODUCT_VIEW%22%7D

4. Decoded "data' parameter:

5. {"productIds":["2280298938464"],"timestamp":"7/1/2021","eventType":"PRODUCT_VIEW"}

• • Verify that each event is sent only once.

6. Verify that the error count (top right) is 0. In the event of an error (e.g. invalid parameter values), an error message is shown:

 

Method 2: Verification via Network tab (Chrome Tools)

This method is intended for more advanced users.

Getting Ready

1. Open Chrome Dev Tools. (tip: position the Dev Tools window below the web page for maximum width.)

2. Select the Network tab and enter "taboola" in the Filter field (top left).

3. Browse to your website.

First Steps

1. Examine the traffic under the Network tab and verify that tfa.js is being called:

2. Perform various e-commerce operations. For each e-commerce operation (or page visited) perform the steps outlined in the "Per Action Steps" below.

Per Action Steps

1. Check that a corresponding network call is present. Look for an entry that begins with “unip?ce=ecomm”:

2. If the expected entry is not present, select the Console tab and check for errors.

3. Else, click on the entry and select the Headers tab on the right:

4. Scroll down to the Query String Parameters section. Verify that all event parameters (e.g. "ce", "en" and "data") were sent correctly:

 

 

---

USING THE API

A small API call can notifying Taboola whenever a visitor performs a relevant shopping activity on your website . The Taboola E-Commerce Events Javascript API is straightforward, and supports the following events:

• addToCart
• removeFromCart
• addToWishList
• removeFromWishList
• productView
• categoryView
• homePageVisit
• search
• purchase
• checkout  

Sending as many of the above events as possible will improve the performance of the product recommendation algorithm. 

The description below outlines the Taboola E-Commerce Events Javascript API and its usage. It is intended for technical audiences who are skilled at implementing pixels on a Website.

API Overview

The API is implemented in the Taboola Pixel’s tfa.js library. 

Ecommerce events are reported via the _tfa.push() function. Each event should contain the event name and one or more event parameter objects. The available events and their parameters are detailed in the table below. Each of the parameter objects mentioned will be defined and examples given later in this document. 

Before using the _tfa.push() event in a page you should verify the events queue is initialized by calling:

window._tfa = window._tfa || [];

API Events

Following is the list of supported API events and their associated parameter objects. The code should be implemented on all site pages:

*pageView - In case that you already have this event defined (have a previous sponsored content Taboola campaign), there is no need to redefine this event again.

Event Parameters

Include the following parameters with the standard events listed above that support them. Format your parameter object values in the API call using JSON.

Following are the available event parameters and their values definition

 

API Usage Examples

Following are examples of the API usage (replace the advertiser's real ID instead of the placeholder <INSERT_ADVERTISER_ID>). Note that “name” can be in lowercase as well.

PageView

window._tfa.push({notify: 'event', name: 'page_view', id: 1234567});

addToCart

window._tfa.push({ id: <INSERT_ADVERTISER_ID>,  notify: 'ecevent', name: 'ADD_TO_CART',
 productIds: ['sku1','sku2']
});

removeFromCart

window._tfa.push({id: <INSERT_ADVERTISER_ID>,  notify: 'ecevent', name: 'REMOVE_FROM_CART' ,
 productIds: ['sku1','sku2']
});

addToWishList

window._tfa.push({id: <INSERT_ADVERTISER_ID>, notify: 'ecevent', name: 'ADD_TO_WISH_LIST',
 productIds: ['sku1','sku2']
});

removeFromWishList

window._tfa.push({id: <INSERT_ADVERTISER_ID>, notify: 'ecevent', name: 'REMOVE_FROM_WISH_LIST',
 productIds: ['sku1']
});

productView

window._tfa.push({id: <INSERT_ADVERTISER_ID>,notify: 'ecevent', name: 'PRODUCT_VIEW',
 productIds: ['sku1']
});

categoryView

window._tfa.push({id: <INSERT_ADVERTISER_ID>, notify: 'ecevent', name: 'CATEGORY_VIEW',
 productIds: ['sku1','sku2'],
 category: 'food',
 categoryId: '123456'
});

homePageVisit

window._tfa.push( {id: <INSERT_ADVERTISER_ID>, notify: 'ecevent', name: 'HOME_PAGE_VISIT'});

search

window._tfa.push({id: <INSERT_ADVERTISER_ID> , notify: 'ecevent', name: 'SEARCH',
 productIds: ['sku1','sku2'],
 searchTerm: 'clothes and football'
});

purchase

window._tfa.push({id: <INSERT_ADVERTISER_ID>, notify: 'ecevent', name: 'PURCHASE',
 orderId: 'order123',
 currency: 'USD',
 value: 130.39,
 cartDetails: [
  {productId: 'sku1', quantity: 3, price: 22.45},
  {productId: 'sku2', quantity: 4, price: 15.76}
 ]
});

checkout

window._tfa.push({id: <INSERT_ADVERTISER_ID>, notify: 'ecevent', name: 'CHECKOUT',
 productIds: ['sku1','sku2']
});

 

Comprehensive Integration Example

Following is a complete implementation example, including an e-commerce API call.  

If you already have the Taboola pixel code installed, add the e-commerce specific event call to your existing Pixel code as follows on all relevant site pages (E.g. when an product-view event occurs then the product-view event should be fired):

  window._tfa.push({id: <INSERT_PUBLISHER_ID> ,notify: 'ecevent', name: 'PRODUCT_VIEW', productIds: ['sku1']});

In case you don’t have the Taboola pixel code installed, please add the Backstage Taboola pixel code to every page with the specific relevant e-commerce event (see red line below) and includes that advertiser's real ID instead of the placeholder id - 1234567

// Example: the account id is 1234567
<!-- Taboola Pixel Code -->
<script type='text/javascript'>
  window._tfa = window._tfa || [];
  window._tfa.push({notify: 'event', name: 'page_view', id: 1234567});
  window._tfa.push({id: 1234567, notify: 'ecevent', name: 'PRODUCT_VIEW', productIds: ['sku1']});

  !function (t, f, a, x) {
         if (!document.getElementById(x)) {
            t.async = 1;t.src = a;t.id=x;f.parentNode.insertBefore(t, f);
         }
  }(document.createElement('script'),
  document.getElementsByTagName('script')[0],
  '//cdn.taboola.com/libtrc/unip/1234567/tfa.js',
  'tb_tfa_script');
</script>
<noscript>
  <img src='https://trc.taboola.com/1234567/log/3/unip?en=page_view'
      width='0' height='0' style='display:none'/>
</noscript>
<!-- End of Taboola Pixel Code -->