Detect AdBlock with JavaScript
If you would like to know whether a visitor on your website is blocking Google AdSense and other online advertising networks or not, you can easily do that with the help of some JavaScript. Here are some approaches:
- You can check for the existence of window.
google_jobrunner
after the page has finished loading. We are using setTimeout to take care of asynchronous Google AdSense that may not load immediately.
<script>
window.onload = function() {
setTimeout(function() {
if ( typeof(window.google_jobrunner) === "undefined" ) {
console.log("ad blocker installed");
} else {
console.log("no ad blocking found.");
}
}, 10000);
};
</script>
- The other more popular approach is that you create a file called
/ads.js
in your server and inside that file, set a variable as false. AdBlockers routinely block JavaScript files that have.ads
in the name and hence, the variable will not be set if the ad blocker is active.
// Put this in the ads.js file
isAdBlockActive=false;
Now put this somewhere inside the HTML of your main web page.
<script>var isAdBlockActive=true;</script>
<script src="ads.js"></script>
<script>
if (isAdBlockActive) {
console.log("The visitor is blocking ads");
}
</script>
- Here’s another option that works with the new Asynchronous Responsive Google Ads.
window.onload = function () {
setTimeout(function () {
var ad = document.querySelector('ins.adsbygoogle');
if (ad && ad.innerHTML.replace(/\s/g, '').length == 0) {
ad.style.cssText = 'display:block !important';
ad.innerHTML = 'You seem to blocking Google AdSense ads in your browser.';
}
}, 2000);
};
In the new format, the ads are inserted using the INS tag. The snippet checks for the length of the tags that are contained inside the INS tag. If it is 0, Google Ads were blocked and the user is shown a custom message.
We also need to set the CSS display property as block as AdBlock may be blocking ads with the adsbygoogle
class by simply hiding them on the screen with CSS.
Amit Agarwal
Google Developer Expert, Google Cloud Champion
Amit Agarwal is a Google Developer Expert in Google Workspace and Google Apps Script. He holds an engineering degree in Computer Science (I.I.T.) and is the first professional blogger in India.
Amit has developed several popular Google add-ons including Mail Merge for Gmail and Document Studio. Read more on Lifehacker and YourStory