Membuat Peringatan Adblock Detect Di Blog

 

Adblock Detect 

Adblock - Peringatan terdeteksinya pemblokiran iklan. Bagi situs web atau blog yg memiliki iklan pasti ingin mendapatkan hasil dari iklan tersebut. Tidak semua pengunjung blog atau situs web ingin melihat iklan yg ada di blog atau situs web yg dikunjunginya. 

Di bawah ini adalah cara Membuat Peringatan Adblock Detect Di Blog yg bisa dicoba di blog masing - masing.

Membuat Peringatan Adblock

1. Di dashboard blogger, klik Tema >> Edit Tema 

2. Cari </body> , copy kode di bawah ini lalu paste di atas </body>

<style>
div[class^="ykwrp_"]{display:none}
.ykth-inner{font-family:"Open Sans","Roboto",Segoe UI,sans-serif;background:#FFF;position:fixed;width:40%;left:0;right:0;top:30%;margin:auto}
div[class^="ykwrp_"]:before,#ykth:before{content:"";position:fixed;background:#00000055;top:0;left:0;right:0;bottom:0;width:100%;height:100%}
.ykth-head{background:#de2b2b;color:#FFF;padding:20px}
.ykth-head>svg{float:left;margin:0 9px 0 0;animation:shake .82s cubic-bezier(.36,.07,.19,.97) 7;transform:translate3d(0,0,0);backface-visibility:hidden;perspective:1000px}
.ykth-head>i{position:absolute;top:16px;right:16px;cursor:pointer;line-height:13px;font-size:21px;font-weight:700;font-style:normal}
.ykth-head>b{font-size:16px;font-weight:700;text-transform:uppercase}
.ykth-head>p{margin:0 0 0 35px;font-size:14px}
.ykth-body{padding:20px;font-size:100%;line-height:1.7}
.ykth-body>p{margin:0 0 10px}
@keyframes shake{10%,90%{transform:translate3d(-1px,0,0)}20%,80%{transform:translate3d(2px,0,0)}30%,50%,70%{transform:translate3d(-4px,0,0)}40%,60%{transform:translate3d(4px,0,0)}}
</style>
<div id="ykth"><div class="ykth-inner">
<div class='ykth-head'>
<svg style="width:30px;height:30px" viewBox="0 0 26 26"><path fill="#FFFFFF" d="M13,13H11V7H13M12,17.3A1.3,1.3 0 0,1 10.7,16A1.3,1.3 0 0,1 12,14.7A1.3,1.3 0 0,1 13.3,16A1.3,1.3 0 0,1 12,17.3M15.73,3H8.27L3,8.27V15.73L8.27,21H15.73L21,15.73V8.27L15.73,3Z"/></svg>
<b>Adblock Detect</b>
<p>We have detected that you are using adblock in your browser</p>
<i class="close" onclick="document.getElementById(ykrd1).style.display='none'">×</i>
</div>
<div class='ykth-body'>
<p>Our website is made possible by displaying online advertisements to our visitors.</p>
<p>Please consider supporting us by disabling your ad blocker.</p>
</div>
<!-- Start Condition When JS Disable -->
<noscript>
<div class="ykth-body">
 <p>Javascript is disabled in your web browser.</p>
 <p>For full functionality of this site it is necessary to enable JavaScript. Here are the <a href="https://www.enable-javascript.com/" target="_blank"> instructions how to enable JavaScript in your web browser</a>.</p>
</div>
<style>#ykth{display:block;}.ykth-inner>.ykth-body{display:none;}.ykth-head>b,.ykth-head>p{font-size:0}.ykth-head>b:before{content:"Javascript Detected";font-size:16px}.ykth-head>p:before{content:"We have detected that you are disable javascript in your browser";font-size:14px}</style>
</noscript>
<!-- End Condition When JS Disable -->
</div></div>
<script>
//<![CDATA[
var ykrd1=Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
var ykrd2=Math.random().toString(36).substring(2, 7);
var e=document.getElementById("ykth");e.setAttribute("id", ykrd1);e.classList.add("ykwrp_"+ykrd2);
  document.addEventListener('DOMContentLoaded', init, false);
function init(){
  adsBlocked(function(blocked){
    if(blocked){
    document.getElementById(ykrd1).style.display='block';
    } else {
      document.getElementById(ykrd1).style.display='none';
    }
  })
}
function adsBlocked(callback){
  var testURL = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'
 
  var myInit = {
    method: 'HEAD',
    mode: 'no-cors'
  };
 
  var myRequest = new Request(testURL, myInit);
 
  fetch(myRequest).then(function(response) {
    return response;
  }).then(function(response) {
    console.log(response);
    callback(false)
  }).catch(function(e){
    console.log(e)
    callback(true)
  });
}
//]]>
</script>

3. Klik Simpan Tema

Itulah tadi tutorial Membuat Peringatan Adblock Detect Di Blog.