GTM Advanced Options

❗️
IMPORTANT
Integrating Taboola via Google Tag Manager is not recommended as a long-term solution.
Whenever possible, consider using an alternative method - e.g. standard integration (aka JS Tag integration).

Editing Params

This section describes how to create/edit a Taboola code snippet yourself, for Google Tag Manager.

📘
To add the code snippet within Google Tag Manager, see Google Tag Manager (above).

📘
If you received a prefilled code snippet from Taboola, you can copy and paste it into GTM 'as is', without editing any Taboola params.

<script>
  /*
  Using JS, add a <div> container to your page, in the desired location.
  The *sample code* shown below adds a <div> to the *end of the page*. This is a *sample only*.
  
  Taboola modules served via GTM are NOT automatically responsive.
  Style the width of the <div> accordingly - e.g. use a width of 100% for mobile devices.
  */
  var div = document.createElement('div');
  div.id = 'taboola-slot'; // The ID of the <div> container (referenced below).
  div.style.width = '100%'; // Taboola modules served via GTM are NOT automatically responsive.
  document.body.appendChild(div); // This sample code adds a <div> to the *end of the page*.
</script>

<!-- Use YOUR OWN param values, as provided by Taboola -->
<script>
   window._taboola = window._taboola || [];
   _taboola.push({article:'auto', url : top.location.href}); // for a page_type of 'article', use 'article:'auto'

   _taboola.push({
     mode: '<mode>',
     container: 'taboola-slot', // The ID of the <div> container (see above).
     placement: '<placement>',
     target_type: 'mix'
   });
</script>

<!--  Fill in your Publisher ID, as provided by Taboola -->
<script src= '//cdn.taboola.com/libtrc/<publisher-id>/loader.js'></script>

🚧
Make sure to fill in your own param values, as provided by Taboola.

Param/default value	Instructions	Notes
`page_type`	The relevant page type, as provided by Taboola - E.g. for `article`, this line should read: `article='auto'`	Possible values: `video` (`video='auto'`) `article` (`article='auto'`) `photo` (`photo='auto'`) `search` (`search='auto'`) `category` (`category='auto'`) `home` (`home='auto'`) ---- The `'auto'` directive auto-generates an ID for the page.
`mode`	Fill in the UI Mode ID for this placement, as provided by Taboola: - E.g. `'<<mode>>'`.
`container`	Fill in the ID of the `<div>` container: - E.g. '`taboola-slot`'.
`placement`	Fill in the placement name, as provided by Taboola: - E.g. `'<<placementName>>'`.
`publisher`	Fill in your alphabetic Publisher ID, as provided by Taboola - E.g. `'<<publisherID>>'`	Your Publisher ID is a unique, alphabetic String. It might contain dashes - but not spaces.
`target_type`	Fill in the target type, as provided by Taboola: - E.g. `'<<targetType>>'`.

Sample snippet(s) with actual values

🚧
The following code snippets illustrate sample values.
Make sure to fill in your own values, as provided by Taboola.

<script>
  /*
  Using JS, add a <div> container to your page, in the desired location.
  The *sample code* shown below adds a <div> to the *end of the page*. This is a *sample only*.
  
  Taboola modules served via GTM are NOT automatically responsive.
  Style the width of the <div> accordingly - e.g. use a width of 100% for mobile devices.
  */
  var div = document.createElement('div');
  div.id = 'taboola-slot'; // The ID of the <div> container (referenced below).
  div.style.width = '100%'; // Taboola modules served via GTM are NOT automatically responsive.
  document.body.appendChild(div); // This sample code adds a <div> to the *end of the page*.
</script>

<!-- Fill in YOUR OWN param values, as provided by Taboola -->
<script type="text/javascript">
   window._taboola = window._taboola || [];
   _taboola.push({article:'auto', url : top.location.href}); // for a page_type of 'article', use 'article:'auto'
  
   _taboola.push({
     mode: '<<mode>>',
     container: 'taboola-slot', // The ID of the <div> container (see above).
     placement: '<<placementName>>',
     target_type: 'mix'
   });
</script>

<!--  Fill in your Publisher ID, as provided by Taboola -->
<script src= '//cdn.taboola.com/libtrc/<<publisherID>>/loader.js'></script>

<script>
  /*
  Using JS, add a <div> container to your page, in the desired location.
  The *sample code* shown below adds a <div> to the *end of the page*. This is a *sample only*.
  
  Taboola modules served via GTM are NOT automatically responsive.
  Style the width of the <div> accordingly.
  */
  var div = document.createElement('div');
  div.id = 'taboola-slot'; // The ID of the <div> container (referenced below).
  div.style.width = '600px'; // Taboola modules served via GTM are NOT automatically responsive.
  tblDiv.style.margin = "0 auto";
  document.body.appendChild(div); // This sample code adds a <div> to the *end of the page*.
</script>

<!-- Fill in YOUR OWN param values, as provided by Taboola -->
<script type="text/javascript">
   window._taboola = window._taboola || [];
   _taboola.push({article:'auto', url : top.location.href}); // for a page_type of 'article', use 'article:'auto'
  
   _taboola.push({
     mode: '<<mode>>',
     container: 'taboola-slot', // The ID of the <div> container (see above).
     placement: '<<placementName>>',
     target_type: 'mix'
   });
</script>

<!--  Fill in your Publisher ID, as provided by Taboola -->
<script src= '//cdn.taboola.com/libtrc/<<publisherID>>/loader.js'></script>