Cara Memasang Anti AdBlock di Blogger Agar Iklan Adsense Tetap Muncul

Cara Memasang Anti AdBlock di Blogger
Pasang JavaScript dan CSS ini Agar Iklan Tetap Muncul di Blog Kamu

Kamu pasti pernah denger AdBlock, kan? Nah, itu tuh ekstensi di browser yang bisa ngeblokir iklan biar gak muncul. Biasanya dipasang supaya kita bisa baca artikel dengan tenang tanpa gangguan iklan.

Tapi, buat para publisher AdSense dan pemilik blog, ini bisa jadi masalah. Soalnya, salah satu cara mereka dapetin duit dari blog adalah lewat iklan. Kalo iklannya gak muncul, berarti gak ada duit masuk. Jadi, perlu ada cara buat ngelawan AdBlock biar iklannya tetep muncul.

Nah, di postingan ini bakal dijelasin gimana cara memasang anti AdBlock di blogger agar iklan adsense tetap muncul dihalaman blog sobat. Nah, nantinya bakal ada notifikasi buat pengunjung agar mau matiin ekstensi AdBlock atau menambahkan URL blog sobat ke dalam whitelist. Biar iklannya tetep tampil dan penghasilan tetep mengalir.

Bagaimana jika pengunjung tidak mau menonaktifkan Anti AdBlock di mesin pencariannya? Tentu postingan artikel atau halaman blog tidak bisa dibaca dan hanya tertutupi oleh pesan notifikasi sampai si pengunjung benar-benar menon aktifkannya.

Nah ini dikenal dengan anti adblock blog, dimana kamu sebagai pemilik blog dapat mengakalinya dengan cara memasang script Java Script dan CSS pada blog kamu agar iklan adsense tetap muncul di laman kamu.

Dengan anti adblock blog inilah si pemilik dan pengunjung blog, keduanya saling memberikan manfaat atau menguntungkan satu sama lain, yap yang dikenal dalam dunia sains itu adalah simbiosis mutualisme.

Berikut Cara Memasang Anti AdBlock di Blogger

Pertama, pilih tema pada dashboard blogger dan edit HTML.

Kemudian cari dan hapus kode adsense di bawah ini pada blog sobat, jika tidak pernah menyimpannya langkah ini bisa dilewat aja:

<script async="async" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxx" crossorigin="anonymous">

Namun, jika pernah menyimpannya dan tidak menemukan kode di atas pada blog sobat, silakan bisa lakukan search dengan cara tempatkan kursor pada kode template secara sembarang, kemudian ctrl+f dan ketikan keyword adsbygoogle.js

Lah bang nanti kalau dihapus kodenya gak muncul iklan dong di blog kitanya. Jangan khawatir, kode ini akan diganti dengan kode JavaScript anti adblock di bawah ini. Tinggal sesuaikan saja dengan nomor publish adsense sobat ya.

Script JavaScript Anti AdBlock

Selanjutnya, silakan simpan kode JavaScript di bawah ini tepat di atas </body>

<script> //<![CDATA[
/* Anti AdBlock By blogmomandbaby.com */
(function momandbabyAdBlock() {
  let adPub = 'xxxx',
  adTitle = 'Nonaktifkan AdBlock',
  adText = 'Agar blog Mom and Baby tetap berjalan, non-aktifkan 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 = 'momandbabyAdBlock';
    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>

Silakan sesuaikan dengan fokus mengedit ketiga bagian poin berikut,

  • adPub, diisi dengan nomor kode publisher Adsense milik anda (pub-xxxx);
  • adTitle, diisi dengan judul untuk notifikasi anti AdBlock (bisa disesuaikan);
  • adText, silakan isi dengan tulisan tambahan untuk keterangan AdBlock itu sendiri.

Kode CSS non-minify anti AdBlock

Setelah menempatkan kode JS di atas, tahap selanjutnya adalah menyimpan kode CSS di bawah ini tepat di atas </style> atau ]]></b:skin> (jika tidak ditemukan search aja kata kuncinya dengan ctrl+f)

/* Anti AdBlock By blogmomandbaby.com */
.momandbabyAdBlock {
  background-color: rgba(0,0,0,.75);
  position: fixed;
  z-index: 999;
}
.momandbabyAdBlock svg {
  height: 8rem;
  width: 8rem;
}
.momandbabyAdBlock 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;
}
.momandbabyAdBlock, .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;
  }
  .momandbabyAdBlock 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;
  }
}

Kode CSS minify anti AdBlock

Kamu bisa mengganti konde di atas dengan menggunakan versi CSS yang sudah diminify di bawah ini.

Baca juga: Manfaat CSS yang Diminify bagi Template Blogger

/* Anti AdBlock minify by blogmomandbaby.com */.momandbabyAdBlock{background-color:rgba(0,0,0,.75);position:fixed;z-index:999}.momandbabyAdBlock svg{height:8rem;width:8rem}.momandbabyAdBlock 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}.adblock-outer,.momandbabyAdBlock{bottom:0;left:0;right:0;top:0}.adblock-inner,.adblock-outer{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}.momandbabyAdBlock 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}}

Dengan cara memasang anti adblock dengan css di blogger ini sangat berguna dan membantu dalam menyesuaikan tampilan. Lalu bagaimana jika tidak digunakan? Maka anti AdBlock tidak akan berfungsi dengan baik.

Baiklah sejauh ini, kamu sudah menerapkan anti AdBlock di blog kamu punya. Dengan demikian iklan adsense pun tetap tampil dan web atau blog kamu berpenghasilan dari penayangan iklan.

Sudah Paham Cara Memasang Anti AdBlock di Blogger?

Bagaimanapun juga memasang anti adblock di blogger ini adalah bentuk salah satu upaya agar blogger memiliki penghasilan dari tayangan iklan di blognya.

Namun, sebagai pengunjung blog mukin akan merasa terganggu jika iklan di blog tersebut banyak sekali bahkan menghalangi isi artikel. Lalu bagaimana agar tidak terjadi kesalahpahaman diantara kedua belah pihak.

Saling menghargai. Pemilik blog jangan egois, tidak boleh memasang semua slot iklan pada blog sitenya. Artinya seperlunya saja, misalkan hanya memasang pada bagian sidebar saja atau di akhir isi postingan.

Dan bagi yang pengunjung, jangan aktifkan AdBlock pada mesin pencariannya karena menghargai pemilik blog sebab jika tidak maka pemilik blog mungkin tidak berpenghasilan. Kalian sebagai pengunjung blog, setidaknya bersikap bijak terhadap karya-karya para blogger.

Itulah artikel singkat mengenai cara memasang anti adblock di blogger yang bisa kami bagikan disini dan untuk informasi tentang tutorial tips blogger terbaru lainnya, kamu bisa mengunjungi halaman blogmomandbaby.com. Jangan lupa untuk share postingan ini agar lebih bermanfaat buat blogger lainnya.