Cara Membuat Notifikasi Disable AdBlock

Sobat blogger, Kareel Blog kali ini akan berbagi panduan Cara Membuat Notifikasi Disable Adblock menggunakan bahasa pemrograman javascript. Sebelum ke topik artikel ini mari kita bahasa dulu definisi dan penjelasan tentang AdBlock.

Apa itu AdBlock?

AdBlock merupakan salah satu cara efektif untuk membantu pengguna dalam memblokir iklan yang sering muncul dan sangat mengganggu saat sedang mengakses sebuah situs di internet. Dengan menggunakan fitur ini, pengguna dapat menikmati konten di situs kesayangan tanpa perlu terganggu oleh konten iklan yang sering bermunculan.

Saat mengaktifkan fitur adblock di device, beberapa situs dapat mendeteksinya sehingga konten di situs tersebut tidak muncul. Nah, jika Anda pernah mengalaminya Anda dapat mematikan fitur Adblock tersebut di ekstensi yang digunakan sebelum mengakses situs.

Lalu bagi pengguna Google Chrome, adblock dapat dimatikan dengan mudah. Pengguna tidak perlu menggunakan aplikasi pihak ketiga untuk melakukannya.

Cara Nonaktifkan Ekstensi AdBlock Pada Google Chrome Browser

Secara default, aplikasi Ekstensi Google Chrome sebenarnya tidak memiliki fitur memblokir pesan untuk melindungi pengguna saat sedang berselancar di internet. Untuk menggunakan fitur ini, pengguna Google Chrome harus menginstal ekstensi Adblock tambahan ke dalam komputernya.

Ada banyak sekali Adblock di Google Chrome Web Store, yang kadang-kadang memiliki kemampuan pemblokir yang berbeda-beda. Namun, untuk mematikan semua adblock tersebut dapat menggunakan satu buah cara. Pengguna dapat mengikuti langkah-langkah cara mematikan Adblock di Google Chrome Dekstop berikut ini:

1. Buka aplikasi Google Chrome yang terpasang di komputer/dekstop
2. Ketikan chrome://extensions/ pada kolom URL dan tekan tombol Enter di keyboard 
3. Setelah masuk ke pengaturan ekstensi di Google Chrome, cari ekstensi yang ada embel-embel Adblock dengan nama berbeda-beda tentunya 
4. Jika sudah ketemu, maka hilangkan centang pada opsi Enable untuk menonaktifkannya 
5. Atau, pengguna dapat menekan ikon tong sampah untuk menghapusnya dari komputer, dan tekan tombol Remove jika muncul konfirmasi 
6. Coba buka halaman web yang semula diblokir

Cara diatas itu dikhususkan untuk pengguna google chrome browser sebagai pengunjung, lalu Bagai mana cara pengguna blogger supaya visitor melihat notifikasi dari script yang kita pasang? simak langkah Cara Membuat Notifikasi Disable Adblock untuk pengguna blogger.

Cara Membuat Notifikasi Disbale Adblock Pada Blogger

Adapun langkahnya sebagai berikut;

