Detect AdBlock Using JavaScript and Show Adblocker Indication in modal popup

24

AdBlocking severely affects those who are running the site by only depending on ads revenue. Here is the way to detect AdBlock with JavaScript and show Adblocker Indication in modal popup using Bootstrap and jQuery.

Following script will detect if user has enabled the AdBlocker in his browser. If user has enabled the AdBlocker, then the AdBlocker will set the height of the  with class ‘adsbox’ to zero/auto.

So when offsetHeight is zero/auto, we will trigger the modal popup to show Indication to the user to disable AdBlocker for our site.

Next I will show you the integration of this How to Detect Ads Blocker On Your Website, and also show you implementation of Adblocker Indication in bootstrap modal popup using Bootstrap and jQuery.

Step 1: Create index.html file with following basic html in it.

Step 2: Add following html markup before end of </body> tag. This markup related to modal popup which will be shown to the user, if user have enabled adblocker in his site.

Step 3: Add this simple CSS to style modal popup.

Step 4: Finally add the following JavaScript, which will detect AdBlocker, and show the modal popup to the user.

 

Leave A Reply

Your email address will not be published.