Question

我正在开展广告资助项目。真的是微妙和内容意识的东西，而不是生殖器扩大的蹩脚弹出窗口等。

由于该项目是由广告资助的，因此广告拦截器的用户不会对该项目有所帮助（因为他们显然不知道该特定网站上的广告并不那么糟糕）。

如何为有广告拦截器的人显示替代内容？像

这样的东西

我们注意到您有一个有效的广告拦截器。 Example.com是广告资助的，我们承诺我们的广告质量高且不引人注目。为了让我们继续投放，您可以提供的最佳帮助是将您的广告拦截器列入白名单。谢谢！

如何测试广告拦截器？

找到一个例子！ http://mangastream.com

Answer 1

广告拦截器基本上操纵一些带有一些ID的元素或像选择规则一样的jQuery，存储在他们的数据库中，在DOM准备好之后会做一段时间。

因此，您必须在DOM准备好后的某个时间（例如3秒）后检查您的广告元素是否被操作。您基本上可以检查display（因为AdBlockers隐藏它）CSS属性或广告元素的innerHTML。以下是一个例子：

工作演示： http://jsfiddle.net/cxvNy/（使用AdBlock for Chrome进行测试，您需要将其激活）

如果您的广告HTML是：

<div id="google_ads_frame1">aa</div>

然后：

$(function(){
   setTimeout(function(){
      if($("#google_ads_frame1").css('display')=="none") //use your ad's id here I have used Google Adense
      {
          $('body').html("We noticed you have an active Ad Blocker. Example.com is ad funded, we promise our ads are of high quality and are unobtrusive. The best help you could provide to keep us running, is to whitelist us in your ad blocker. Thanks!");
      }
  },3000);
});

希望上面的代码是自我解释的：）

Answer 2

最终，我使用了以下实现（类似于this site's）。使用以下代码：

function abp() {
    if ($('.ad').height() == 0) {
        $('.ad').css("height", "90px");
        $('.ad').css("background-image", "url(/static/images/msblock.png)");
    }
}
$(abp);

在文件的最后。似乎像专业人士一样工作。感谢大家的优秀答案，为所有人提供赞成！

Answer 3

从这里开始拍摄，但是你可以在页面加载后用一些javascript查看广告div的内容。

<!-- html -->
    <div id="MyAdDiv">
       <div id="BeaconContainer" style="display:none">I rendered!</div>
       // Ad content here.  
    </div>

// javascript

    var d = document.getElementById("MyAdDiv");

    if ( d.innerHTML.indexOf("I rendered!") === -1 )  {
       // Your ad has been blocked.
       // Run code to launch WhiteList request message.
    }

我不确切知道广告拦截器什么时候发生这种情况，所以使用setTimeout()将这个函数的执行延迟几秒可能是一个好主意。对于一些ajax调用，你可以做一些有趣的事情，比如收集关于有多少用户正在运行广告拦截器的统计信息。管理层只是喜欢那种东西。

<强>更新我刚安装了适用于Chrome的adblock，并针对StackOverflow进行了检查。看起来AdBlock只是删除广告容器的内容，因此上述方法将起作用。

Answer 4

最常见的技巧是创建一个名称通常被广告拦截器阻止的JavaScript文件，例如/ads/advert.js。如果文件被屏蔽，则表示访问者已启用广告拦截器。

CSS文件通常不会被广告拦截器列表阻止，因此这将是一种更安全的方法。

Answer 5

这也可以使用简单的JavaScript来完成，而不使用jQuery。

<script>
window.onload = function(){
  setTimeout(showAdblockImage, 3000); 
};
function showAdblockImage(){
    //get all google ad elements
    var adsList = document.querySelectorAll("ins.adsbygoogle");
    if(!adsList){ return;}
    for(var i=0; i<adsList.length;i++){
        if(adsList[i].innerHTML.replace(/\s/g, "").length != 0){
            //AdBlock is not active, hence exit
            break;
        }
        //apply inline css to force display
        adsList[i].style.cssText = 'display:block !important';
        //modify html content of element
        adsList[i].innerHTML='<img src="imageurl/img_1.jpg" />';
    } 
}
</script>

参考：Place alternate content in place of AdBlock Censored Ads

Answer 6

我不知道广告拦截器是如何工作的，例如Chrome ad blocker I have让我选择一个包含要删除的广告的特定DOM元素：<div id="ad_holder"> ... ads ... </div>，并且阻止程序会以某种方式将其删除。

如果你把一些javascript放在那个div里面，用一个短计时器来修改一个全局变量，另一个计时器在之后执行，读取那个全局变量，你可以假设那里没有广告拦截器吗？页面如果变量设置正确？如果阻止程序在Chrome评估该javascript后删除div，会发生什么情况，虽然删除了父div，但计时器仍会设法设置变量？

AdBlock还会保留一份“坏”的公开列表。服务器（http://www.doubleclick.com？），可能会阻止来自这些服务器的内容的http请求。如果它与Chrome集成，则可以完成此操作，以便它可以定义某种内容策略 - 加载的内容和不加载的内容。您可以使用前面介绍的方法检测此情况。如果您的客户是广告提供商，我想迟早会将其列为黑名单：）

阻止者可能只修改CSS并隐藏整个div，但这很容易被发现。

Answer 7

我最喜欢的方法是在我的网站上简单地添加一类“广告”或“广告”或类似的东西，然后当有广告拦截器的人看到它时，他们看不到任何东西。

他们被迫禁用广告拦截以查看内容。

不要打扰警告，让他们搞清楚。这不是使用广告拦截软件的假人。

以下是一些常用adblock扩展程序的当前阻止规则列表。只需选择他们阻止的类或ID（使用您的开发人员工具查看css类列表）

Answer 8

<script> // Run after all the page elements have loaded  window.onload = function(){ 
// This will take care of asynchronous Google ads
setTimeout(function() {     
  // We are targeting the first banner ad of AdSense
  var ad = document.querySelector("ins.adsbygoogle"); 
  // If the ad contains no innerHTML, ad blockers are at work
  if (ad && ad.innerHTML.replace(/\s/g, "").length == 0) {     
    // Since ad blocks hide ads using CSS too
    ad.style.cssText = 'display:block !important';         
    // You can put any text, image or even IFRAME tags here
    ad.innerHTML = '<img src="http://blog.liveurlifehere.com/wp-content/uploads/2015/01/adblock.jpg" width="300" height="250" />';      
  }      
}, 2000); // The ad blocker check is performed 2 seconds after the page load   }; </script>

使用此代码，您可以设置图片来代替Google广告

Answer 9

您可以实施非常好且易于使用的https://github.com/sitexw/FuckAdBlock。

使用AdBlockers为用户显示替代内容

9 个答案: