Agiel Triono: Jquery Notifikasi Adblock Untuk Blogger

Jquery Notifikasi Adblock Untuk Blogger


Bagi orang mungkin iklan memang mengganggu di saat ingin membaca artikel bahkan ingin menonton video secara streaming misalnya saja di youtube , kadang iklan seperti kurang familiar dengan mata pengunjung sehingga wajar mereka memasang ekstensi adblock di browser untuk menghindari iklan yang tampil atau menyembunyikan iklan yang mengganggu.

Namun hal itu ternyata memberatkan juga bagi si pemilik blog karena apabila adblock aktif , otomatis karena iklan tidak tampil saat halaman di muat maka publisher tidak akan mendapat tayangan terhadap iklan tersebut. Apabila ini terjadi secara terus-menerus , maka pihak yang punya blog lah yang sudah pasti akan rugi, sadis nya apalagi jika dari 60% pengunjung anda menggunakan adblock.

Karena adanya ekstensi adblock maka muncul lah beberapa solusi salah satunya ini notifikasi adblock. Untuk bentuk dan bagaimana penerapan nya mungkin berbeda-beda tergantung dari si publiher nya sendiri , ada yang mengaruskan mematikan adblock dengan lement fullscreen, ada juga yang memang hanya memberitahu saja tanpa mengharuskan mematikan adblock.
Namun cara demikian kadang kurang berhasil , karena adblock sendiri selalu update tiap hari , di tambah user yang kian hari semakin banyak menggunakan adblock, bagi blogger ini seperti menangkap angin.hehe..

Khusus anda yang memang hobi di blogger dan memang sedang mencari cara untuk memberikan perhatian terhadap iklan yang ada di blog kepada pengunjung maka, saya sudah membuat Notifikasi Adblock metode nya adalah hanya mengingatkan pengunjung jika blog anda terdapat iklan seperti iklan adsense atau iklan media.net cara ini mungkin tidak secara keseluruhan namun perlahan tapi tanpa mengganggu si pengunjung untuk memaksa mematikan adblocker akan lebih efektif, inti nya yang terpenting anda memberitahu tanpa harus kehilangan visitor pada blog itu inti nya.

Penerapan

Mudah anda tinggal cari kode <head/> diatas tambahkan kode di bawah tambahkan tag kondisional bila diperlukan.

<script type='text/javascript'>
//<![CDATA[
// Adblock
$(function(){var a=document.createElement("script");a.type="text/javascript",a.async=!0,a.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js",a.onerror=function(){var a,t,e,o;e=$(".adscontainer,.adsbygoogle"),o='<div class="fxblocker" style="background:'+([]+(a=["#6dd5fa","#4286f4","#f5af19","#f12711","#20e3b2","#29ffc6","#0cebeb"])[Math.floor(Math.random()*a.length)])+'"><p>'+([]+(t=['If you found this can make you happy you\'ll have to consider supporting US by whitelisting This site on your adblocker. <i class="fa fa-heart"/>','See, you didn\'t turning off your adblocker yet ? please disable it to keep this thing\'s up running.tks','As you can see you just turn on adblocker again, it seems we can\'t stay last longer. if we didn\'t receive any revenue from our advertiser.'])[Math.floor(Math.random()*t.length)])+'</p></div>',$(e).before(o),window.adblock=!0};var e=document.getElementsByTagName("script")[0];e.parentNode.insertBefore(a,e)});
//]]>
</script>
<!-- Kode iklan otomatis disini -->

Kode di atas mempunyai variable array secara acak pada value ["#6dd5fa","#4286f4","#f5af19","#f12711","#20e3b2","#29ffc6","#0cebeb"]
kode itu adalah kumpulan warna yang di pisahkan dengan koma, jadi warna tersebut akan otomatis di terapkan sebagai background dari element adblock anda, jadi jika anda bosan dengan warna A maka otomatis warna akan di ganti secara acak.

Berkaitan dengan array variabel teks di bawah ini :

['If you found this can make you happy you\'ll have to consider supporting US by whitelisting This site on your adblocker. <i class="fa fa-heart"/>','See, you didn\'t turning off your adblocker yet ? please disable it to keep this thing\'s up running.tks','As you can see you just turn on adblocker again, it seems we can\'t stay last longer. if we didn\'t receive any revenue from our advertiser.']

Variable array tersebut adalah bagian informasi dari elemen yang di pilih secara acak seperti variabel warna, jadi user dapat membaca kata-kata atau informasi anda dengan teks yang berbeda hampir sama dengan JSON.

Untuk tambah keren tambahkan CSS di bawah ini, tempelkan di bagian </b:skin>

/*FXBLOCKER*/
.fxblocker{background:#9C27B0;color:#fff;padding:15px 10px;position:relative;width:100%;height:auto;margin:0 auto;cursor:pointer;pointer-events:none;transition:all .3s}
.fxblocker p{margin:1em 0}
.fxblocker p img{display:inline-block}

Simpan template anda.


Nah, itu dia cara memasang Notifikasi Adblock di blogger.
Dan postingan ini saya rasa cukup lah ya ,apabila ada yang kurang dengan cara di atas silahkan berikan saran di komentar.
Previous Post Next Post