Cara Memasang Anti AdBlock Semua Iklan Google (Di Blogger) Ala Radio Konoha
 |
| Ilustrasi gambar anti AdBlock Iklan adsense dibuat oleh radiokonoha.com |
Tahukah kamu AdBlock merupakan ekstensi pada browser yang berfungsi untuk mencegah iklan untuk di tampilkan. Tujuan pemasangan AdBlock sendiri supaya pengunjung blog bisa membaca artikelnya dengan nyaman tanpa gangguan iklan yang mengganggu.
Bagi konten kreator blog ini bisa menjadi ancaman serius, karena itu adalah sumber pendapatan utama mereka untuk menghasilkan uang dari iklan yang di tayangkan pada blog mereka. Jika iklan google adsense mereka tidak tayang di blog mereka, maka seorang blogger akan kehilangan pundi-pundi rupiah dari penghasilan blog mereka.
Karenanya banyak pemilik blog mencari cara bagaimana untuk mengatasi AdBlock Iklan mereka yang tidak muncul pada websitenya.
Pada artikel ini radiokonoha.com akan menjelaskan kepada kamu pemilik blog yang ingin MENERAPKAN ANTI ADBLOCK IKLAN DI WEBSITE/BLOG. Untuk cara kerjanya sendiri nanti Pengunjung akan menerima notifikasi untuk menonaktifkan ekstensi ADBLOCK atau alternatifnya untuk memasukan url blog kamu kedalam whitlist mereka.
Cara Memasang Anti AdBlock Di Blogspot/Blogger
1. Cari kode eksternal google adsense yang sudah kamu pasang di atas kode </head> kodenya biasanya seperti di bawah.
<script async="async" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxx" crossorigin="anonymous"></script>Catatan pada kode xxxx adalah kode id google Adsense kamu.
2. Kemudian pasang kode ini di atas kode </body> untuk menggantikan kode eksternal google adsense yang sudah kamu hapus tadi.
<script>
//<![CDATA[
/* Anti AdBlock By igniel.com */
(function ignielAdBlock() {
let adPub = 'xxxx',
adTitle = 'Matikan AdBlock',
adText = 'Agar blog Radio Konoha tetap berjalan, matikan AdBlock atau masukkan blog ini ke dalam whitelist. Terima kasih.',
ad = document.createElement('script');
ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-' + adPub;
ad.async = true;
ad.setAttribute('crossorigin', 'anonymous');
ad.onerror = function() {
let a = document.createElement('div');
a.className = 'ignielAdBlock';
a.innerHTML = '<div class="adblock-outer"><div class="adblock-inner"><div class="adblock-icon"><svg viewBox="0 0 24 24"><path d="M3 10.5V15.5C3 20.19 6.81 24 11.5 24S20 20.19 20 15.5V7C20 5.62 18.88 4.5 17.5 4.5C17.33 4.5 17.16 4.5 17 4.55V4C17 2.62 15.88 1.5 14.5 1.5C14.27 1.5 14.04 1.53 13.83 1.59C13.46 .66 12.56 0 11.5 0C10.27 0 9.25 .89 9.04 2.06C8.87 2 8.69 2 8.5 2C7.12 2 6 3.12 6 4.5V8.05C5.84 8 5.67 8 5.5 8C4.12 8 3 9.12 3 10.5M5 10.5C5 10.22 5.22 10 5.5 10S6 10.22 6 10.5V15C7.66 15 9 16.34 9 18H11C11 15.95 9.77 14.19 8 13.42V4.5C8 4.22 8.22 4 8.5 4S9 4.22 9 4.5V11H11V2.5C11 2.22 11.22 2 11.5 2S12 2.22 12 2.5V11H14V4C14 3.72 14.22 3.5 14.5 3.5S15 3.72 15 4V12H17V7C17 6.72 17.22 6.5 17.5 6.5S18 6.72 18 7V15.5C18 19.09 15.09 22 11.5 22S5 19.09 5 15.5V10.5Z"></path></svg></div><div class="adblock-wrapper"><div class="adblock-title">' + adTitle + '</div><div class="adblock-text">' + adText + '</div></div></div></div>';
document.body.append(a);
document.body.style.overflow = 'hidden';
};
document.head.appendChild(ad);
})();
//]]>
</script>Pada kode xxxx ganti dengan kode xxxx id iklan google adsense milik kamu.
AdPub wajib di ganti dengan adpub google adsense milik kamu
AdTitle
Nama Judul Anti Adblock Iklan Yang Ingin Kamu Tampilkan Ke Pengunjung.
AdTeks adalah isi teks pada pemberitahuan adblock yang ingin kamu tampilkan ke pengunjung
3.langkah terakhir saatnya kita percantik tampilan pemberitahuan anti AdBlock Iklan di blogger kamu dengan menambahkan kode CSS berikut pada template kamu.
/* Anti AdBlock By igniel.com */
.ignielAdBlock {
background-color: rgba(0,0,0,.75);
position: fixed;
z-index: 999;
}
.ignielAdBlock svg {
height: 8rem;
width: 8rem;
}
.ignielAdBlock path {
fill: #b82929;
}
.adblock-outer {
margin: auto;
max-height: 90vh;
max-width: 640px;
padding: 2rem;
position: absolute;
}
.adblock-inner {
background-color: #f4f4f4;
border-radius: 15px;
overflow: auto;
padding: 2rem;
}
.ignielAdBlock, .adblock-outer {
bottom: 0;
left: 0;
right: 0;
top: 0;
}
.adblock-outer, .adblock-inner {
align-items: center;
display: flex;
display: inline-flex;
}
.adblock-wrapper {
margin-left: 1rem;
}
.adblock-title {
font-size: 2rem;
font-weight: bolder;
line-height: 2.5rem;
}
.adblock-text {
margin-top: 1rem;
}
@media screen and (max-width: 640px) {
.adblock-outer {
max-width: 90vw;
}
.ignielAdBlock svg {
height: 5rem;
width: 5rem;
}
.adblock-title {
font-size: 1.75rem;
line-height: 2rem;
}
}
@media screen and (max-width: 480px) {
.adblock-inner {
flex-direction: column;
}
.adblock-wrapper {
margin-left: 0;
margin-top: 1rem;
text-align: center;
}
}
Nanti jika kodenya sukses terpasang dengan baik seperti tutorial yang saya bagikan. Maka tampilan anti AdBlock di blogger kamu akan seperti gambar berikut.
Jika kamu kurang suka dengan tampilan anti AdBlock tersebut,kamu bisa menyesuaikan sesuai keinginan kamu nantinya.
Memasang Script Anti AdBlock Buat Iklan Selain Google Adsense
Lalu bagaiman jika blog kamu belum keterima adsense, apakah bisa kodenya di pasang ke MGID ALTERNATIF GOOGLE ADSENSE?. Ya tentu saja bisa kode tersebut bisa di pasang ke semua jenis iklan termasuk MGID.
Kamu perhatikan pada kode javascript di atas terdapat kode seperti ini.
ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-' + adPub;
Pada kode yang saya tandai hijau, ubah dengan kode eksternal penyedia layanan iklan yang kamu gunakan.
Contoh jika sudah di ganti dengan kode iklan penyedia layanan iklan yang kamu gunakan jika sudah di rubah.
<script type="text/javascript">
atOptions = {
'key' : '123456789',
'format' : 'iframe',
'height' : 60,
'width' : 468,
'params' : {}
};
document.write('<scr' + 'ipt type="text/javascript" src="http' +
(location.protocol === 'https:' ? 's' : '') +
'://petrolgraphcredibility.com/123456789/invoke.js"></scr' + 'ipt>');
</script>
Jadi itulah tutorial cara membuat anti AdBlock Iklan di blogger kamu dengan mudah dan efisien. Semoga artikel ini membantu.
Sebagai Sedikit disclaimer, kode ini adalah kode anti AdBlock milik igniel.com ya. Jadi kode ini 100%
Rate This Article
Thanks for reading: Cara Menerapkan Anti AdBlock Iklan Blogger Versi Radio Konoha, Sorry, my English is bad:)