Guides
v1.0
Log In
Guides

Add the base pixel to an SPA

Suggest Edits

With standard web pages, each time a page is loaded, a page_view event is triggered for that URL.

Since this is not the case for an SPA (Single Page Application), additional work is required.

Physical page refresh

Make sure that the pixel is fired on each page refresh. Typically, this is achieved by adding the base pixel to the <head> of your page:

<!-- Taboola Pixel Code -->
<script type='text/javascript'>
  window._tfa = window._tfa || [];
  window._tfa.push({notify: 'event', name: 'page_view', id: <account_id>});
  !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/<account_id>/tfa.js',
  'tb_tfa_script');
</script>
<!-- End of Taboola Pixel Code -->

📘

Params

<account_id> - Replace each occurance (above) with your numeric Taboola Account ID.

For a prefilled code snippet, see: Tips & Techniques (below)

Logical page view

For each state in your code that marks a logical page view, fire a page_view event, and pass an item-url param with the relevant URL:

_tfa.push({notify: 'event', name: 'page_view','item-url': '<your_URL>', id: <account_id>});

📘

Params

  • <your_URL> - Replace with the relevant URL.
  • <account_id> - Replace with your numeric Taboola Account ID.

Viewing content

Sometimes, navigation between pages does not reflect as a URL change.

In that case, fire a view_content event:

_tfa.push({notify: 'event', name: 'view_content', id: <account_id>});

📘

Params

<account_id> - Replace with your numeric Taboola Account ID.

What's next?

Now that you have added the base pixel, make sure to:

  1. Add event pixels.
  2. Verify that your pixels are running smoothly.

Tips & techniques

Copy a prefilled code snippet (or send it via email)

To copy a prefilled code snippet (or send it via email):

  1. Open Realize, and select the account (top, left) that you will use to track conversions.

  2. In the sidebar (left), select Tracking.

  3. Click on Account Tracking Setup (top, right):

  4. Select Manually as the Setup Method, and click on Continue.

  5. Mouse over the code snippet and click on COPY TO CLIPBOARD.

📘

To send an email with all your code snippets, continue below.

  1. Scroll down to the Email instructions section.
  2. Click on the Select Email Address button and follow the instructions provided.

Obtain your Account ID

To obtain your numeric Taboola Account ID:

  1. Open Realize, and select the account (top, left) that you are using to track conversions.

    🚧

    Make sure to select the Taboola account that you are using to track conversions.

  2. In the sidebar (left), select Tracking.

  3. Copy the numeric Account ID on the screen (top, left):

Updated 4 days ago