How To Add Anti Adblock Script for blogger [ New Version ]

How To Add Anti Adblock Script for blogger [ New Version ]

What is Adblock? Adblock is an extension on a browser or application to remove ads
on the site, as we know that advertisements on the blog sometimes interfere with
visitors, therefore, internet users start using Adblock extensions

But on the other hand, for a blog writer who implements good advertising from Google
AdSense it is one of the threats of decreasing income from blogs. To overcome this
we need to add the Anti Adblock Script for blogger.

Anti Adblock Script for blogger 

Its function remains the same, namely by giving notifications to visitors to disable the Adblock extension for this site but with a different look. For those who want to install it, please follow the steps below.

How to Install the Latest Version of Anti Adblock Script for blogger

First, open the Blogger dashboard > Click the Theme menu > Click the Edit HTML button and add the code below before the code closing head tag

-->

<style type='text/css'>
/* Animation */
@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}100%{opacity:1;transform:translateY(0)}}
@keyframes rubberBand{from{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,0.75,1)}40%{transform:scale3d(0.75,1.25,1)}50%{transform:scale3d(1.15,0.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}to{transform:scale3d(1,1,1)}}
/* Say Hi to Adblock */
#arlinablock{background:rgba(0,0,0,0.65);position:fixed;margin:auto;left:0;right:0;top:0;bottom:0;overflow:auto;z-index:999999;animation:fadeInDown 1s}
#arlinablock .header{margin:0 0 15px 0}
#arlinablock .inner{background:#e3482d;color:#fff;box-shadow:0 5px 20px rgba(0,0,0,0.1);text-align:center;width:600px;padding:40px;border-radius:5px;margin:7% auto 2% auto;animation:rubberBand 1s}
#arlinablock button{padding:10px 20px;border:0;background:rgba(0,0,0,0.15);color:#fff;margin:20px 5px;cursor:pointer;transition:all .3s}
#arlinablock button:hover{background:rgba(0,0,0,0.35);color:#fff;outline:none}
#arlinablock button.active,#arlinablock button:hover.active{background:#fff;color:#222;outline:none}
#arlinablock .fixblock{background:#fff;text-align:left;color:#000;padding:20px;height:250px;overflow:auto;line-height:30px}
#arlinablock .fixblock div{display:none}
#arlinablock .fixblock div.active{display:block}
#arlinablock ol{margin-left:20px}
@media(max-width:768px){#arlinablock .inner{width:calc(100% - 20px);margin:10px auto;padding:15px}}
</style>

Then add this code before body Tag

<script type='text/javascript'>
//<![CDATA[
// Say Hi to Adblock
function downloadJSAtOnload(){var e=document.createElement("script");e.src="https://cdn.rawgit.com/Arlina-Design/quasar/23207858/arlinablock.js",document.body.appendChild(e)}window.addEventListener?window.addEventListener("load",downloadJSAtOnload,!1):window.attachEvent?window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;
//]]>
</script>

Then click Save theme and finish. This Adblock notification will appear if visitors visit our site and activate the Adblock extension. Be sure to activate the Adblock extension to see the results in the link below

• Result

That's how to install the latest Version Anti Adblock Script for blogger [ New Version ], hopefully, useful and cautious.