Advanced Options
IMPORTANT
Taboola integration via Google Ad Manager has numerous drawbacks.
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 Ads Manager.
To add the code snippet as a creative in Google Ads Manager, see Google Ad Manager (DFP) (above).
If you received a prefilled code snippet from Taboola, you can copy and paste it into GAM 'as is', without editing any Taboola params.
After copying the prefilled code snippet, make sure to edit the width of the
<div>
element.
A standard code snippet follows:
<!--
Taboola content will load in the <div> element below.
You can use any ID for the <div> - just make sure to update ALL references in the JS (below).
Taboola modules served via GAM are NOT responsive. Style the width of the <div> to match your needs.
-->
<div id="taboola-slot" style="width:<<width>>px"></div>
<!-- Use 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({listenTo: 'render', handler : function(){
var wdgc = document.getElementById('taboola-slot'); // Pass the ID of the <div> container (see above).
window.frameElement.width = "" + wdgc.scrollWidth;
window.frameElement.height = "" + wdgc.scrollHeight;
}});
_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>
Use 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>>' . |
Tracking clicks
To track the clicks, adjust your code snippet to include a listenTo:'click'
directive.
A full, updated code snippet follows:
<!--
Taboola content will load in the <div> element below.
You can use any ID for the <div> - just make sure to update ALL references in the JS (below).
Taboola modules served via GAM are NOT responsive. Style the width of the <div> to match your needs.
-->
<div id="taboola-slot" style="width:<<width>>px"></div>
<!-- Use 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({listenTo: 'render', handler : function(){
var wdgc = document.getElementById('taboola-slot'); // Pass the ID of the <div> container (see above).
window.frameElement.width = "" + wdgc.scrollWidth;
window.frameElement.height = "" + wdgc.scrollHeight;
}});
// (Optional) Code snippet for tracking clicks
// Generates an <img> pixel that uses the GAM URL for tracking clicks.
_taboola.push({
listenTo: 'click',
handler: function (e) {
var i = document.createElement("img");
i.src = "%%CLICK_URL_ESC%%";
}
});
_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>
Sample snippet with actual values
The following code snippet illustrates sample values.
Make sure to fill in your own values, as provided by Taboola.
<!--
SAMPLE ONlY - Use YOUR OWN param values, as provided by Taboola.
-->
<!--
Taboola modules served via GAM are NOT responsive.
Style the width of the <div> to match your needs.
-->
<div id="taboola-slot" style="width:<<width>>px"></div>
<!-- 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({listenTo: 'render', handler : function(){
var wdgc = document.getElementById('taboola-slot'); // Pass the ID of the <div> container (see above).
window.frameElement.width = "" + wdgc.scrollWidth;
window.frameElement.height = "" + wdgc.scrollHeight;
}});
// (Optional) Code snippet for tracking clicks
// Generates an <img> pixel that uses the GAM URL for tracking clicks.
_taboola.push({
listenTo: 'click',
handler: function (e) {
var i = document.createElement("img");
i.src = "%%CLICK_URL_ESC%%";
}
});
_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>
Updated over 2 years ago