adsenseadblock

How to detect Adblock on my website?

I would like to be able to detect if the user is using adblocking software when they visit my website. If they are using it, I want to display a message asking them to turn it off in order to support the project, like this website does.

If you enter to that site and your browser has some kind of adblock software enabled, then the site instead of showing the actual ads shows a little banner telling the users that the ad revenue is used for hosting the project and they should consider turning Adblock off.

I want to do that on my website, I'm using adsense ads on it, How can I do that?

Solution

  • My solution is not specific to a certain ad network and is very lightweight. I've been running it in production for a few years. AdBlock blocks all URLs containing the word "ads" or "prebid". So this is what I did:

    I added a small js file to my webroot with the name prebid-ads.js

    This is the only line of code in that file. Update 2022-04-26 Call this variable something else, see below!

    var canRunAds = true;

    Then somewhere in your page:

    <html>
  <head>
    <script src="/js/prebid-ads.js"></script>
  </head>
  <body>
    <script>
      if( window.canRunAds === undefined ){
        // adblocker detected, show fallback
        showFallbackImage();
      }
    </script>
  </body>
</html>

    Update 2022-04-26 uBlock Origin loads their own ads-prebid.js that reverts the trick described in this answer (proud!), their file contains the following:

    (function() {
    'use strict';
    window.canRunAds = true;
    window.isAdBlockActive = false;
})();

    As a solution just rename your canRunAds variable to something fun, like window.adsAreWithUs or window.moneyAbovePrivacy.

    Discovery and workaround by Ans de Nijs. Thanks!

    Supporting extensions

    Files like ads.js are blocked by at least these adblockers on Chrome:

    Does not work with:

    Privacy Badger