How To Add Anti AdBlock To Your Website (WordPress, Blogger (Blogspot) & Custom Sites) Included

Disable adblock | img src @haxbabatech

One of the ways you can make money from your website as a webmaster or blogger, is through advertisements displayed by advertisers on your website.

Creating content, developing and maintaining a website usually takes time and money. There is the money for annual or monthly hosting and domain renewals, etc. Hence, webmasters need ways to earn money online in order to continue to create content for the web.

However, a lot of users install adblockers nowadays. This is bad news for webmasters and content creators, as it puts their earnings at risk. Hence, the need for webmasters to find a way to keep advertising revenues on their websites.

In this post, you are going to learn how to detect browsers using adblockers, and how to ad anti adblockers to your website. You can also customize the message of the anti-adblocker and/or choose whether to allow users with adblockers have access to your content or not.

So let us get started without much ado:

Since most people use WordPress than blogger (blogspot), let me first start with WordPress.

How to Enable Anti Adblocker on Your WordPress Website

WordPress as you know, has a lot of plugins that makes life easy for webmasters. There are plugins for almost anything (though not all; winks), therefore, on WordPress, if you search the plugin repository, you can find good anti adblock plugins. Some of them are:

Easy Ad Unblocker: Eazy Ad Unblocker notifies the user about ad blockers like AdBlock, AdGuard AdBlocker, AdBlock Plus, Ghostery, etc.Eazy Ad Unblocker works on Microsoft Edge, FireFox, Google Chrome and Opera browsers. If users have their adblocker on while surfing
the web in these browsers, they will be prompted to switch their adblocker off or whitelist the site they are currently viewing via a modal popup. Users will not be able to view the website content clearly, nor will they be able to view the source of the page they are on, unless they deactivate the adblocker or whitelist the site in their adblocker settings. There will be an option to close the
popup so that they are not locked out of the site completely. It will be in the form of a button marked ‘X’.

Features of Easy Ad Unblocker Plugin for WordPress include:

1. It prevents users from using the site when adblockers are active for them.
2. There is no way to dismiss the popup without deactivating the ad blockers.
3. The users cannot view the source of the page they are on when the plugin is active.
4. The popup background opacity can be adjusted.
5. The user also cannot view or use web developer tools to bypass the popup or view the popup html.
6. The popup auto-scales to the content visible in it.
7. The plugin checks whether ad blockers are on or not, not if the page has ads.
8. The popup’s title, text and opacity are editable. You can also add media such as images, videos and audio clips to the body text. Audio and video are HTML5 based.
9. The admin can configure, from the backend, whether to show a close button in the popup or not.
10. The popup dialog is responsive.
11. The popup can be disabled on individual pages and posts.
12. The popup width can be set for larger devices like iPads and desktop screens from the admin section.
13. The popup style theme can be changed.
14. CSS classes and id attributes are random for defence against ad blockers.
15. Deleting the plugin deletes its data as well.
16. Tested with PHP 8.0 and WordPress 6.1.1

Popup Plugin – On Page Load Popup, Exit Popup, Login Popup, On Click, Sticky Bar, Anti-AdBlock – FireBox: This plugin can be used to create various kinds of popups like exit, login, onclick, onload, onpage, and sticky bars. Very importantly too, you can use it to create anti adblocking messages for your website. You can design everything as you want, and choose the behaviour, display, timing, etc of your popups.

CHP Ads Block Detector: (CHP Ads Block Detector WordPress Plugin) is a WordPress plugin that will detect most of the AdBlock extensions installed on the visitor's browser and show a popup to disable the extension. This plugin restricts the user from accessing the page unless the user disables the extension for your website.

This will work for most of the ads block extension such as Adblock, AdBlock Plus, ghostery, etc.

This plugin will also work for opera built-in ads block extension.

CHP Adblock detector also has a very handy Documentation page to get you started.

One good thing about CHP Adblock detector is that users of custom websites can add a script to their website to enable its functionality. Hence, if you are not using WordPress where you have access to use plugins, you can simply add codes to your web pages to gain the same functionality. Go to this web page to see the required script.

CHP Adblock detector has been tested for the following adblockers: 

Adblock Plus
Adblock
Adguard
Adremover
Adblock for Chrome™
Brave
Ghostery
uBlocker
uBlock
Ultrablock
Privacy Badger
DuckDuckGo
Disconnect
Microsoft Edge AdBlock extension
Firefox Tracking Protection
uBlock Origin
Fair AdBlocker
Hola ad remover
Comodo AdBlocker
Opera Built-in AdBlock extension

CHP Ads Block Detector has the following Features:

It doesn't use any extension library (not even jQuery)

It:

is lightweight

has ability to customize the title
has ability to customize messages
can hide or show refresh and close button
can change style of the popup
can customize own title or message
has custom buttons
has random Class Generator

CHP Ads Block Detector has the following PRO Features:

Button Text Customizable
Overlay Effect Customizable
Dark and Light Theme
Control Body Scroll
Disable plugin for Pages
Disable for WooCommerce Pages
Disable for individual posts or pages
Adjust to theme color
Ability to add custom modal
Completely Random Class Generator Control
Content Wrapper
Modal Animation

AdUnblocker: AdUnblocker plugin detects if Google AdSense (or any other ad network) ads are not running on your site. Ads are usually blocked by ad-blockers (eg AdBlock, AdBlock Plus). A popup shows with a text requesting user to whitelist your website.

