Monday, November 18, 2024

Memasang Script Anti Adblocker (Adblocker Detector) Di Blogger

Memasang Script Anti Adblocker (Adblocker Detector) pada Blogger

Pernahkah kalian merasa kesal ketika sudah bekerja keras membuat konten yang bagus, tetapi penghasilan dari iklan malah tidak maksimal? Kalau iya, kalian nggak sendirian. Banyak dari kita, pemilik website atau blogger, menghadapi tantangan ini. Salah satu penyebabnya adalah penggunaan adblocker oleh pengunjung. Adblocker adalah ekstensi atau perangkat lunak yang memblokir iklan di situs web. Ini memang membantu pengguna menikmati pengalaman berselancar tanpa gangguan. Namun, di sisi lain, pemilik website kehilangan salah satu sumber pendapatan utama mereka.

Sebagai solusinya, banyak dari kita mulai menggunakan script anti adblock atau adblock detector.

Sebagai blogger, tentu kita ingin penghasilan iklan berjalan lancar. Iklan membantu kita tetap produktif dalam membuat konten. Sayangnya, semakin banyak pengguna yang menggunakan adblocker, potensi pendapatan jadi menurun drastis. Bayangkan, iklan yang sudah diatur dengan hati-hati agar tidak terlalu mengganggu, malah tidak terlihat sama sekali. Tentu ini cukup merugikan. Di sinilah script anti adblock menjadi penting. Dengan script ini, kita bisa memberi pengunjung pengertian bahwa iklan adalah bagian dari ekosistem website.

Script anti adblock adalah kode yang bisa kamu tambahkan ke website untuk mendeteksi apakah pengunjung menggunakan adblocker. Ketika adblocker terdeteksi, script ini biasanya akan memberikan peringatan atau meminta pengunjung menonaktifkan adblock mereka. Peringatannya bisa bermacam-macam, seperti popup sederhana atau pesan yang menyarankan mereka mendukung website dengan mematikan adblock. Beberapa bahkan membuat konten tidak bisa diakses sepenuhnya sebelum adblocker dinonaktifkan.

Solusi di tulisan ini didapat dari sumber youtube dan artikel berikut. Cara peng-aplikasiannya:

Pertama, buka menu Theme - Edit HTML pada blogger, lalu temukan syntax </head>. Diatas syntax </head> tersebut, copy-paste-kan kedua script berikut:

<style>
    /* Pop-Up Box by Fineshop */
    .popSc {
      position: fixed;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 20px;
      background: rgba(255, 255, 255, 0.1);
      z-index: 99980;
      -webkit-backdrop-filter: blur(10px);
      backdrop-filter: blur(10px);
      display: flex;
      justify-content: center;
      align-items: center
    }

    .popSc.hidden {
      display: none
    }

    .popSc .popBo {
      position: relative;
      background: rgba(255, 255, 255, 0.8);
      -webkit-backdrop-filter: blur(10px);
      backdrop-filter: blur(10px);
      max-width: 400px;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      padding: 30px;
      border-radius: 20px;
      box-shadow: 0 5px 25px rgb(0 0 0 / 20%)
    }

    .popSc .popBo svg {
      display: block;
      width: 50px;
      height: 50px;
      fill: none !important;
      stroke: #08102b;
      stroke-linecap: round;
      stroke-linejoin: round;
      stroke-width: 1.5
    }

    .popSc .popBo h2 {
      margin: 10px 0 15px 0;
      font-size: 1.2rem;
      font-weight: 800;
      color: #08102b
    }

    .popSc .popBo p {
      margin: 0;
      line-height: 1.7em;
      font-size: 0.9rem;
      color: #08102b
    }

    .popSc .popBo .popBtn {
      display: inline-flex;
      justify-content: center;
      align-items: center;
      height: 50px;
      width: 50px;
      outline: none;
      border: none;
      background: #482dff;
      border-radius: 50%;
      margin-top: 20px;
      transition: all .2s ease;
      -webkit-transition: all .2s ease
    }

    .popSc .popBo .popBtn:hover {
      transform: scale(1.05);
      -webkit-transform: scale(1.05)
    }

    .popSc .popBo .popBtn svg {
      width: 24px;
      height: 24px;
      stroke: #fff;
      flex-shrink: 0
    }

    .popSc .popBo .popBtn svg.r {
      animation: rotateIcn 1.5s infinite linear;
      -webkit-animation: rotateIcn 1.5s infinite linear
    }

    .popSc {
      animation: popupBlur .3s ease-in;
      -webkit-animation: popupBlur .3s
    }

    .popSc>* {
      animation: popupScale .3s ease-in;
      -webkit-animation: popupScale .3s
    }

    .darkMode .popSc {
      background: rgba(0, 0, 0, 0.1)
    }

    .darkMode .popSc .popBo {
      background: rgba(50, 50, 50, 0.8)
    }

    .darkMode .popSc .popBo svg {
      stroke: #fefefe
    }

    .darkMode .popSc .popBo p,
    .darkMode .popSc .popBo h2 {
      color: #fefefe
    }

    @keyframes popupBlur {
      from {
        opacity: 0
      }

      to {
        opacity: 1
      }
    }

    @-webkit-keyframes popupBlur {
      from {
        opacity: 0
      }

      to {
        opacity: 1
      }
    }

    @keyframes popupScale {
      from {
        transform: scale(0);
        animation-timing-function: ease-in;
        opacity: 0
      }

      to {
        transform: scale(1);
        opacity: 1
      }
    }

    @-webkit-keyframes popupScale {
      from {
        -webkit-transform: scale(0);
        -webkit-animation-timing-function: ease-in;
        opacity: 0
      }

      to {
        -webkit-transform: scale(1);
        opacity: 1
      }
    }

    @keyframes rotateIcn {
      from {
        transform: rotate(0deg)
      }

      to {
        transform: rotate(359deg)
      }
    }

    @-webkit-keyframes rotateIcn {
      from {
        -webkit-transform: rotate(0deg)
      }

      to {
        -webkit-transform: rotate(359deg)
      }
    }
  </style>