1. Login ke Dasboard Blogger
2. Cari pilih dan klik menu Tema, maka akan terlihat tema yang sedang dipakai. Disini sobat pilih dan klik Tombol Edit HTML
3. Di menu Edit HTML sobat arahkan kursor ke kolom kode HTML template lalu tekan tombol CTRL + F (sering disebut pencarian) ketik kode "</body>" tanpa petik dua diatas langsung tekan enter
4. Jika sudah ketemu pencarian kode penutup TAG body "</body>" sekarang Copy kode dibawah ini lalu pastekan tepat diatas kode </body> sebagai
   Contoh:
   <!-- Kode HTML Notifikasi Disable AdBlock -->
   </body>
   Kode HTML Notifikasi Disbale Adblock yang harus Copy dan Pastekan dibawah ini:
   

   <style>.showadblockKAREEL{display:none;background:rgba(0,0,0,0.85);padding:0;position:fixed;bottom:0;left:0;top:-100px;right:0;z-index:1000;opacity:1;visibility:visible;height:auto;} .showadblockKAREEL svg {width:100px; height:100px} .showadblockKAREEL svg path {fill:#fff} .showadblockKAREEL .isiNoscript{background:red;color:#fff;position:absolute;text-align:center;padding:0 30px 30px 30px;margin:auto;top:30%;left:0;right:0;font-size:1.5rem;font-weight:400;line-height:1.5em;font-family:monospace;max-width:670px;box-shadow:0 20px 10px -10px rgba(0,0,0,0.15);border:15px solid rgba(0,0,0,.07); overflow:hidden; transition:all .6s cubic-bezier(.25,.8,.25,1); -webkit-transform:translateZ(0); transform:translateZ(0); backface-visibility:visible; transition:all .2s ease-in-out,visibility 0s; transform-origin:bottom center; pointer-events:auto; transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1); opacity:1; animation:KareelBBTWobble .5s; -moz-animation: KareelBBTWobble .5s; -webkit-animation:KareelBBTWobble .5s; -o-animation:KareelBBTWobble .5s} .showadblockKAREEL .isiNoscript:hover{box-shadow:0 20px 10px -10px rgba(0,0,0,0.2);} .showadblockKAREEL .isiNoscript h4, .showadblock .isiNoscript .judul{display:inline-block;background:rgba(0,0,0,.07);padding:5px 25px 15px 25px;font-size:2.2rem;font-weight:500;margin-bottom:20px}</style>
   <div class='showadblockKAREEL'><div class='isiNoscript'><span class='judul'>Disable AdBlock</span><br/><svg viewBox='0 0 24 24'><path d='M3,3H21V21H3V3M7.73,18.04C8.13,18.89 8.92,19.59 10.27,19.59C11.77,19.59 12.8,18.79 12.8,17.04V11.26H11.1V17C11.1,17.86 10.75,18.08 10.2,18.08C9.62,18.08 9.38,17.68 9.11,17.21L7.73,18.04M13.71,17.86C14.21,18.84 15.22,19.59 16.8,19.59C18.4,19.59 19.6,18.76 19.6,17.23C19.6,15.82 18.79,15.19 17.35,14.57L16.93,14.39C16.2,14.08 15.89,13.87 15.89,13.37C15.89,12.96 16.2,12.64 16.7,12.64C17.18,12.64 17.5,12.85 17.79,13.37L19.1,12.5C18.55,11.54 17.77,11.17 16.7,11.17C15.19,11.17 14.22,12.13 14.22,13.4C14.22,14.78 15.03,15.43 16.25,15.95L16.67,16.13C17.45,16.47 17.91,16.68 17.91,17.26C17.91,17.74 17.46,18.09 16.76,18.09C15.93,18.09 15.45,17.66 15.09,17.06L13.71,17.86Z'></path></svg><br/>Untuk mengakses situs ini, nonaktifkan atau disable AdBlock di dalam pengaturan ekstensi browser.</div></div>
   <script>
   //<![CDATA[
   // Notifikasi Disable AdBlock pada browser by KareelKun
   var WrapperByID = 'wrapper'; // Ganti sesuaikan dengan warrper selector di blog sobat
   !function(e,t){"function"==typeof define&&define.amd?define(t):"object"==typeof exports?module.exports=t:e.adblock=t()}(this,function(){"use strict";var e={},t=function(){var e=document.createElement("div");return e.id="adcontent",document.body.appendChild(e),e};return e.check=function(e,n){var o=t();setTimeout(function(){var t=0===o.offsetLeft&&0===o.offsetTop;e(t)},n||1e3)},e}); var enabled = document.querySelector('.showadblockKAREEL'); adblock.check(function (active) { if (active) { enabled.style.display = 'block'; document.getElementById(WrapperByID).style.display = 'none'; } }, 100);
   //]]>
   </script>
   

5. Simpan tema

Demikian artikel dari saya Cara Membuat Notifikasi Disable Adblock, Semoga artikel diatas bermanfaat bagi sobat semua. Terima Kasih