Cara Membuat Anti Adblock Pada Blogger Seperti Arlinadzgn Terbaru!

Pusing dengan pengunjung yang menggunakan Adblock yang menyebabkan penghasilan kita di blog menjadi berkurang padahal hasil yang kita dapat dari blog tidak terlalu besar, mudah-mudahan dengan script atau tutorial ini bisa sedikit membantu ya sob.

Tampilan dari Anti Adblock kali ini berbeda dari yang sebelumnya sob, kali ini ada sedikit bounce pada effect saat keluar pop-up nya.
Atau kalian bisa lihat sendiri di demo dibawah artikel.

Untuk tutorialnya sangat sederhana dan tidak jauh berbeda dari yang sebelumnya, dan untuk kalian yang sudah memasang adblock seperti arlina sebelumnya tolong dihapus dulu yah biar tidak ada kegagalan atau error saat penerapannya.

Oke kita lanjut aja ke cara pasang anti adblock nya gimana :

Buka Blogger > Tema > Menuju halaman Edit HTML, Cari kode </head>

Lalu letakan kode dibawah ini tepat diatas kode </head>

<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>

Jika sudah, tambahkan lagi kode dibawah ini tepat diatas atau sebelum kode </body>

<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>

Selesai deh, simpan perubahan dan coba lihat hasilnya.

Untuk kalian yang ingin melihat seperti apa hasilnya silahkan ke DEMO

Dan untuk kalian yang sudah memasang JS Adsense seperti dibawah ini tolong segera dihapus ya, karena di script di atas tadi sudah termasuk JS Adsense.

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

Atau ini

<script type='text/javascript'>
//<![CDATA[
(function() { var ad = document.createElement('script'); ad.type = 'text/javascript'; ad.async = true; ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'; var sc = document.getElementsByTagName('script')[0]; sc.parentNode.insertBefore(ad, sc); })();
//]]>
</script>

Oke sekian dulu artikel Cara Membuat Anti Adblock Pada Blogger Seperti Arlinadzgn Terbaru!, Semoga bermanfaat ya!