Features of the plugin are:

• Does not require any library dependencies (not even jQuery)
• Following WordPress best coding practices
• Super lightweight
• Random class naming to make it harder for AdUnblocker to be blocked
• Random file naming to make it harder for AdUnblocker to be blocked
• Random var naming to make it harder for AdUnblocker to be blocked
• The ability to customize your message across 3 different display layouts
• Message delay in seconds
• Hidden/Unhidden close button on custom message OR close message automatically after a few seconds
• Customise the look and feel of the popup
• Smooth admin panel for an easy and fast setup
• Developed with WordPress best practices in mind
• Support Images and shortcodes (eg: PayPal button)
• Remove settings from database on plugin uninstall
• Works with all popular caching plugins
• Works with SSL
• Fast, non-blocking script loading
• Displays popup even if deleted via Developer Tools

Pro Features of AdUnblocker

• Set your own text for the adblock notice
• Change adblock notice title
• You can show a sticky notice always on the screen unless user whitelists your website
• You can opt for “Strict mode” to hide your entire website until your website is whitelisted
• Message delay in seconds
• Hidden/Unhidden “close button on custom message OR close message automatically after a few seconds.

Ad Inserter: Add inserter is used for displaying ad scripts on your website. While many people may know ad inserter to have the capability to inject and display ads, not everybody knows that it also has the ability to detect and defend the website against ad blocking programmes and software. The ad detection functionality of Ad Inserter is not active by default. In order to use this functionality, you need to set it up for your website.

Setting up anti adblock for WordPress via Ad Inserter

To begin set up, click on the gear icon towards the top right hand corner of the ad inserter interface.

Next, click Add Blocking. Over here, you can make the customizations based on your choice. You can choose to enable anti adblock for all devices or just for desktop, mobile or tablet, or a combination of any of the above. Next, you can choose the action. You can choose a pop up message and customize the message to be displayed to users who have adblocking software enabled on their devices, or you can choose to redirect them to any url of your choice.

You can also choose to delay the action until the user has viewed a specified number of pages, and you can choose a no action period, which is the number of days you would prefer no action to be taken after the initial action.

In the black box beneath the options, write your message. HTML and scripts are supported. Once you are done, you'd need to activate it. To do so, click the activate button at the top right hand corner. This will inject the anti adblock code to your website, and the activate button would then turn green. 

While setting this up in ad inserter, you would be able to choose if the message is dismissible or not by by checking the corresponding box for this when you scroll down to the bottom of the interface.

Once you have set it up correctly, you should be able to see the message in the screenshot above when you or your users visit the website with an anti adblocking software enabled.

How to Enable Anti Adblocker on Your Blogger (Blogspot) & Custom Websites

Like I mentioned earlier, blogger does not allow the use of plugins, so everything you would do here would be custom. You need to be comfortable with making changes to codes to be able to do this.

Recall that while talking about CHP Ad Unblocker above, I mentioned that it has a script for custom websites. For the sake of clarity, let me highlight it here:

One good thing about CHP Adblock detector is that users of custom websites can add a script to their website to enable its functionality. Hence, if you are not using WordPress where you have access to use plugins, you can simply add codes to your web pages to gain the same functionality. Go to this web page to see the required script.

This is also applicable to blogger (blogspot) blogs. If you follow the insertion method available in the given link to their website above for your website (either custom or blogger) it should work fine.

However, I will be showing you another method that works well with Google blogger (blogspot) here. This should also work with any custom website that you have access to modifying its codes.

 On Blogger, head on to Theme. Backup your theme before making changes to it. After you have backed up the theme, click on 'Edit HTML'. 

Click 'Edit HTML'

Now you can make changes to your site's HTML code. Press CTRL + F. This will open the search dialogue. 

Search for the following code: ]]></b:skin>

The following code given for this tutorial is courtesy of allblogthings.com

Just above it, paste the following code:

#abt_noadblocker {
display:none;
}

Now search for </head> just as you did in the step above 

Just above it, paste the following code:

     <script type="text/javascript">
if (document.getElementById("abt_noadblocker") != undefined)
{
}
else
{
alert("We've detected that you're using AdBlocker or some other adblocking software. In order to keep this web-site free, this website is sponsored in part by advertisements.\r\nPlease consider disabling your ad-blocker on this site\r\nif you enjoyed the content, and would like to support future \r\ninformative posts/articles.Thank you!\r\n\r\nClick OK to continue\r\n\r\n");
setTimeout("nag()",12000);
}
</script>

Finally, search for <body> and paste the following code below it:

<script type="text/javascript" src="http://ftp.bauer-power.net/misc/tc/advertisement.js"></script>

Click on "Save" to save the changes.

That was simple right?

This method works for Blogger blogs, Wix websites, Shopify, Tumblr, Ghost, Write.as, Medium, Joomla, Drupal, Textpattern, Weebly or any CMS, blogging tool, site that enables you to manage or edit the HTML. All you have to do is to add the codes to the respective positions. Those that should go into the head tag, and those for the body tag should be apportioned accordingly.

The only downside to this method is that you cannot make it persistent as a webmaster. The user will be able to dismiss the popup by clicking 'Ok', but it will continue to show up after every page visit of your website.

Was this post helpful to you? then don't forget to share it with others so that they can also benefit from it. Follow me on social media for more tutorials and updates.