Tutorial Lengkap Cara Menambahkan Pesan untuk Mendeteksi Adblock dengan JavaScript

Cara Menambahkan Pesan untuk Mendeteksi Adblock dengan JavaScript - Jika sobat ingin mengetahui apakah pengunjung di blog sobat memblokir iklan Google AdSense atau tidak, sobat bisa melakukannya dengan cara menambahkan kode JavaScript.

Cara kerja dari kode JavaScript yang akan Saya bagikan ini adalah mendeteksi ekstensi Adblock secara otomatis jika pengunjung mengaktifkan Adblock di browser yang mereka gunakan ketika membuka blog sobat dengan memunculkan sebuah pesan khusus. Kode JavaScript ini sudah mendukung format baru dari data iklan Responsive Asynchronous Google Adsense dan memanfaatkan selektor ins.adsbygoogle kemudian menggantinya dengan sebuah pesan ketika Adblock di browser aktif.

Kode ini pun cukup ringan, jadi sobat tidak perlu khawatir jika kode ini akan membebani kecepatan loading blog sobat. Bagi yang ingin mencobanya silakan ikuti langkah berikut :

Cara Menambahkan Pesan untuk Mendeteksi Adblock dengan JavaScript

1. Login ke Blogger > Buka Template Editor > Kemudian tambahkan kode di bawah ini sebelum tag </body>

<script type='text/javascript'>
//<![CDATA[
// Adblock Detected
window.onload=function(){setTimeout(function(){var e=document.querySelector("ins.adsbygoogle");e&&0==e.innerHTML.replace(/\s/g,"").length&&(e.style.cssText="color:rgba(0,0,0,0.5);font-weight:700;font-size:110%;padding:20px;margin:auto;text-align:center;text-decoration:none;display:block!important;background:rgba(0,0,0,0.02);border:1px solid rgba(0,0,0,0.08)",e.innerHTML="Tampaknya Anda memblokir iklan Google AdSense di browser Anda")},2e3)};
//]]>
</script>

Contoh tampilan pesan :

Keterangan :

e.style.cssText="color:rgba(0,0,0,0.5);font-weight:700;font-size:110%;padding:20px;margin:auto;text-align:center;text-decoration:none;display:block!important;background:rgba(0,0,0,0.02);border:1px solid rgba(0,0,0,0.08)"

Kode yang ditandai merupakan CSS tampilan pesan, silakan modifikasi sesuai selera.

e.innerHTML="Tampaknya Anda memblokir iklan Google AdSense di browser Anda"

Ganti kode yang ditandai dengan tulisan sobat.



2. Jika sudah ditambahkan, simpan template kemudian cek blog dan aktifkan Adblock untuk memastikan kode berjalan dengan baik.



Demikian tutorial tentang Cara Menambahkan Pesan untuk Mendeteksi Adblock dengan JavaScript, semoga bermanfaat.