The struggle between publishers and those who resist displaying ads has been going on for some time now and it is far from over. Users have no way of rendering ad blockers invisible to blogs or websites that display anti-ad blocking messages. Conversely, there is no way for publishers to completely and consistently make their websites immune to ad blockers.

Because of Ad-Blocker extensions, publishers need to find new ways to compensate for lost revenue, either through implementing specific ad reinsertion applications or by installing paywalls.

What is an Ad-Blocker?

AdBlocker is a browser extension that disables the ads in certain webpages by blocking specific scripts and DOM elements. Basically, they are a massive blacklist of which files should not be loaded, or which domains should not load files from.

When you open a website, your adblocker will look at whether there are any blacklisted JavaScript files (for Google’s ads -adsbygoogle.js ) and it will block these scripts from loading and as a result, the ads will not be displayed. View popular block list

How to Detect an AdBlocker?

By implementing a small bait script is the simplest way of knowing a user has an adblocker. If you put a div element with **ads **class name then the adblocker will stop it from rendering. We can use this to our advantage by using another div with a distinctive identifier.

HTML

<div id="notify">
    <div class="ads">
    </div>
</div>

CSS

.ads {
   width: 1px;
}

We can write a script using JQuery to check the width of the element

JavaScript

$(document).ready(function(){
    if($("#notify").width() > 0) {
        alert('No AdBlocker');
    } else {
        alert('AdBlocker Detected');
    }
});

#javascript #programming