Invisible widgets

Overview

Occasionally, you may decide not to display Taboola content for certain page types. Although these pages do not contain Taboola content, Taboola integration is still needed in order to track page views. Doing so, helps Taboola to optimize user engagement and CTR across your site.

πŸ“˜

Customers using Taboola Newsroom should always insert invisible widgets on the relevant pages.

For more information, reach out to your Taboola Account Manager.

Tracking page views only

Standard page

To enable 'page view' tracking on a standard web page - without displaying Taboola content - do the following.

  1. Insert the following script in the page <head>, and edit the relevant params:
<script type="text/javascript">
  // *Global* command queue for the page
  window._taboola = window._taboola || [];
  
  // Pass the *page* type:
  _taboola.push({
    <page-type>: "auto",
  });
  
  // The Taboola loader
  !(function (e, f, u, i) {
    if (!document.getElementById(i)) {
      e.async = 1;
      e.src = u;
      e.id = i;
      f.parentNode.insertBefore(e, f);
    }
  })(
    document.createElement("script"),
    document.getElementsByTagName("script")[0],
    // Fill in your Publisher ID (an alphabetic string), as provided by Taboola:
    "//cdn.taboola.com/libtrc/<publisher-id>/loader.js",
    "tb_loader_script"
  );
  if (window.performance && typeof window.performance.mark == "function") {
    window.performance.mark("tbl_ic");
  }
</script>

Param

Instructions

<publisher-id>

Fill in your Publisher ID (an alphabetic string), as provided by Taboola.

For example, if your Publisher ID is '<<publisherID>>', then the URL should read:

//cdn.taboola.com/libtrc/<<publisherID>>/loader.js

πŸ“˜

Your Publisher ID is a unique, alphabetic String, provided by Taboola.

It might contain dashes - e.g. "<<publisherID>>" - but not spaces.

Param

Instructions

Notes

<page-type>

Replace this with the relevant page type (as provided by Taboola) - e.g. article:

article:'auto'

Possible values:
video, article, photo, search, category, home.

  1. Insert the following code snippet in the page <body>:

🚧

Taboola Newsroom customers should use the second example, exactly as provided.

<div id="invisible-taboola-slot"></div>
<script type="text/javascript">
  // *Global* command queue for the page
  window._taboola = window._taboola || [];
  
  // Pass the invisible placement details:
  _taboola.push({
    mode: "rbox-tracking", // For an invisible placement, the mode is ALWAYS "rbox-tracking".
    container: "invisible-taboola-slot", // Must match the ID of the <div> (above).
    placement: "<placement>" // Used for reporting. Choose any placement name that works for your team.
  });
</script>
<div id="taboola-newsroom"></div>
<script type="text/javascript">
  // *Global* command queue for the page
  window._taboola = window._taboola || [];
  
  // Pass the invisible placement details:
  _taboola.push({
    mode: "rbox-tracking",
    container: "taboola-newsroom",
    placement: "Newsroom"
  });
</script>

πŸ“˜

Params

  • mode - For an invisible placement, the mode is always "rbox-tracking".

  • container - The ID of the invisible <div> container:

    E.g. 'invisible-taboola-slot'

    • Newsroom customers should use "taboola-newsroom" as the container ID.
    • Otherwise, choose any ID that is unique for that page.
    • Make sure that the JS code snippet matches the chosen ID.
  • placement - Used for reporting:

    E.g. 'Home Page - Invisible Placement'

    • Newsroom customers should use "Newsroom" as the placement name.
    • Otherwise, choose any placement name that works for your team.
  1. Insert the following code snippet just before the closing <body> tag:
<script>
  // *Global* command queue for the page
  window._taboola = window._taboola || [];

  // Pass the `flush` command:
  _taboola.push({flush: true});
</script>

AMP pages

To enable 'page view' tracking on an AMP page - without displaying Taboola content - do the following.

  1. Insert the following tag at the top of the AMP page:
<amp-analytics type="taboola" id="taboola">
  <script type="application/json">
    {
      "vars": {
        "aid": "<account-id>"
      }
    }
  </script>
</amp-analytics>

Param

Instructions

<account-id>

Fill in your Account ID (aka Publisher ID), as provided by Taboola.

πŸ“˜

Your Account ID (aka Publisher ID) is a unique, alphabetic String, provided by Taboola.

It might contain dashes - e.g. "<<publisherID>>" - but not spaces.