AdBlockers 사용자를위한 대체 콘텐츠 표시

Question

광고 기금 프로젝트를 진행하고 있습니다. 실제로 뭔가 미묘한 콘텐츠 인식, 생식기 확대 등에 대한 절름발이 팝업이 아닙니다.

프로젝트가 광고 자금으로 제공되므로 광고 차단기를 사용하는 사람들은 해당 사이트의 광고를 분명히 모르기 때문에 프로젝트에 도움이되지 않습니다. 그렇게 나쁘지 않다).

광고 차단기가있는 사람들을 위해 대체 콘텐츠를 표시하려면 어떻게해야합니까? 예 :

활성 광고 차단기가있는 것으로 나타났습니다. Example.com은 광고 자금으로 운영되므로 광고 품질이 높고 눈에 잘 띄지 않습니다. 우리를 계속 운영 할 수 있도록 도움을 줄 수있는 가장 좋은 방법은 광고 차단기에서 허용 목록을 작성하는 것입니다. 감사!

어떻게 광고 차단기를 테스트 할 수 있습니까?

예제를 찾아라! <div id="ad_holder"> ... ads ... </div>을하고 차단제는 어떻게 든 그것을 제거하는 것입니다 : http://mangastream.com

Answer 1

광고 차단기는 기본적으로 일부 규칙에 따라 일부 ID 또는 jQuery를 사용하여 일부 요소를 조작하고 해당 데이터베이스에 저장되며 DOM 준비가 완료되면 잠시 동안 수행됩니다.

DOM을 준비한 후 예를 들어 특정 시간 후에 광고 요소가 조작되는지 여부를 확인해야합니다. 기본적으로 display (AdBlockers가 숨기기 때문에) CSS 속성이나 광고 요소의 innerHTML을 확인할 수 있습니다. 그런 다음

<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); 
}); 

이 http://jsfiddle.net/cxvNy/ 광고의 HTML 인 경우

을 (AdBlock for Chrome를 사용하여 테스트,이 활동이 필요) :

작업 데모 : 다음은 예입니다

희망 코드는 자명하다 :

Answer 2

나는 광고 차단기가 작동하지만, 예를 들어 Chrome ad blocker I have 나를 제거 할 광고가 포함 된 특정 DOM 요소를 선택할 수 있습니다 방법을 모르겠어요.

해당 div 안에 짧은 타이머를 넣으면 전역 변수가 수정되고 이후에 실행되는 다른 전역 변수를 읽는 타이머는 페이지에 광고 차단기가 없다고 가정 할 수 있습니까? 변수가 제대로 설정 되었습니까? Chrome이 자바 스크립트를 평가 한 후 차단 프로그램이 div를 삭제하면 부모 div가 삭제되었지만 변수를 설정할 수 있습니까?

AdBlock은 또한 '불량'서버 (http://www.doubleclick.com?)의 공개 목록을 유지하며 해당 서버의 콘텐츠에 대한 HTTP 요청을 차단합니다. 이는 Chrome과 통합되어 콘텐츠 정책의 일종을 정의 할 수 있습니다.로드되는 내용과 그렇지 않은 내용을 정의 할 수 있습니다. 이 경우 이전에 설명한 방법으로 감지 할 수 있습니다. 귀하의 클라이언트가 광고 제공 업체라면 조만간 흑색으로 표시 될 것입니다.

블로커는 CSS를 수정하고 전체 div를 숨길 수 있지만 쉽게 감지 할 수 있습니다.

Answer 3

가장 일반적인 트릭은 일반적으로 adblockers에 의해 차단되는 이름을 가진 JavaScript 파일을 만드는 것입니다 (예 : /ads/advert.js). 파일이 차단되면 방문자에게 차단기 사용이 설정되었음을 알립니다.

CSS 파일은 일반적으로 차단기 목록에 의해 차단되지 않으므로보다 안전한 방법이 될 수 있습니다.

Answer 4

여기에서 엉망으로 촬영 했는데도 페이지가로드 된 후 일부 자바 스크립트로 광고 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. 
    } 

adblocker이는 일이 수행 정확히 모르겠어요, 그래서 아마 setTimeout()으로 몇 초 동안이 기능의 실행을 지연하는 것이 좋습니다 것입니다. 얼마나 많은 사용자가 광고 차단기를 실행하고 있는지에 대한 통계를 수집하는 것과 마찬가지로, 일부 아약스 호출로 할 수있는 흥미로운 것들이있을 것입니다. 관리 단지 은 그 종류의 물건를 좋아한다.

업데이트 : 방금 ​​Chrome 용 adblock을 설치하고 StackOverflow와 비교하여 확인했습니다. AdBlock은 광고 컨테이너의 콘텐츠를 삭제하기 때문에 위의 방법이 작동합니다.

Answer 5

결국 다음 구현을 사용했습니다 (this site's과 유사). 다음 코드가 사용됩니다.

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

맨 끝에. 프로처럼 일하고있는 것 같습니다. 모두를위한 훌륭한 답변, upvotes 주셔서 감사합니다!

Answer 6

내가 좋아하는 접근 방식은 내 사이트에 멋진 멋진 유용한 콘텐츠 블록 주위에 '광고'또는 '광고'또는 비슷한 것을 추가하는 것입니다. 그러면 광고 차단기를 가진 사람들이 그것을 볼 때 볼 수 없습니다. 아무것도.

콘텐츠를보기 위해 광고 블록을 사용 중지해야합니다.

경고에 신경 쓰지 말고 알아 내도록하십시오. 광고 차단 소프트웨어를 사용하는 인형이 아닙니다.

다음은 인기있는 adblock 확장의 블록 규칙 목록입니다. 단순히 차단하고있는 클래스 나 ID를 선택하십시오. (개발자 도구를 사용하여 CSS 클래스 목록을 봅니다.)

Answer 7

jQuery를 사용하지 않고 간단한 JavaScript로도이 작업을 수행 할 수 있습니다.

<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 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> 

사용하면

Answer 9

당신은 아주 좋은 및 사용하기 쉬운 https://github.com/sitexw/FuckAdBlock을 구현할 수 있습니다 구글 광고의 교체 기기에 이미지를 설정할 수 있습니다 코드.