Mockingbird

Detecting ad blockers

by Federico Nieves

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="http://dmp.retargetly.com/mockingbird/mockingbird.min.js"></script>
		<div class="container1" style="margin:0 auto;width:728px;height:90px;background:#000;">
			<div id="div-gpt-ad-1450125646903-0" style="height:90px; width:728px;">

			</div>
		</div>

		<div class="container2" style="position:absolute;left:0;top:120px;width:120px;height:240px;background:#21589c;">
			<div id='div-gpt-ad-1450221669589-0' style='height:240px; width:120px;'>

			</div>
		</div>
		<div class="container3" style="position:absolute;right:0;top:120px;width:120px;height:240px;background:#21589c;">
			<div id='div-gpt-ad-1450221805127-0' style='height:240px; width:120px;'>

			</div>
		</div>

CSS

html {height:100%;}
	    	body {min-width:590px;min-height:610px;height:100%;position:relative;margin:0;padding:0;}
	    	.msg{font-weight:bold;}
	    	.msg2{color:#FF0000;}
        .cnt3{width:300px !important;height:250px !important;}

JavaScript

mockingbird.adsBlocked({
				containers: [{
					img: 'https://github.com/retargetly/mockingbird/blob/master/example/top_img.png?raw=true',
					link: 'http://retargetly.com/#top',
					title: 'Get me there!',
					replaceContents: true,
					selector: '.container1'
				},{
					// img: '21589c.png',
					// link: 'http://retargetly.com/#top2',
					selector: '.container2',
					msg:'We live from Ads, help us to protect our content by disabling the ad blocker for our site.',
					classes: {
						container:'cnt',
						msg:'msg',
					},
					replaceContents: true,
				},{
					selector: '.container3',
					src:'https://dnzhvivadqvt4.cloudfront.net/setup/test.json',
					classes: {
						container:'cnt3',
						msg:'msg',
					},
					replaceContents: true,
				}],
				popup: {
					title: 'WARNING',
					msg: '<strong>Please</strong> disable your ad blocker',
					buttonLabel: 'Keep browsing',
					type: 'small',
					classes: {
						title: '',
						msg: '',
						container: '',
						exitButton: ''
					},
					exitButton: true
				},
				handler: function() {
					console.log("Ad Blocker detected")
				}
			})
      
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
(function() {
  var gads = document.createElement('script');
  gads.async = true;
  gads.type = 'text/javascript';
  var useSSL = 'https:' == document.location.protocol;
  gads.src = (useSSL ? 'https:' : 'http:') +
    '//www.googletagservices.com/tag/js/gpt.js';
  var node = document.getElementsByTagName('script')[0];
  node.parentNode.insertBefore(gads, node);
})();

googletag.cmd.push(function() {
  googletag.defineSlot('/47388120/test_ad_1', [728, 90], 'div-gpt-ad-1450125646903-0').addService(googletag.pubads());
  googletag.defineSlot('/47388120/test_ad_2', [120, 240], 'div-gpt-ad-1450221669589-0').addService(googletag.pubads());
  googletag.defineSlot('/47388120/test_ad_3', [120, 240], 'div-gpt-ad-1450221805127-0').addService(googletag.pubads());
 ...