How to Block Adblock

Posted by Martin Angelov on Dec 16th, 2011 in

If you are a website owner, there is a pretty good chance that you rely on some form of advertising to pay for your hosting bills. And if you are lucky enough to have more than a few people visiting your site, you might even be able to pay yourself a supplement to your salary as a compensation for your hard work.

On the other side there are the people that browse the web. They are tired of being bombarded with intrusive advertising, flashy banners and announcements that ruin their browsing experience. They don’t need to be congratulated on being the millionth visitor of your website, they don’t want to shoot five iphones, their only wish is to read what you have to say.

As it is much easier for users to hide ads than for the entire industry to develop advertising ethics, a simple solution quickly emerged.

Then Came Adblockers

The idea of an adblocker is simple – it is a browser extension that blocks or removes advertising on the page. A “solution” is hardly the proper term, however, as it only serves one side – the users. There frankly couldn’t be a better deal for them. These extensions strip everything except the main content of the page, bringing a whole new dimension to the word free – it not only means that they don’t pay; it now means that you don’t get paid too!

Adblocker detected!

Adblocker detected!

This didn’t use to be a big of a problem for website owners – people using ad blockers weren’t that many, and it did make users enjoy browsing your site more. But as the idea for browser extensions exploded in recent years, so did the proliferation of ad blockers. A quick look at the addon directories reveals that ad blockers are the most popular category.

Small sites are most at risk, as they can’t attract the same interest from advertisers and experiment with different formats. With more than 20% of pageviews eaten away by adblockers (these are the number for Tutorialzine), it becomes evident that something has to change.

Miraculously, in the past few weeks there were news that the most popular ad blocker – AdBlock Plus will start allowing acceptable advertising by default. Judging by the uproar this decision brought, a large percentage of people will still opt in for complete blocking of ads or move to a different extension. This means that we as publishers will still have to maneuver around this problem for some time to come. One solution would be to detect the presence of an ad blocker.

How To Detect AdBlock

It is simple – we will use ad blockers’ overzealous interference against it. To block ads such an extension must look for files it believes contain code that shows adverts and prevent them from loading. So the idea is to have a JS file named advertisement.js, which will trigger adblock’s filters, and after this, check whether the file has been loaded.

Here is the file itself:

assets/blockBlock/advertisement.js

jQuery.adblock = false;

That’s all, one line. It creates a new property on the global jQuery object, which we will later look for. If it is undefined, it would mean that this file has been blocked from loading.

assets/blockBlock/blockBlock.jquery.js

(function($){

	if ($.adblock === undefined){
		$.adblock = true;
	}

	$.fn.showOnAdBlock = function(){

		if($.adblock){
			this.show();
		}

		return this;
	};

})(jQuery);

To find out if an ad blocker is present, simply do a conditional check for the $.adblock variable. In the same file, we also define a helper method that will conditionally show an element depending if such an extension is active.

Update: This plugin is also available on Github.

When including the plugin in your site, remember to include the files above after the jQuery library. For the demo page I am also using the confirm dialog replacement from last year to show a pretty dialog box informing the users they should disable adblock to view the page. Here is the code for that:

assets/js/script.js

$(function(){

	if($.adblock){
		$.confirm({
			'title'		: 'Adblocker active!',
			'message'	: 'You are running an ..',
			'buttons'	: {
				'I will!'	: {
					'class'	: 'blue',
					'action': function(){
						// Do nothing
						return;
					}
				},
				'Never!'	: {
					'class'	: 'gray',
					'action': function(){
						// Redirect to some page
						window.location = 'http://tutorialzine.com/';
					}
				}
			}
		});
	}
});

Bang! Now you can tell who is using an ad blocker. This simple method works with most of the popular ad cleaning plugins used at the moment.

What to use it for?

Okay, so you have a snippet of code that would tell you if a person is using an ad blocker or not. What to do now? Some ideas follow. I would not personally use any of the bad or evil ones, but I am obliged to share.

Good ideas

  • Track how many people are blocking ads on your website. If the percentage is high, you can try different (non-banner) types of advertisement;
  • Replace the areas of your website where ads usually go with some useful content;
  • Inform visitors how adblock harms small websites with a heartbreaking personal appeal ala Jimmy Wales.

Bad ideas

  • Show a big message that adblocked users are not welcome (like in the demo);
  • Beg for donations;
  • Replace with ads for affiliate programs that are not blocked by the extension.

Outright evil ideas

  • Set up a paywall for adblocked users;
  • Require a sign-in with facebook or a registration;
  • Redirect to a daily deal website with your affiliate link.

A bright future?

Hopefully the initiative behind AdBlock Plus’ decision to show non-intrusive ads resonates in the community and we will enjoy advertising that is accepted and useful for both publishers and visitors.

