Detecting Adblock on your WordPress site

Detecting Adblock on your WordPress site

Detecting Adblock on your WordPress site

Loved by some, hated by others, Ad blockers have become an important factor to consider when owning or developing a website. In this article, I’m demonstrating a few techniques which can be used in order to detect Ad blockers on a website or most specifically, a WordPress blog.


Disclaimer

Should you do something against people visiting your site with an ad blocker on? That’s the question many site owners are asking themselves since a few years.

Since the web exists, advertising has been a way for webmasters and site owners to make money. As ads brought lots of money, many people abused the model, displaying video ads, ads blocking contents, popups, etc. Even today, visiting a download site or just watching YouTube videos without an ad blocker is a complete pain. Approximately ten years ago, some people bothered by advertising abuse started to fight back. Ad blockers were born.

Some websites decide to do nothing against ad blockers. People who are using ad blockers aren’t likely to click on ads anyways, so it kinda makes sense. Other websites choose a diplomatic approach, asking their readers to whitelist their site, or make a small donation. And finally, some site owners choose to fight back against what they consider a threat to their revenue, by disabling features to readers who are using an ad blocker.

This article aims to demonstrate a few techniques which can be used to detect ad blockers or hide content from visitors with an ad blocker on. The way you use it on your website is up to you.

Basic JavaScript Adblock detection

The first thing to do is to create a file named adframe.js. This file is using the blacklisted name “adframe” so we’re gonna fool Adblock and make it block the file, mistaking it for a genuine ad. In the file, simply put the following line:

adblock = false;

Now, put the following withing the <head> and </head> tags of your HTML document.
On a WordPress Theme, the head section is displayed in header.php.

<script type="text/javascript">
    var adblock = true;
</script>
<script type="text/javascript" src="adframe.js"></script>
<script type="text/javascript">
    if(adblock) {
          //adblock is installed
    }
</script>

Hiding content from users with ad blockers on

Hiding content from users with an adblocker is definitely easy. The only thing you have to do is to pick up one class blocked by Adblock, and add it to the container of your choice.

In the example below I’ve used the class .bsarocks which is added by BuySellAds around their ad banners:

<div class="bsarocks">This won't be seen by Adblock users.</div>

WordPress plugin

While the code snippets shown above can definitely be useful, if you’re using WordPress, I definitely recommend using a plugin if you’re looking to detect/block Adblock. The main reason for favoring a plugin over a code snippet is that a plugin can be updated by its author as soon as there’s a change in the way Adblock works.

There’s a few plugins out here that specialize in Adblock (and other ad blockers) detection. The most interesting in my opinion is Ad Blocking Detector. Check out the demo on the plugin website. It detects ad blockers pretty well.

 

Ad Blocking Detector gives you the availability to create shortcodes to display alternative content if an ad is blocked by an ad blocker. This is especially interesting if you want to encourage your readers to disable their adblocker on your website in order to support it.

The plugin should be installed through the basic plugin installation procedure, ie. “Plugins” → “Add New” in your WordPress dashboard.

Detecting visitors with JavaScript off

Some users also choose to disable JavaScript by default, to prevent many things such as popups being open, etc. Just in case you don’t know, there’s a HTML tag call noscript which allows you to display a message to users with JavaScript off:

<noscript>
 For full functionality of this site please enable JavaScript.
</noscript>

Which approach should you adopt?

Well, it’s up to you. I personally think that things aren’t all black or all white. Sure thing, ads are an important source of income for web publishers and many websites wouldn’t exist without them. On the other hand, some ads are so annoying that people who use an ad blocker can definitely be understood.

The only sure thing is that, as a website owner, you shouldn’t display “aggressive” ads to your visitors. Pop unders, video or flash ads, etc, in my opinion those should be totally banished from a serious and professional website. On the other hand, I have no problem with related banners ads, as such as the ones you can purchase on BuySellAds.com.

Display number of Facebook fans in full text

Display number of Facebook fans in full text

Display number of Facebook fans in full text

If you have a Facebook page for your website or blog, you might want to display how many fans you have. This snippet will help you to get your Facebook fan count, in full text. Don’t forget to add your page ID on line 2. Your page ID can be found at the address http://facebook.com/yourpagename/info.

<?php
 $page_id = "302807633129400";
 $xml = @simplexml_load_file("http://api.facebook.com/restserver.php?method=facebook.fql.query&query=SELECT%20fan_count%20FROM%20page%20WHERE%20page_id=".$page_id."") or die ("a lot");
 $fans = $xml->page->fan_count;
 echo $fans;
?>
How to Track post views without a plugin using post meta

How to Track post views without a plugin using post meta

How to Track post views without a plugin using post meta

Use the following snippet to track post views on your wordpress blog. The first thing you want to do is add this snippet to the functions.php of your wordpress theme. Follow step 1. and step 2. to track and display the number of views for each post. Updated this snippet from my original post on March 3rd, 2011 to Included a option for Fragment Caching so this snippet will work even on cached pages.

 

WORDPRESS SNIPPET : PHP – FUNCTIONS.PHP

function getPostViews($postID){
    $count_key = 'post_views_count';
    $count = get_post_meta($postID, $count_key, true);
    if($count==''){
        delete_post_meta($postID, $count_key);
        add_post_meta($postID, $count_key, '0');
        return "0 View";
    }
    return $count.' Views';
}
function setPostViews($postID) {
    $count_key = 'post_views_count';
    $count = get_post_meta($postID, $count_key, true);
    if($count==''){
        $count = 0;
        delete_post_meta($postID, $count_key);
        add_post_meta($postID, $count_key, '0');
    }else{
        $count++;
        update_post_meta($postID, $count_key, $count);
    }
}
// Remove issues with prefetching adding extra views
remove_action( 'wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);

Step 1.

This part of the tracking views snippet will set the post views. Just place this snippet below within the single.php inside the wordpress loop.

 

WORDPRESS SNIPPET : PHP – SINGLE.PHP

<>
<?php
          setPostViews(get_the_ID());
?>

Fragment Caching

Note: If you are using a caching plugin like W3 Total Cache, the method above to set views will not work as the setPostViews()function would never run. However W3 Total Cache has a feature called fragment caching. Instead of the above use the following so the setPostViews() will run just fine. Tracking all your post views even when you have caching enabled.

 

WORDPRESS SNIPPET : PHP – SINGLE.PHP

<!-- mfunc setPostViews(get_the_ID()); --><!-- /mfunc -->

Step 2.

The snippet below is optional, so use this if you would like to display the number of views within your posts. Place this snippet within the loop.

 

WORDPRESS SNIPPET : PHP – SINGLE.PHP / INDEX.PHP

<?php
          echo getPostViews(get_the_ID());
?>

( WordPress codex functions, hooks, in this snippet. )

delete_post, wp_head, get_post, get_the_ID, the_ID, add_post_meta, delete_post_meta, get_post_meta, update_post_meta, remove_action, wp,