Integrating AdButler JavaScript Tags
AdButler’s JavaScript tags are the recommended way to serve ads on your website. They provide built-in tracking, viewability, and support for advanced targeting options like keywords, data keys, and UserDB audience targeting.
When using AdButler's JavaScript tags, most of the integration is handled automatically, though you will have to pass in optional targeting parameters into various parts of our JavaScript tag.
Basic JavaScript Tag (Async JS)
A typical AdButler JavaScript tag looks like this:
<!-- Default Zone [async] -->
<script type="text/javascript">
if (!window.AdButler){
(function(){
var s = document.createElement("script");
s.async = true;
s.type = "text/javascript";
s.src = 'https://servedbyadbutler.com/app.js';
var n = document.getElementsByTagName("script")[0];
n.parentNode.insertBefore(s, n);
}());
}
</script>
<script type="text/javascript">
var AdButler = AdButler || {};
AdButler.ads = AdButler.ads || [];
var abkw = window.abkw || '';
var plc880057 = window.plc880057 || 0;
document.write('<'+'div id="placement_880057_'+plc880057+'"></'+'div>');
AdButler.ads.push({
handler: function(opt){
AdButler.register(188576, 880057, [300,250], 'placement_880057_'+opt.place, opt);
},
opt: {
place: plc880057++,
keywords: abkw,
domain: 'servedbyadbutler.com',
click: 'CLICK_MACRO_PLACEHOLDER'
}
});
</script>
Placing JavaScript Tags on Your Page
To ensure your ads render correctly, place each AdButler JavaScript tag directly where you want the ad to appear on your web page.
Best Practices:
Add the tag inside the
of your HTML, within the exact<
div> or section reserved for the ad placement.
Avoid wrapping the tag in additional containers unless needed for layout.
For responsive designs, place the tag inside a container
<
div> with a defined width and height to maintain layout stability.
<div class="ad-slot">
<!-- AdButler Zone Tag -->
<script type="text/javascript">
// Your AdButler JavaScript tag here
</script>
</div>
Adding Keywords
To target specific campaigns or ad items, pass keywords into your zone tag.
<script type="text/javascript">
var abkw = 'sports,football';
</script>
Add this line before your AdButler tag.
Only campaigns or ad items that match sports or football will be eligible to serve.
Adding Data Keys
Data Keys let you pass structured data, such as user type or product category, for advanced targeting. Use the dataKeys property inside the opt object.
Example:
<script type="text/javascript">
var AdButler = AdButler || {};
AdButler.ads = AdButler.ads || [];
var plc880057 = window.plc880057 || 0;
document.write('<'+'div id="placement_880057_'+plc880057+'"></'+'div>');
AdButler.ads.push({
handler: function(opt){
AdButler.register(188576, 880057, [300,250], 'placement_880057_'+opt.place, opt);
},
opt: {
place: plc880057++,
dataKeys: { "userType": "premium", "region": "west" },
domain: 'servedbyadbutler.com',
click: 'CLICK_MACRO_PLACEHOLDER'
}
});
</script>