>检查用户是否启用了广告拦截器
>如果是,请将用户重定向到目标网页
>在该登录页面上,显示指向用户到原始目标的链接
>只要启用了广告拦截器,用户就只会被定向到该目标网页一次(或每x天一次)
>广告(隐藏)必须由自定义HTML替换
优先使用jQuery(客户端,因为据我所知,无法检测到adblocker服务器端).
注意:我只关注Google广告.
测试信息> 2013年11月21日的答案.解决方案可能不适用于所有年龄段
>仅在Windows 8 64位计算机上的Chrome 31和Firefox 25上进行了测试
>提高了JSFiddle的可读性.
更新为了提高用户友好性,我不再在我的网站上应用此技术了.
你需要什么
> jQuery
> jQuery Cookie
>在您的站点上运行的.js文件(以下称为scripts.js)
>广告的div包装器.不要使用太容易检测到与广告相关的类!尝试类似class =“cont-ad”的内容.因此,您将每个广告单独包装在该类的div中,例如< div class =“cont-ad”>.
>一个页面,您可以在其中解释您的网站上需要广告的原因.我称之为ads.html.为该页面的body-tag提供一个易于识别但也是唯一的类. (你可以使用ID代替,但我觉得课程更容易.)我会给身体一个广告课程.
注意:只有ads.html页面中的body标签可以包含此类!
前三个文件的加载顺序应为:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="/js/jquery.cookie.js"></script> <script src="/js/scripts.js"></script>
我现在发布的所有脚本都将在scripts.js中.
检查Adblocker是否处于活动状态
正如我之前所说,我们需要检查adblock客户端,而不是服务器端.这意味着我们不能使用PHP.在整个网络上,我发现不同的广告拦截块会以不同方式阻止广告.因此,我们需要一些条件来查看广告是否已被屏蔽.我将使用jQuery.
有些广告拦截器会隐藏广告,有些广告无法加载广告,有些则只会将高度降低为零.这些是以下三个条件.
if($("ins.adsbygoogle").is(':empty') || $("ins.adsbygoogle").height() === 0 || !$("ins.adsbygoogle").is(":visible")) {
请注意,最后一个条件也可以写为.is(“:hidden”).我认为不可见更清楚了.
正如我之前所说,这些条件会检查广告是否“被屏蔽”.当这返回true时,我们可以做我们想要的!
更改内容并添加另一个If子句
首先,我们希望显示隐藏广告的替代方案.我们将更改广告包装的HTML.这将完全删除广告代码,但这无关紧要,因为它无论如何都会被阻止.
$(".cont-ad").html('<span class="adblock-message">Please. Do not take my ads away! <a href="http://www.yoursite.com/ads.html" target="_self" title="Ads">Read more.</a></span>');
但我们也希望将用户重定向到目标网页,对吧?但只有一次.那么我们要做的是:
>检查是否存在cookie ads_checked(我将在一分钟内回复),如果没有,请转到我们的目标网页
>将用户前往的位置保存在另一个cookie locational_cookie中
在代码中,它看起来像这样.
if ($.cookie('ads_checked') == null) { // Set cookie with value of current page $.cookie('locational_cookie', window.location, { expires: 7, // Not really necessary path: '/' }); // Redirect window.location = "http://www.yoursite.com/ads.html"; }
我们只想替换广告,并且仅在广告被屏蔽时重定向用户,因此我们将所有上述内容放在第一个if子句中:
if ($("ins.adsbygoogle").is(':empty') || $("ins.adsbygoogle").height() === 0 || !$("ins.adsbygoogle").is(":visible")) { // Change the HTML content of the ad $(".cont-ad").html('<span class="adblock-message">Please. Do not take my ads away! <a href="http://www.yoursite.com/ads" target="_self" title="Ads">Read more.</a></span>'); if ($.cookie('ads_checked') == null) { // Set cookie with value of current page $.cookie('locational_cookie', window.location, { expires: 7, // Not really necessary path: '/' }); // Redirect window.location = "http://www.yoursite.com/ads.html"; } }
那里,这是第一大块.
检查是否在登陆页面,未设置Cookie,设置另一个和添加内容
拥有ads.html着陆页的想法是,用户可以查看您对广告的立场以及您需要收入的原因.无需我们正在构建的脚本,就可以访问此页面.这意味着并非所有内容都必须始终在该页面上.例如,如果用户首先导航到ads.html(当“原始目的地”实际上是该页面本身时),我们将要创建的“返回原始目的地”按钮/链接一定不能存在).
因此,如果用户已被重定向,我们必须添加“返回原始目的地”链接.我们可以通过检查我们之前设置的cookie的存在来做到这一点.为了确保,我们还可以检查我们仅为该页面提供的body标签,但这不是必需的.
if ($("body").hasClass("on-ads") && $.cookie('locational_cookie') != null) {
但是我们在这个功能中需要什么呢?首先,我们需要将“back”链接的href设置为原始位置.我们将原始目的地保存在cookie中,因此非常有用!在那之后,我们想删除那个cookie(locational_cookie) – 我们不再需要它了.但是,我们需要另一个cookie. (饿了吗?)
回想一下我们之前构建的前一段代码:在嵌入式if子句中,我们检查是否存在名为ads_checked的cookie.如果该cookie不存在,我们希望将用户发送到登录页面,但我们只想将他发送到那里.因此,我们所做的是:当用户在此着陆页上时,设置一个cookie – 如果该cookie存在,则用户不能再次重定向.现在我们也创建了这个cookie.
请注意,我们必须将反向链接附加到ads.html页面上的某些HTML元素.在这里,它被称为#wrapper.
if ($("body").hasClass("on-ads") && $.cookie("locational_cookie") != null) { // Append back link $("#wrapper").append('<p>Get to your <em><a href="' + $.cookie("locational_cookie") + '" target="_self">original destination</a></em>.</p>'); // Remove locational cookie $.removeCookie('locational_cookie', {path: '/'}); // Set ads_checked cookie $.cookie('ads_checked', 'true', { expires: 7, // so the user will be redirected to the landing page again after 7 days path: '/' }); }
结果
这基本上就是它!所有东西放在一起,我们得到了这个,在一个很好的文档就绪功能.这是JSFiddle,可能会更清楚一些.
$(document).ready(function () { if ($("body").hasClass("on-ads") && $.cookie("locational_cookie") != null) { // Append back link $("#wrapper").append('<p>Get to your <em><a href="' + $.cookie("locational_cookie") + '" target="_self">original destination</a></em>.</p>'); // Remove locational cookie $.removeCookie('locational_cookie', { path: '/' }); // Set ads_checked cookie $.cookie('ads_checked', 'true', { expires: 7, // so the user will be redirected to the landing page again after 7 days path: '/' }); } if ($("ins.adsbygoogle").is(':empty') || $("ins.adsbygoogle").height() === 0 || !$("ins.adsbygoogle").is(":visible")) { // Change the HTML content of the ad $(".cont-ad").html('<span class="adblock-message">Please. Do not take my ads away! <a href="http://www.yoursite.com/ads" target="_self" title="Ads">Read more.</a></span>'); if ($.cookie('ads_checked') == null) { // Set cookie with value of current page $.cookie('locational_cookie', window.location, { expires: 7, // Not really necessary path: '/' }); // Redirect window.location = "http://www.yoursite.com/ads"; } } });