Adblock Tarafından Gizlenen Nesneleri Gösterme

Merhabalar;

Bu makalede reklamları engellemek için kullanılan Adblock, Adguard veya uBlock Origin tarzı eklentilerin reklam olmayan div’leri engellemesini engellemeye çalışacağız. Aslında banner tarzı reklamlarınızın da bu şekilde engellenmesini engelleyebilirsiniz. Fakat dışarıdan javascript dosyası çeken adsense tarzı reklam birimlerinde kullanamazsınız, bir işe yaramaz.

Öncelikle senaryomuz şu olsun. Ana sayfanızda sponsorlarınızı listelediğiniz bir alan oluşturdunuz ve bu alana id değeri olarak Adblock filtrelerine takılacak bir değer atadınız. Belkide siz scripti satın aldığınızda böyleydi, değiştiremiyorsunuz. Kullanıcılar Adblock kullanarak sitenize girdiği zaman bu alan eklenti tarafından filtreleniyor ve görünmez hale geliyor. Sizde bu durumdan şikayetçisiniz ve id değerini değiştirmeden bu alanı görünür hale getirmek istiyorsunuz. Şimdi beraber bunu nasıl yapabileceğinize bakalım.

• Örnek olması açısından internet üzerinden şu şekilde bir tablo indirdim, bunun üzerinde çalışacağım.

  

• Tabloma “sponsors” id değerini atıyorum. Eklenti kapalı iken sorunsuz bir şekilde tablom gözüküyor. Fakat eklentiyi aktif ettiğim zaman tablo “display:none!important” değerini alarak görünmez oluyor.

  

  

• Burada eklentiyi devre dışı kalmaya zorlayamam. Bunun yerine eklentinin yaptığı şeyi bende yapacağım. Yani eklenti sayfa yüklendikten sonra css kısmında değişiklik yapıyor, ben de eklenti değişiklik yaptıktan sonra css kodlarını tekrar değiştireceğim.

  Bunun için jquery veya direk Basic javascript kullanabilirsiniz. Jquery ile kullanmak için sayfaya jquery kütüphanesini dahil etmeniz gerekli iken basic js de herhangi bir kütüphaneye ihtiyacınız bulunmamaktadır. Performans açısından 1 satır kodun bir şey etkileyeceğini düşünmüyorum  🙂

  Jquery için,
  

  <script>
  $( document ).ready(function() {
  function degistir(){
   $('#sponsors').attr('style','display: block!important;')}; 
   setTimeout(degistir,100);
  });
  <script>
  

  #sponsors değerini kendi id değeriniz ile değiştirmeyi unutmayın. Burada fonksiyona geri sayım atamamın nedeni biraz tedirginlik açıkçası. Yoksa zaten document ready ile sayfanın yüklenmesini zaten bekliyoruz.

  Basic Js için,

  <script>
  function degistir(){ 
  document.getElementById("sponsors").style.cssText = 'display:block !important';};
  setTimeout(degistir,100);
  </script>
  

  sponsors id’sini değiştirmeyi unutmayın. Burada da tamamen aynı işlemi yapıyoruz. Bu kodları sayfanızın altına ekleyebilirsiniz. İsterseniz <script></script> taglarını kaldırarak herhangi bir .js dosyanızın içerisine de ekleyebilirsiniz.

• Sıradaki dememde kodları sayfamın altına ekliyorum ve eklenti açık bir şekilde sayfamı yeniden yüklüyorum.

  

• Bu sefer eklenti açık olmasına rağmen div’im gizlenmiyor ve sorunsuz bir şekilde gözüküyor.

Demo

Makaledeki örneğin demo adresini yukarıya bıraktım. İncelemek isteyen arkadaşlar Adblock eklentileri açık bir şekilde sayfayı ziyaret edebilirler. Makalemi okuduğunuz için teşekkür ederim, takıldığınız yerleri yorum olarak sorabilirsiniz. Son olarak makaleme oy verirseniz sevinirim, Sağlıcakla kalın  😆