!!! POST UPDATED 2016-09-28 – With new screenshots adapted for the newest version of Google Tag Manager !!!
More and more people are using some kind of Adblock in order to minimize the amount of ads they see online. According to a recent studie released by Pagefair shows that there are now 198 million active adblock users in the world.
The same study shows that ad blocking grew with 41% globally in the last 12 months.
I started doing some data collection based on this before summer, because people started talking a lot about it back then. I now have data enough (yea, I could blame vacation time too) to draw some conclusions based on it, but also share my implementation with you guys.
Are you interested in knowing how many of your visitors that are using any kind of adblocker while visiting your site?
Even though you maybe not are showing ads on your own site, there is a big chance that you are doing advertisement on other sites, and it is always good to know if your target audience are receiving your ads at all, or not.
What do we want to collect?
In order for us to learn this, we need to push that data into Google Analytics, so that we can refer to it while looking at other data we already collect.
Some quick research shows that one of the most common terms the adblockers are looking for is “ads”. In order to find a generic way that works for everyone, I’m going to run with an external file that I’m uploading to my domain, called ads.js.
The content of this file is very simple, it contains one row, defining a Javascript variable as below.
|
1 |
var canRunAds = true; |
You can find my file, that I am using, right here: dcarlbom.com/ads.js
Using Google Tag Manager to check Adblock usage
Next step is to jump right into Google Tag Manager – of course – and begin to setup the things we need.
First of all, we are going to create a Variable that will read from the dataLayer, as shown below.
We are going to use the key adBlockStatus inside the dataLayer and while setting it up I opted to set the Default Value to ‘inactive’.
With this in place, we assume that an Adblocker is not being used, but can override this value if it is true later on.
Custom HTML Tag to check if the ad is being loaded
Since we need to check if the supposed ad is being shown or not, we can use a simple Javascript to check if the variable we used in ads.js is defined or not.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<script type="text/javascript"> if( window.canRunAds === undefined ){ dataLayer.push({ 'event': 'adBlocker', 'adBlockStatus': 'active' }); } else { dataLayer.push({ 'event': 'adBlocker' }); } </script> |
This is stored as a Custom HTML Tag that fires on All Pages, as below.
So, what’s really happening in the code above? Let’s break it down, piece by piece.
|
1 2 3 4 |
<script type="text/javascript"> if( window.canRunAds === undefined ){ } </script> |
First of all, we are checking the current browser window for a Javascript variable called canRunAds , which we defined in the ads.js file in the beginning.
If canRunAds is not defined, hence being blocked by an active Adblocker, do this:
|
1 2 3 4 |
dataLayer.push({ 'event': 'adBlocker', 'adBlockStatus': 'active' }); |
Push two key:value datasets into the dataLayer.
First of all, we are sending in an event named ‘adBlocker’, we are going to use this in the Trigger later or.
Next, we override the Default Value of adBlockStatus with the value active, because we now know that an Adblocker is active.
|
1 2 3 4 |
} else { dataLayer.push({ 'event': 'adBlocker' }); |
The last part should be pretty obvious. If the first statement is not true, run the code inside else { }.
What we are doing here, is basically just pushing event: adBlocker into the dataLayer, because we want to use that inside the Trigger. This is so that GTM should know that “OK, we have now checked wether or not Adblocker is used”.
Send the data into GA
For the last part, we need to send this data into Google Analytics one way or another. We can use to send it in as an Event, or pass the data in as a Custom Dimension. I am going to show you both versions here.
In order for us to pass this on as a Custom Dimension we need to prepare Google Analytics to receive that data. So first of all we need to set it up.
Jump right into the Admin section of your Property in Google Analytics and hit Custom Definitions and then press Custom Dimension that pops up under it.
Create a new Custom Dimension and give it a proper name, such as Using Adblock. Set the scope to Sessions, because I want to know the Adblock usage on a per session basis.
Take note of the Dimension Index because you are going to need it shortly. In my case, it’s ‘4’.
You can of course also see it in the Custom Dimension Overview.
Enough of that, let’s get back to GTM, shall we? :)
Create a new Tag with the following properties.
- Tag Type: Universal Analytics
- Tracking ID: The Variable containing your UA-identifier, or the UA-XXXXXXX-X itself
- Track Type: Event
- Category: Adblocker
- Action: {{DL – adBlockStatus}} (value retrieved from the dataLayer)
- Label: {{Page Path}}
- Non-Interaction Hit: True (we don’t want this to count as a non-bounce)
Then, navigate to More Settings and Custom Dimensions. Set the Index Value to the Custom Dimension Index inside Google Analytics (4, in my case), and the Dimension Value to {{DL – adBlockStatus}}.
Under Fire On, we are going to use the event we are pushing into the dataLayer as a trigger, like this.
This will now not only send data into Google Analytics on what pages are being loaded with Adblockers, but also opens up for further analysis using the data as a separate dimension to combine with all other data as well.
Looking at the data we can now see that 20% of all users to this site was using an active adblocker.
But collecting the data is only the first part, the next step is to dive deeper into the data in order to make any conclusions. We can for instance see, based on sampled demographics data in GA, that the younger the audience, the more inclined are they to block ads.
Now, this is data we can build further upon.
How many people are using adblockers on your site?
Will this track Ghostery as well?
Thanks! Awesome article.
I don’t think this method will work with Ghostery, as it can block Google Tag Manager… Clientside Javascript methods is not failsafe in the world of adblocking.
Thank you very much for this tutorial!
I have some problems with that. The first one is error in Google TagManager. I’ve never used it before.
Type
Unknown Variable Name
Location
Event – AdBlock Status
Description
Unknown variable ‘UA-XXXXXXXX-X’ found in a tag. Edit the tag and remove the reference to the unknown variable.
Anyway I still don’t know what part of script should I add to my webpage?
1. ads.js ?
2. This code?
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({‘gtm.start’:
new Date().getTime(),event:’gtm.js’});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!=’dataLayer’?’&l=’+l:”;j.async=true;j.src=
‘//www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script’,’dataLayer’,’XXX-XXXXXX’);
3. And this?
var dimensionValue = ‘Using Adblock’;
ga(‘set’, ‘dimension1’, dimensionValue);
What to do with that?
4. Something else?
Thank you in advance!
Hey Jacob,
Welcome to the wonderful world of Google Tag Manager :)
I’ll try and break it down in bits and pieces a bit more in order for you to understand the sequences and what’s really happening.
1:
First and foremost, I have placed a small text file on the domain and named it ads.js. You can find mine here https://dcarlbom.com/ads.js
As you can see, it only declares a Javascript variable that we’ll use later on in order to see if that file was read or not. If it was not read, an Adblocker is probably active in the browser.
This file needs to be uploaded to your domain, via FTP or something, so that it’s reachable from http://www.yourdomain.com/ads.js as mine is.
2:
This is the Google Tag Manager Javacript snippet that you need to implement on your site. Are you using WordPress, in that case have a look here: https://dcarlbom.com/google-tag-manager/installing-google-tag-manager-wordpress-complete-guide/
That will outline what you need in order to implement GTM on your WordPress site. Same procedure goes for a non WordPress site, it’s just that you can’t use the option where I’ll show the implementation via a plugin. But the guide also includes a more vanilla approach to the implementation.
When it comes to the Event – AdBlock Status, that’s a Tag defined in Google Tag Manager, that uses information it receives from the other code outlines above. I believe that most parts will start to work once you get the Javascript snippet in place and can start working with the container itself.
Otherwise, just give me a holler and I’ll get back to you.
Good luck.
Best,
Daniel
Thank you for quick response!
1. I uploaded ads.js to my domain.
2. And implemented Google Tag Manager script to my site.
But I still have the same error while I’m trying to publish:
Type
Unknown Variable Name
Location
Event – AdBlock Status
Description
Unknown variable ‘UA-XXXXXXXX-X’ found in a tag. Edit the tag and remove the reference to the unknown variable.
Ufff finally I published it.
I had:
{{UA-XXXXXXXX-X}}
instead of just:
UA-XXXXXXXX-X
Now I have a question where exactly I can find this data about adblock in my GA panel? I mean where is it:
https://dcarlbom.com/wp-content/uploads/Adblock_Users_-_Google_Analytics-1024×151.png
?
Hey Jacob,
You need to change UA-XXXXXXXX-X to your actual Property ID in Google Analytics, otherwise you will not receive any data.
I am using a Custom Report to show to information in that screen shot. This is the template https://analytics.google.com/analytics/web/template?uid=PI9CBIwFTw2Z8l-n6vXCJA
Good luck!
I have error like that:
“Sorry, this custom report cannot be imported in the selected view. Please try choosing another view.”
:(
You probably haven’t set up the custom dimension in Google Analytics for that property. The template uses a Custom Dimension called “Using Adblock” which needs to be setup as well. I’ll send you an email about it.
Hey There,
I am also getting that error message “Sorry, this custom report cannot be imported in the selected view. Please try choosing another view.”
I have created the Custom Dimension called “Using Adblock” is there something else I’m missing?
Same issue here, despite that I’ve set up the custom dimension in Google Analytics for that property I’m getting that message: “Sorry, this custom report cannot be imported in the selected view. Please try choosing another view.”
How long should it take for the data to enter into GA?
Hey Dustin,
It should only take a few hours for you to see the data in GA. It could take up to 24 hours on some occasions.
How do you set up the trigger? I have created the Event, but am having trouble customizing the even trigger so it fires correctly. Please view the attached screenshot shared on Google Drive.
https://goo.gl/QpYwCO
Thanks in advance!
J.John
Another screenshot, if this helps.
https://goo.gl/QqoaLn
What should I write as SOME_DIMENSION_VALUE? I don’t understand.
I have a question, where can I see the table which shows above Excel chart. I’d like see the data ‘using Adblock, users, sessions, pageview’.
Awesome work Daniel. Thanks for the great presentation of this article. I’ll be implementing this on my sites!
I was finally able to get this running on one of my sites. My question is when I look at the Secondary dimension: Using Adblock in Google Analytics under the “All Traffic > Source/Medium” is shows 1. source = 74 and a 2. source = 78. Not sure what these numbers represent. Pageviews or instances because I also see a total of 9 total sessions. Does this mean only out of all the visits to my site only 9 sessions were using Adblock? I can share the report if you think it will help.
Lots of people will not get this to work because you forget to mention you need to create a filter when doing “Under Fire On, we are going to use the event we are pushing into the dataLayer as a trigger, like this.”-step At least I had to!
The filter should be:
Event equals adBlocker
Hey Maximiliam,
You don’t need any filter on that event at all. Only thing you need is for the trigger to fire on the dataLayer event (Custom Event i GTM); adBlocker.
Basically just what you’re stating above, and as my screenshot shows. Minus the filter thingy you’re talking about, that is.
/Daniel
In my tests AdBlockPlus didn’t block “ads.js”. I renamed the file to show_ads.js, now it works :)
Hi, I followed this wonderful guide but got two errors: http://prntscr.com/asjp0t
Can you please check for me if you don’t mind?
@Luca, replace all the ‘quotes’ and commas using your keyboard. I had the same issue, I think it happens b/c the clipboard copies the html.
hello, thanks for the detailed guide. I wanted to ask you if the first step is to add this JS code into our website?
[javascript]
var canRunAds = true;
[/javascript]
Can you please confirm that without this the tag won’t work? Also, where on the website shall we place that code?
thanks again!
Hey Luca,
sorry for the late reply.
You need to place the text:
var canRunAds = true;
into a single textfile named “ads.js” and place in or your domain so that it’s reachable via http://www.yourdomain.com/ads.js
If you already DO run ads on your domain, you can target them instead for using this workaround.
Regards,
Daniel
Hi, I followed your guide but I noticed that the adblock usage was about 50% on my website. I didn’t believe that and started to investigate it more. It seems that when running the check if the window.canRunAds is true or undefined it has not yet the window.canRunAds. This is probably because of the tagmanager is loaded asynchronously and the event is fired before the website is fully rendered and the window.canRunAds is not set yet. Have you also noticed these problems?
Hi Sjaki,
Never run into that myself, but if you change the trigger to only trigger on “Window Loaded”, will that yield another result in your data?
BR Daniel
Hi @Daniel,
I was plugged my spots. I share the integration of the screenshots I’ve done my share in the links below. If something is missing, please can you help me with this?
Dimension => https://i.imgsafe.org/a41e64ae84.png
Event – Adblock Status => https://i.imgsafe.org/a420a3e343.png
html-check-adblock =>https://i.imgsafe.org/a4223669e7.png
variable =>https://i.imgsafe.org/a423e69f9f.png
adBlocker =>https://i.imgsafe.org/a427494ce6.png
Hey Volkan,
In https://i.imgsafe.org/a4223669e7.png you define the “var canRunAds=true” in the actual script in GTM. This has to be executed before GTM loads outside of GTM.
Or, if you DO run ads on your site, I’d rewrite the script to look for these instead.
BR Daniel
just curiously asking may be of topic but, what if i use Anti Ad block script that will ask ad block users to off ad bock and visit sites unless they cant see site, does that will decreases my visitors and page views?
Thanks for the article!
I uploaded ads.js file on the server (localhost).
Despite Adblocker activated, it’s still downloading and JS variable instantiating! I’m trying on localhost, following line of code in my template file:
Could that be the reason that its not in “cloud” / “internet”
Hi,
It should work even on localhost. The hostname really doesn’t matter in this scenario.
What’s the result if you type ‘canRunAds’ in the console while on localhost?
These directions are out of date? My Google Tag Manager doesn’t look like the screen shots.
They have been update now, sorry for the delay.
Hi Daniel,
thank you for this. Unfortunately, something seems to go wrong. All the events I receive are “active” although that’s not correct. I’ve been trying by enabling and disabling AdBlocker so I should get an “inactive” once in while. I’m using the ETT Chrome extension to pick up the events.
I have placed the ads.js in a folder, titled js. That means that the ads.js is to be found at https://www.paulolyslager.com/js/ads.js. Could that be the mistake? I have now also placed it in the root folder. Maybe that will do the trick?
Also, as an extension to your explanation here, I would like to try and add a AdBlocker fallback by using your code. Would that be difficult?
Cheers,
Paul
Just want to know very simple question?
Is there no way to do this without coding ?Like pluign or any widget or third party tool?
Waiting for your reply
Hi there,
I’m also having trouble where all the events I am receiving are being marked as “active”. I don’t have any that records it as “inactive”.
Hi, thanks for this amazing tutorial.
Do you have any idea about the “0” in the result ?
https://prnt.sc/h43en3
Thanks !
Nathan.
Hi Daniel,
Thanks for the tutorial. I took all the steps but looks it doesn’t work for me.
I have GA already and everything had been set up before for tag manager.
Would you please answer the below question:
1) What piece of code do I need to add to the website?
2) Why the event category doesn’t show up in my GA event list.
Thanks