Cara Menambahkan Pesan untuk Mendeteksi Adblock dengan JavaScript

12/02/2015
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.

Cara Menambahkan Pesan untuk Mendeteksi Adblock dengan JavaScript

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 :

Cara Menambahkan Pesan untuk Mendeteksi Adblock dengan JavaScript

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.

Artikel Terkait

Next Article
« Prev Post
Previous Article
Next Post »
Penulisan markup di komentar
  • Untuk menulis huruf bold gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline gunakan <u></u>.
  • Untuk menulis huruf strikethrought gunakan <strike></strike>.
  • Untuk menulis kode HTML gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silakan parse kode pada kotak parser di bawah ini.

Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

No comments

Silakan tambahkan komentar sesuai dengan topik dan komentar dengan link akan dihapus, terima kasih.