Detect AdBlocker Using JavaScript
Last Updated : Jul 1, 2023
IN - JavaScript HTML | Written & Updated By - Pragati
So, in this tutorial we will show you how to detect adblocker using javascript and display message if adblocker is enabled, Adblocker is a software which is used to detect and hide the ads in a website if a user have adblocker installed in his browser.
Then he may not view any ad in any website and this in return loss of ad revenue for website owner who put ads on their website to generate income.
You may also like Block Bad Words Using JavaScript.
CHECK OUT THIS TUTORIAL LIVE DEMO →
To Detect AdBlocker It Takes Only Two Steps:-
- Make a HTML file and define markup and scripting
- Make a js file and define scripting for adblocker
Step 1. Make a HTML file and define markup and scripting
We make a HTML file and save it with a name detect_adblocker.html
<html> <head> <script type="text/javascript"> var adblock = true; </script> <script type="text/javascript" src="adframe.js"></script> <script type="text/javascript"> if(adblock) { alert("Please Disable AdBlocker To View The Page"); document.getElementById("wrapper").style.display="none"; } </script> </head> <body> <div id="wrapper"> <p>You Webpage Content</p> </div> </body> </html>
In this step we create a variable called adblock and set it to true and add 'adframe.js' file. Adblocker working is very simple it detects any external file having 'ad' or ad related phrase in file name then it block `that file or url from running in that webpage.
So in our case if adblocker is enabled then it blocks our 'adframe.js' file and remain our adblock variable to true and if the adblock is disabled then our 'adframe.js' file will run and our adblock will become false.
After then we check if our adblock variable value is true then display error message and hide the webpage content.You may also like Detect URL In Input Using jQuery.
Step 2. Make a js file and define scripting for adblocker
We make a js file and save it with a name adframe.js
var adblock = false;
In this step we simply set adblock variable value to false if this file run then the value of adblock become false it means adblock is not installed or disabled. You may also like Detect And Redirect To Mobile Site Using PHP.
Thats all, this is how to detect adblock using JavaScript. You can customize this code further as per your requirement. And please feel free to give comments on this tutorial.
I hope this tutorial on detect adblocker JavaScript helps you and the steps and method mentioned above are easy to follow and implement.