<script>
/*<![CDATA[*/
/**
 * Anti Ad Blocker Code by Fineshop Design
 * Last Updated: 16:42 12/08/2023 IST
 * Copyright: [Deo Kumar, Fineshop Design](https://www.fineshopdesign.com)
 */
    (function () { const n = document, o = n.head; var t = "pointer-events: none; height: 1px; width: 0; opacity: 0; visibility: hidden; position: fixed; bottom: 0;"; const a = n.createElement("div"), s = n.createElement("div"), d = n.createElement("ins"); a.id = "div-gpt-ad-3061307416813-0", a.style = t, s.className = "textads banner-ads banner_ads ad-unit ad-zone ad-space adsbox ads", s.style = t, d.className = "adsbygoogle", d.style = "display: none;"; const i = { allowed: null, elements: [a, s, d] }; this.checkAdsStatus = function (t) { const e = n.body; "function" == typeof t && ("boolean" == typeof i.allowed ? t(i) : (e.appendChild(a), e.appendChild(s), e.appendChild(d), setTimeout(function () { if (0 === a.offsetHeight || 0 === s.offsetHeight || d.firstElementChild) i.allowed = !1, t(i); else { const e = n.createElement("script"); e.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js", e.async = !0, e.crossOrigin = "anonymous", e.onload = function () { i.allowed = !0, t(i) }, e.onerror = function () { i.allowed = !1, t(i) }, o.appendChild(e) } a.remove(), s.remove(), d.remove() }, 40))) } }).call(this);

    function antiAdBlockerHandler() {
      window.checkAdsStatus(function (ads) {
        if (!ads.allowed) {
          // Ads are Blocked
          console.log("%c[ADS]", "color:#d32f2f;", "Blocked");

          const icon = "";
          const title = "Ad blocker detected!";
          const message = "

We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.

"; // Lets create the popup const element = document.createElement("div"); element.className = "popSc"; element.innerHTML = "
" + icon + "

" + title + "

" + message + "
" document.body.appendChild(element); } else { // Ads are allowed; console.log("%c[ADS]", "color:#43a047;", "Allowed"); } }); document.removeEventListener("DOMContentLoaded", antiAdBlockerHandler); }; if (document.readyState === "complete" || document.readyState !== "loading") { antiAdBlockerHandler(); } else { document.addEventListener("DOMContentLoaded", antiAdBlockerHandler); } /*]]>*/ </script>

Simpan perubahan pada Theme dan silahkan lakukan tes dengan mengaktifkan aplikasi adblocker pada browser kamu.

No comments

Post a Comment

© Roy Andika
Maira Gall