What are your thoughts about AdBlock?

Sharing is caring

If you enjoyed this post, feel free to
share it with your friends.

Related Tutorials

  • How to use Geolocation and Yahoo's APIs to build a simple weather webapp
  • TouchTouch - A Touch Optimized Gallery Plugin
  • 5 Lightweight jQuery Alternatives for Mobile Development
  • Timeline Portfolio

45 Comments

  1. TheAL says:

    Very helpful article that I don't see a lot of people tackling right now, likely because some are worried it would make them appear greedy. In reality, it's a real issue. A lot of sites that become very popular take a LOT of time to maintain, and doing so 100% for free is not very fair. Free access to content on a hyper-popular website with the trade-off of one banner ad doesn't seem like asking too much, IMO.

    p.s. I'm use Adblock in Chrome. The small block ads on your right panel aren't too intrusive, I don't think. I'm perfectly comfortable w/ manually adding sites like this to my exemption list.

  2. Ben says:

    Another issue and the reason that I use adblock is because some of the latest viruses come in through advertisements. With the number of sites I go to on a daily basis, adblock is my first line of defense.

    For example, there was a virus recently that would load a small file/cookie/whatever. Nothing happened until you closed your browser and came back in later. That was when the virus was triggered.

    With so many sites serving up ads from advertising companies, it's hard to know. Even if a site is trusted, if that site is using an infected ad server (accidentally), the best intentions in the world won't save me from hours of work or a complete re-install.

    If a website wants to link to another site or service, put up a banner, make a link, and collect that way. Taking the easy way out by injecting advertiser code is the problem. Besides which, not only is that another request while the page loads, you are allowing another company to dictate content on your site. That could have all kinds of consequences to the user and the owner of the site.

    So, want to get paid, include them like I mentioned. Win/win. Your ads don't get blocked and I don't have to worry about what they contain. The situation you provide has the potential to be one sided. You included positive things to do, but there are an equal number that weren't mentioned that could be bad.

    A little food for thought.

  3. Kevin Vandenborne says:

    Want to block adblock? Quit naming class names "ads", "sponsor" or similar stuff, dont name images/urls/html comments/etc.. "ad",.. . It's as simple as that. To avoid getting your ads blocked automatically, you should first do some testing and se eexactly what it is that makes adblock remove your ads. Many, including me don't even block ads that aren't automatically blocked unless they're extremely annoying.

    Figure out what annoys, do some polling, etc. Personally what annoys me is flash ads, words that appear as links in content but that are actually ads. Basically flashy annoying things and stuff that tricks you into clicking it.

  4. Thank you very much for this counter-adblock!

    I'm the owner of a site in portuguese that has a lot (a lot) of visitors from Brazil and not as much ad impressions as it might have. (site on name)

    Since it's a site for kids... do anyone know if some "parental control" software has an ad-blocker included? (and popular in Brazil?)
    If not, I might have another problem I'm not aware...

    Anyways, I will try the ad-blocker you made! Thanks once again!!! Your work is really great!

    Marcos

    ps: sorry about my english!
    ps2: thanks again!!!

  5. Asfo says:

    If you clic on "Never!" and use the "back button" the Popup will never appear again...Is that a bug?

  6. Kyle says:

    AdBlock is great. It makes ugly, unusable websites full of annoyances less ugly and usable again. And, since I will never, ever buy anything from an ad or click an ad on purpose, it removes a lot of the pointless fluff that is completely irrelevant to me anyhow.

    Luckily, this malevolent code of yours can be stopped with NoScript. If your website somehow needed JavaScript to function, and then I was met with an anti-AdBlock message upon enabling JavaScript, I would immediately close the window and be sure never to visit your terrible website ever again.

    TL;DR: Let the users do what they want to and stop acting so entitled.

    1. Ferdy says:

      Well Kyle, and how do you suppose the websites you visit pay their bills then? Actually, I think websites are pretty happy to see a selfish user like you leave.

      1. TheAL says:

        Gonna have to side with Ferdy. I'm all for finding less annoying ways, but people who offer a lot of free stuff need to pay for hosting and other expenses. You can't just expect loads and loads of quality stuff for free if the author doesn't get at least something out of it.

        In the end, expecting free things from people and not thinking they deserve anything in return, is you acting equally entitled.

      2. Tavoidogoido says:

        i totally agree with you i have a file hosting site and the only revenue i get is the ads and the premium user subscription. But my site is practically new so for the moment my only revenue are the ads. I dont open popup when a user downloads the files so my ads arent annoying. But i also agree that some ads are annoying like the ads on the videos of youtube.

      3. R McK says:

        See Ferdy, the revenue conundrum is for the _webmaster_ to solve, not the end user. Like it or not, you can't compel people to look at ads. To try to force them, when they have chosen not to, is utterly wrongheaded and counterproductive.

        This is not a moral issue, it's just the way the web works. The big stick approach won't change people's attitude to your site any better than criminalising customers is working for the film studios. If you cling to an outdated business model, expect to fail.

        1. Deacon says:

          It's not an outdated model. Advertisements are effective everywhere, and the only reason users feel that it is outdated is because they're so up in arms over the days of really bad advertising. Just like there are bad websites, there are bad advertisements.

          You can have a good website AND good advertisements, and you'll be much more effective than a good website with bad advertisements...

          Additionally, you're correct that it's for the webmaster to solve and not the user. I own the website, I make the rules. If you're going to choose to block my only source of income on the site, then I have no use for you viewing my website.

          The fact is, the web works as so. Users want data, users search for data. Webmasters provide data. If the users are going to continuously be greedy and act entitled, then the webmasters can just as easily remove the data.

          Providing code like this allows webmasters both legit and non to continue controlling their websites. Which is why they are webmasters in the first place. Users need to get in line.

    2. Shin says:

      You don't need to buy anything. Just leave the ads where it is. Done. You help the website much.

  7. Eli Mitchell says:

    I see neither the advertisement nor the pop-up dialog box with Opera + Ad Block.

    1. Martin Angelov says:

      Yep, it doesn't work on Opera. As far as I tested, their extension is more permissive than the other adblockers.

  8. violacase says:

    Because some things are possible does not mean we have to DO some things.
    If you respect someone's choice for having an adblocker DO NOT use the techniques you describe. Let them live in piece.

    1. Ferdy says:

      "Let them live in peace" means freeloading of the hard work of website owners. It's not a sustainable model. If you think all users should be able to block all adds, what would be your answer on how website owners get paid? Or do you think they shouldn't?

      1. violacase says:

        Why does everybody think the WWW is meant for making money? And sure there are other ways for making money than just annoying your visitors with unasked advertisement.

        1. Got to agree with you on this one. The net to me may have been made to look like one giant money spinning device but I believe it has the potential for so much more; something not tied in with making money. (although reality often states that if there is money to be made from peace or war, they'll do both).

          1. Ben says:

            Thats not the point, without some kind of money coming into the webmasters pockets, most websites would simply not exist. It dosent mean everyone wants to be insanely rich thanks to the users, its just that not everyone has thousands to spend on a website they have to maintain, just because users cant bear to see a couple ads.

  9. snake says:

    ok, what if adblock blocks the .js file?

    1. Belmor says:

      Then you wont see the content.
      The whole point of the script is that it has to run in order to tell the site that there is no adblock. If the script is blocked the site knows that adblock is running.

      The way to get round this is to let the js file past the filter.
      Simple, let the js run, keep blocking the ads..

      This block works due to overzealous filters.

  10. Damon says:

    Hey guys, if you read through the whole tutorial, most of it is on using the js script to detect the presence of Adblock.

    The author suggested tracking blocked ads as part of your site analytics which I think is a good idea. It just happens the demo he used showcases a big popup.

    Cut him some slack, he didn't tell you to do some terrible to your site visitors using adblock.

  11. AUDIOMIND says:

    Any website that installs this adblocker block will immediately be sent to the black hole here. The end user of your website is king on the web. Forcing them to view ads they have went out of their way to block will send people far, far away from your website quicker than you can press the back button.

  12. This solution is not viable. For example, i use the latest ff with the latest adblock and no additional plugin, but this solution is not working. And if you use noscript, it's more than useless. It's a nice try, but sorry...

  13. Andreas Krey says:

    What the world really needs is an adblocker that simply sets all ad space to invisible (and minimized). Ads still loaded -> Site happy; don't show -> User happy.

    1. Fenrir says:

      In that design users and webmasters are happy, but the advertiser gets the shaft.

    2. Ray says:

      Except that the advertising networks that I've seen pay-per-click, so it would be just as bad.

  14. Jack says:

    This plugin does not work with some of the many ads blockers I tested it with, it did not detect some of them like Kaspersky and did pass the test with flying colors.

    It also is a real bad idea to use this on any website if people not care for your ads they will be really pissed off with your anti ad blocker popup and your losting there views as well. The best way to deal with ad blockers is replacement msg on the space where the ad shows like wowhead.com does I think.

  15. Ryan Doss says:

    If I were to use this I probably wouldn't even put the "Never" button as an option lol.

    I prefer "Flash Block" - It gets rid of the annoying ads : )

  16. Binboy says:

    I use adblock without any list. I block ads myself. So unfortunately your adblocker doesn't work. Too bad :(

  17. You may have done something dirty here Martin! LOL ;-p

  18. simone says:

    i hate ads, but i can see the other side too.
    this could be used as a one time popup when you first visit a site, and ask users to give a chance to your site. i thnk many will put your site on a whitelist and if you keep your ads unobtrusive, they will not put it back, or leave the site.

    ad blockers are good. they keep shameless animated ads at bay.

    those sites who have non annoying ads, will be safe.

  19. Kitsune says:

    My thoughts on adblock is quite simple, if it flashes, if it begs for a click it must go, if it's clean and tidy with 3 small lines of text like google text ads, then of course I will welcome them as those are so neat and tidy that they don't make my eyes sore - PLUS google has a limit on how many we can put on our site.

    the number 1 problem I have with ads is there are 6+ advertisements on 1 page that just are all over the place and you can't tell the difference between a advertisement and the content then it has to go!

    similar to TV advertisements... there's a restriction that needs to follow and there should be a board to actually control the methods used so that people don't get scammed or bombarded by people who can't think how to do a real promo for a real business.

  20. Kiran says:

    I appreciate your effort to help site owners but as reader i got virus injected many times by some blogs. Also blocking people, who have adblocker installed is bad idea. People will just move on to another site, unless it is very important to them.

  21. wkeja says:

    Why do you think we use an ad blocker in the first place?!

  22. Rick says:

    Do not block ad-block!
    Providing information is good but do not use advertisement. You won't benefid good from it!

    F U all and i'll figer out ways to block the adblock blocker!
    :@ Arhh! stupidos!

  23. Shahinul says:

    It's not working with my customize adblockers and system host file (where bad sites are blocked as on localhost domain). Anyway I prefer not to surf on sites who have many ads infections if I can not use my 2 adblocking plugins.
    It's not good to have a web page disfigured by ads, heavy loading and nerve stress for surfers. Those ads are bigger problems than adblocker. If they would not exaggerate with ads then adblocker won't be need it.
    There are some sites (common sense ones) where I disabled my adblockers.

  24. OmGz says:

    I found a way to bypass it. just hit "back" on your browser when redirected.

  25. Jason says:

    As a web site owner it costs me around $300 a year for unlimited hosting, then all the hours I put in and the content that I purchase and content I produce. This is all very valueable. I put all this together and give my product away for free. This gets my site more traffic. More traffic generates more money from my ads on the site. I use the money from the ads to buy new and better content for the site. But with the ad blocker in place it really puts a stop to this improvment cycle. Their is not much incentive to invest time and money into making a great product and receiving no return on your investment.

  26. Pascal says:

    Very interesting. AdBlock allowing unintrusive ads is a sign that AdBlockers may after all force a code of ethics on the industry. I wouldn't install an adblocker for small Google Ads, but a screaming skyscraper ad for a trip round the carribean next to an article about the earthquake on Haiti? Seriously?

    On the other hand, people who click "Shoot five iPhones" ads or Millionth-user-ads may not be part of the same demographic that knows about and installs adblock extensions. Or use a browser other than Internet Explorer 7.

    I agree that displaying a message like in the demo would be a very bad idea. People with less technical understanding would a) feel spied on and b) be too pissed for you spying on them to click any ads at all.

  27. AdBlocker says:

    Thanks for your nice demo!

    Now as I know how adblocker detection works,
    I can quite easily disable it by simply allowing the
    adblocker to load the advertisement.js file.

    For example, in AdBlock Plus, I added the filter rule

    @@||tutorialzine.com/*/assets/blockBlock^

    and now the annoying "Adblocker active!" popup is gone :-)

  28. ThePigster says:

    I wouldn't even use an adblocker if there weren't so many annoying ads that autoplay a video or expand when the mouse moves over it. Advertisers have shot themselves in the foot with such annoying ads, and greedy site owners have allowed it, so they are as much to blame.

    I feel bad for small sites with a few simple banners that will lose advertising, but no one is annoyed by those ads enough to download an extension that blocks them. I tried running without an adblocker for a few weeks, and I finally just couldn't take it anymore. The autoplay videos were the worst culprit, and they are very common across the web.

  29. Myron says:

    Until some ethics are brought back to the industry (if there ever were any), I will continue to use AdBlocker. These webmasters don't seem to be aware that they're supporting a corrupt industry by allowing misleading and disingenuous ads on their site. I just started a blog and don't have any ads. Never will. I don't care how much money I'm potentially missing out on. There are other incentives besides money.

  30. Demiurge says:

    Is there way to detect a detector and block it? I found this full disclosure very scared me.

    1. Richard says:

      NoScript. When I visit that site, I get nothing coming up.

Subscribe for the comments on this postAdd Comment

Add a Reply

HTML is escaped automatically. Surround code blocks with <pre></pre> for readability.
Perks:   **bold**   __italics__   [link](http://example.com)