Cara Memasang Anti Adblock Anime di Blogger - Ganti Gambar Adblock Sesuai Selera

Dloplop - Hallo guys kali ini saya akan membagikan tutorial cara memasang Anti Adblock Anime agar tampilan anti adblock terlihat lebih unik. 

Berikut adalah penampakan anti adblock anime yang saya gunakan, untuk lebih detail kamu bisa mencoba mengaktifkan adblock lalu reload situs ini. 

script anti adblock anime ini sebenarnya saya ambil dari situsnya kak igniel.com "Thanks kak Igniel" saya sedikit modifikasi agar bisa mengganti tampilan adblocknya sesuai dengan selera. Tertarik untuk memasangnya disitus kamu ?

Cara memasang script Anti Adblock Anime di blogger 

Sebelum mengeksekusi alangkah baiknya kamu backup terlebih dahulu Tema yang kamu gunakan untuk menghindari hal-hal yang tidak diinginkan.

Untuk pemasangan Anti Adblock Anime selajutnya kamu Pergi ke halaman blogger klik Tema lalu Edit Html di halaman blogger kamu lalu masukan script berikut sebelum </body>

<script> //<![CDATA[

/* Anti AdBlock Anime By dloplop.eu.org */

(function ignielAdBlock() {

  let adPub = 'xxxx',

  adTitle = 'Selamat Datang',

  adText = 'Mohon matikan adblock untuk melanjutkan pencarian',

  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\"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyiyM1tCyUk991P53IZ0plezPY946fdixtGe90CAOOHGDImVMOD0nIE19wGmlvdtqHN14nBiaPFEtQ9Xmvq2XNgM_C9JLPNlMgARUpLFLD5sa58gg7-Za5dpJrGY4nEzigZ1HM7J9-su67SUsbHprV72Fm3AlJGf2HZ4sIEcu1oTF9sCPBlR5vJLIvdA/s512/3202a787-bfa1-4e14-8e65-e67deab785f7file_488549.webp"></path></img></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>

Setelah selesai memasang script diatas selanjutnya kamu pasang juga script ini simpan DIATAS sebelum ]]></b:skin> atau </style>

/* Anti AdBlock Anime Dloplop.eu.org */
.ignielAdBlock {
  background-color: rgba(0,0,0,.75);
  position: fixed;
  z-index: 999;
}
.ignielAdBlock img {
  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 img {
    height: 10rem;
    width: 10rem;
  }
  .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;
  }
}

Setelah semua dipasang dengan benar lalu Simpan pengaturan tersebut kamu bisa test langsung Anti Adblock Anime dengan cara menghidupkan adblock di browser kamu. 

Jika kamu ingin mengubah tampilannya kamu bisa ubah bagian yang di warnai : 

• Merah : adalah untuk ID iklan kamu.
• Kuning : adalah untuk Text yang akan di tampilkan di Anti Adblock Anime.
• Hijau : adalah untuk mengganti gambar sesuai keinginan kamu format gambarnya sebaiknya menggunakan png transparan. upload terlebih dahulu gambar diblog agar bisa mendapatkan link gambarnya
• Pink : adalah untuk mengubah ukuran gambar yang akan tampil dibagian anti adblock anime

Cukup sekian tutorial cara memasang Anti Adblock Anime di blogger semoga bermanfaat.

Blogger