This is a post to update the previous post on how to make the notification when AdBlocker detected so that the adsense ads on blogs do not appear.
In the previous post, without disabling AdBlock, notifications can be easily removed with a click on the close button.So there are still many users who ignore this notification and Adblock still burning.
Surely this seemed to me to be in vain.
So in this post, I update notification AdBlocker Adsense so that users really deadly AdBlocker.
When AdBlocker detected, a notification will appear cover page and off page scroll. I change into a Close button page refresh button, so despite the close button is clicked and AdBlocker not disabled then it will refresh the page but the notification will still appear cover page.
After AdBlocker disabled, then when the button × (close) notification is clicked, the page will refresh and certainly Adsense ads will reappear and automatic notifications will not appear.
Please try to access the demo page with AdBlocker
If you want to try it, please copy the code below.
Please copy the CSS code below and save the above
</head><style type='text/css'>
#keepads{position:fixed;bottom:-7000px;opacity:0;transition:all .3s;z-index:100000}
#keep-ads{background:#1C90F3;color:#fff;text-align:center;padding:20px;position:absolute;left:50%;top:25%;margin-left:-25%;font-size:160%;line-height:1.2em;transition:all .3s;width:50%;height:auto;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:2}
#keep-adslayer{position:absolute;bottom:0;left:0;right:0;top:0;background:#000;background:rgba(0,0,0,.9);z-index:1}
#keep-ads h3{margin:0 0 20px!important;font-size:30px}
#keep-ads p{margin:0!important;font-size:18px}
#keep-ads a{color:yellow;text-decoration:none}
#keepads.show{pointer-events:auto;opacity:1;bottom:0;left:0;right:0;top:0;}
.close-keep-ads{position:absolute;top:0;right:0;font-size:24px;font-weight:700;cursor:pointer;width:24px;height:24px;line-height:24px;text-align:center}
.flow{overflow:hidden}
@media screen and (max-width:640px){
#keep-ads{width:80%;margin-left:-40%;top:10%}
#keep-ads h3{margin:0 0 10px!important;font-size:20px}
#keep-ads p{margin:0!important;font-size:16px}
}
</style>Then save your HTML code above the code</body><b:if cond='data:blog.url not in {"http://www.freewaresofts.com/p/whitelisting-freeware-softs-in-your.html"}'>
<div id='keepads'>
<div id='keep-ads'>
<h3>AdBlock Detected!</h3>
<p>Like this blog? Keep us running by whitelisting this blog in your ad blocker.</p>
<p>This is <a href='http://www.freewaresofts.com/p/whitelisting-freeware-softs-in-your.html' target='_blank' title='how to whitelisting'>how to whitelisting</a> this blog in your ad blocker.</p>
<p>Thank you!</p>
<div class='close-keep-ads' onclick='refresh()'>×</div>
</div>
<div id='keep-adslayer'/>
</div>
<script>
//<![CDATA[
setTimeout(function() {
var body = document.body;
var info = document.getElementById("keepads");
var ads = document.querySelectorAll("ins.adsbygoogle");
if ($(ads).height() === 0 ) {
info.className = "show";
body.className = "flow";
}
}, 2000)
function refresh() {
location.reload();
}
//]]>
</script>
</b:if>Change URL http://www.freewaresofts.com/p/whitelisting-freeware-softs-in-your.html this with your blog page URL Whitelist.And make sure your blog is already using any Jquery Library version.
I hope this article be helpful.