Membuat Notifikasi Untuk Pengguna Adblocker Adsense

Bagi pengelola blog, iklan merupakan salah satu sumber yang sanggup memperlihatkan dorongan untuk terus menulis konten yang mempunyai kegunaan untuk pembaca, dan sebagian lain untuk keperluan pembayaran hosting (jika memakai hosting) ataupun untuk menyewa domain.

Namun tidak sanggup kita pungkiri, banyak pengelola blog yang terlalu berlebihan dalam memasang iklan dengan maksud semoga menerima lebih banyak penghasilan. Tentu saja hal ini sanggup mengganggu kenyamanan para pengunjung blog.

Dengan begitu kita tidak sanggup menyalahkan para pengguna internet memakai Adblocker untuk kenyamanan mereka dalam berselancar di dunia maya. Adblocker sanggup mematikan iklan di blog sehingga iklan tidak muncul dan tidak mengganggu pengunjung blog.

Namun kalau kita sebagai pengelola blog tidak memasang iklan secara berlebihan sehingga tidak mengganggu pengunjung dalam membaca konten, tentu saja dengan adanya Adblocker akan menghambat pengasilan dari iklan yang dipasang di blog.

Untuk itu, kita perlu menciptakan notifikasi untuk pengguna Adblocker untuk mematikan Adblocker di blog kita, siapa tahu iklan yang muncul memang konten yang dicari pengunjung. Kita perlu menjelaskan bahwa kita tidak memasang iklan secara berlebihan atau menjebak pengunjung untuk mengklik iklan, untuk itu kita meminta kesediaannya kepada pengunjung untuk mematikan Adblocker di blog kita alasannya ialah iklan di blog kita tidak mengganggu mereka.

Nah kali ini kita akan memasang notifikasi untuk pengguna Adblocker untuk iklan Adsense untuk memasukan blog kita ke dalam whitelist Adblock mereka.

Ketika seorang pengunjung memakai Adblocker, maka otomatis iklan Adsense tidak muncul. Jika iklan Adsense tidak muncul maka notifikasi Adblocker akan muncul di bab bawah blog ibarat pada gambar di bawah ini.



Untuk demonya silahkan coba saluran blog Kompi Ajaib ini dengan memakai Adblocker.

Jika Anda ingin mencoba memakai notifikasi Adblocker untuk iklan Adsense ini, silahkan ikuti langkahnya di bawah ini.

Silahkan simpan arahan CSS di bawah ini di atas arahan </head>

 <style>
 #keep-ads {
   background: #1C90F3;
   color: #fff;
   padding: 10px 20px;
   position: fixed;
   bottom: -150px;
   left: 0;
   opacity: 0;
   font-size: 100%;
   line-height: 1.5em;
   transition: all .3s;
   width: 100%;
   height: auto;
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
   z-index: 100000
 }
 
 #keep-ads p {
   margin: 0!important
 }
 
 #keep-ads a {
   color:#fff;
   text-decoration:underline;
 }
 
 #keep-ads.show {
   pointer-events: auto;
   opacity: 1;
   bottom: 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;
 }
 </style>

Kemudian silahkan simpan arahan di bawah ini di atas arahan </body>

 <div id='keep-ads'>
   <p>Like this blog? Keep us running by whitelisting this blog in your ad blocker.</p>
   <p>This is <a href='URL PAGE HOW TO WHITELIST' 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='hidekeep()'>&#215;</div>
 </div>
 <script>
 //<![CDATA[
 setTimeout(function() {
   var isu = document.getElementById("keep-ads");
   var ads = document.querySelectorAll("ins.adsbygoogle");
   if ($(ads).height() === 0 ) {
     info.className = "show";
   }
 }, 2000)
 function hidekeep() {
   var e = document.getElementById("keep-ads").style.display = "none";
 };
 //]]>
 </script>

Silahkan sesuaikan kalimatnya dengan bahasa Anda, kemudian silahkan buat PAGE untuk how to whitelist seperti ini kemudian ganti URL PAGE HOW TO WHITELIST dengan URL Page how to whitelist Anda.

Dan pastikan blog Anda sudah memakai Jquery Library berapa pun versinya.

UPDATED!

Silahkan simak postingan ini untuk updatenya.


Sumber https://www.kompiajaib.com/

Share this post