Jak utrzymać OpenX przed blokowaniem ładowania strony?

Używamy OpenX do wyświetlania reklam w wielu witrynach. Jeśli jednak serwer OpenX ma problemy, blokuje ładowanie stron w tych witrynach. Wolałbym, aby witryny zawiodły z gracją, tj. Ładowały strony bez reklam i wypełniały je, gdy staną się dostępne.Jak utrzymać OpenX przed blokowaniem ładowania strony?

Używamy OpenX's single page call, a my podajemy wyraźny rozmiar div w CSS, aby można je było ułożyć bez ich zawartości, ale wciąż ładowanie skryptu blokuje ładowanie strony. Czy istnieją inne sprawdzone metody przyspieszania stron za pomocą OpenX?

Źródło

2010-09-22 pjmorse

zobaczyć http://stackoverflow.com/questions/3106782/openx-aysnc-tags –

OpenX ma jakąś dokumentację na temat jak zrobić swoje tagi asynchronicznie obciążenia: http://docs.openx.com/ad_server/adtagguide_synchjs_implementing_async.html

Przetestowałem go i działa dobrze w obecnym Chrome/Firefox.

Wymaga ręcznego poprawiania kodu reklamy. Ich przykładem jak tagi reklam powinny skończyć:

<html> 
<head></head> 

<body> 

Some content here. 

Ad goes here. 

<!-- Preserve space while the rest of the page loads. --> 

<div id="placeholderId" style="width:728px;height:90px"> 

<!-- Fallback mechanism to use if unable to load the script tag. --> 

<noscript> 
<iframe id="4cb4e94bd5bb6" name="4cb4e94bd5bb6" 
src="http://d.example.com/w/1.0/afr?auid=8&target= 
_blank&cb=INSERT_RANDOM_NUMBER_HERE" 
frameborder="0" scrolling="no" width="728" 
height="90"> 
<a href="http://d.example.com/w/1.0/rc?cs= 
4cb4e94bd5bb6&cb=INSERT_RANDOM_NUMBER_HERE" 
target="_blank"> 
<img src="http://d.example.com/w/1.0/ai?auid=8&cs= 
4cb4e94bd5bb6&cb=INSERT_RANDOM_NUMBER_HERE" 
border="0" alt=""></a></iframe> 
</noscript> 
</div> 

<!--Async ad request with multiple parameters.--> 

<script type="text/javascript"> 
    var OX_ads = OX_ads || []; 
    OX_ads.push({ 
     "slot_id":"placeholderId", 
     "auid":"8", 
     "tid":"4", 
     "tg":"_blank", 
     "r":"http://redirect.clicks.to.here/landing.html", 
     "rd":"120", 
     "rm":"2", 
     "imp_beacon":"HTML for client-side impression beacon", 
     "fallback":"HTML for client-side fallback" 
    }); 
</script> 

<!-- Fetch the Tag Library --> 

<script type="text/javascript" src="http://d.example.com/w/1.0/jstag"></script> 

Some other content here. 

</body> 
</html>

Źródło

2014-06-03 21:49:51 Kevin

Hej, to dobra wiadomość! Nie pracuję z OpenX od ponad dwóch lat, ale dobrze jest zobaczyć, że nadrabiają zaległości w takich sytuacjach. – pjmorse

Załadujemy nasze reklamy w ramkach iframe, aby uniknąć problemu. Rozmiar div i element iframe są takie same, a element iframe wskazuje stronę, która zawiera fragment reklamy (można przekazać strefę i inne wymagane opcje jako parametry do tej strony).

okrzyki

Lee

Źródło

2010-09-30 23:05:18 leebutts

Czy ładowanie reklamę w iframe mają żadnych wad, takich jak utrata kontekst? (tzn. reklama nie może "zobaczyć" reszty strony). Czy przekazujesz wymagane parametry kontekstu w adresie URL elementu iframe? – cherouvim

Dodajemy słowa kluczowe i treść do strony (niewidoczna ze strony zewnętrznej), a także fragment, więc jeśli zeskanują odnośny adres URL, dostosowują treść. – leebutts

Mamy leniwy obciążenia kod OpenX jest. Zamiast umieszczać wywołanie jednej strony u góry strony, umieszczamy ją na dole. Po załadowaniu strony połączenie otrzyma dane banera, a niestandardowy kod doda prawidłowe banery we właściwych strefach.

Poniższy kod wymaga właściwego DOM. Jeśli masz jQuery, DOMAssistant, FlowJS itd., DOM powinien być dla ciebie ustalony. Ten kod będzie działać z normalnymi banerami z obrazami, lampą błyskową lub treścią HTML. Może nie działać w niektórych przypadkach, np. Podczas korzystania z banerów od zewnętrznych dostawców (np. W tym celu możesz trochę zhakować kod.

Jak z niego korzystać?

dodać swój kod SinglePageCall pod koniec kodu HTML
dodać ten kod do kodu SPC.
po około pół sekundy, twój kod OpenX powinien być gotowy, a poniższy kod umieści banery w określonych DIV.
Och, tak, musisz dodać do kodu HTML niektóre DIV jako miejsce przechowywania banerów. Domyślnie mam ustawione te banery z ukrytą klasą CSS, która całkowicie ukrywa DIV (z widocznością, wyświetlaczem i wysokością). Następnie po pomyślnym załadowaniu banera w danym DIV usuwamy ukrytą klasę, a DIV (i baner w środku) stają się widoczne.

Używaj na własne ryzyko! :) Mam nadzieję, że to pomaga

(function(){ 
if (!document || !document.getElementById || !document.addEventListener || !document.removeClass) { 
return; // No proper DOM; give up. 
} 
var openx_timeout = 1, // limit the time we wait for openx 
oZones = new Object(), // list of [div_id] => zoneID 
displayBannerAds; // function. 


// oZones.<divID> = <zoneID> 
// eg: oZones.banner_below_job2 = 100; 
// (generated on the server side with PHP) 
oZones.banner_top = 23; 
oZones.banner_bottom = 34; 



displayBannerAds = function(){ 
if(typeof(OA_output)!='undefined' && OA_output.constructor == Array){ 
    // OpenX SinglePageCall ready! 

    if (OA_output.length>0) { 

    for (var zone_div_id in oZones){ 
     zoneid = oZones[zone_div_id]; 

     if(typeof(OA_output[zoneid])!='undefined' && OA_output[zoneid]!='') { 

     var flashCode, 
      oDIV = document.getElementById(zone_div_id); 

     if (oDIV) { 

      // if it's a flash banner.. 
      if(OA_output[zoneid].indexOf("ox_swf.write")!=-1) 
      { 

      // extract javascript code 
      var pre_code_wrap = "<script type='text/javascript'><!--// <![CDATA[", 
       post_code_wrap = "// ]]> -->"; 

      flashCode = OA_output[zoneid].substr(OA_output[zoneid].indexOf(pre_code_wrap)+pre_code_wrap.length); 
      flashCode = flashCode.substr(0, flashCode.indexOf(post_code_wrap)); 


      // replace destination for the SWFObject 
      flashCode = flashCode.replace(/ox\_swf\.write\(\'(.*)'\)/, "ox_swf.write('"+ oDIV.id +"')"); 


      // insert SWFObject 
      if(flashCode.indexOf("ox_swf.write")!=-1){ 
       eval(flashCode); 
       oDIV.removeClass('hidden'); 
      }// else: the code was not as expected; don't show it 


      }else{ 
      // normal image banner; just set the contents of the DIV 
      oDIV.innerHTML = OA_output[zoneid]; 
      oDIV.removeClass('hidden'); 
      } 
     } 
     } 
    } // end of loop 
    }//else: no banners on this page 
}else{ 
    // not ready, let's wait a bit 
    if (openx_timeout>80) { 
    return; // we waited too long; abort 
    }; 
    setTimeout(displayBannerAds, 10*openx_timeout); 
    openx_timeout+=4; 
} 
}; 
displayBannerAds(); 
})();

Źródło

2010-10-29 06:50:07 Rafa

Czy możesz podać próbkę tego niestandardowego kodu? Zastanawiam się nad zastąpieniem funkcji document.write, ale miałem problemy z załadowaniem zawartości do odpowiednich kontenerów, ponieważ mamy kilka banerów na tej samej stronie. –

Rafa, jest niestandardowym kodem podobnym do tego: http://jqueryad.web2ajax.fr/? Ostatnio to stwierdziliśmy, ale jeszcze nie wdrożyliśmy go jako testu. – pjmorse

pjmorse> Właśnie zdałem sobie sprawę, że nigdy nie odpowiedziałem na twój komentarz i właśnie zaktualizowałem odpowiedź. Zastanawiam się, czy masz jakieś powiadomienie. Jeśli nie, oto komentarz "ping"/"poke", na wszelki wypadek ... rok później ;-) – Rafa

Po @Rafa doskonałą odpowiedź, używam tego kodu, aby wywołać banery OpenX po załadowaniu strony. Używam również jquery i musiałem dodać nowe zastępujące wywołanie dla "document.write", którego używają banery flash i zamiast niego zastąpić je "$ ('#" + oDIV.id + "'). Używam niestandardowego wywołania "my_openx()", aby zastąpić "OA_show()". Mój obszar banery nazywany przez id_strefy i są owinięte wewnątrz div, tak:

<div id="openx-4"><script>wm_openx(4);</script></div>

To działa :)

<script type="text/javascript">    
$is_mobile = false; 
$document_ready = 0; 
$(document).ready(function() { 
    $document_ready = 1; 
    if($('#MobileCheck').css('display') == 'inline') { 
     $is_mobile = true; 
     //alert('is_mobile: '+$is_mobile); 
    } 
}); 

function wm_openx($id) { 
    if($is_mobile) return false; 
    if(!$document_ready) { 
     setTimeout(function(){ wm_openx($id); },1000); 
     return false; 
    } 

    if(typeof(OA_output[$id])!='undefined' && OA_output[$id]!='') { 

     var flashCode, 
      oDIV = document.getElementById('openx-'+$id); 

     if (oDIV) { 

      // if it's a flash banner.. 
      if(OA_output[$id].indexOf("ox_swf.write")!=-1) { 

       // extract javascript code 
       var pre_code_wrap = "<script type='text/javascript'><!--// <![CDATA[", 
        post_code_wrap = "// ]]> -->"; 

       flashCode = OA_output[$id].substr(OA_output[$id].indexOf(pre_code_wrap)+pre_code_wrap.length); 
       flashCode = flashCode.substr(0, flashCode.indexOf(post_code_wrap)); 

       // replace destination for the SWFObject 
       flashCode = flashCode.replace(/ox\_swf\.write\(\'(.*)'\)/, "ox_swf.write('"+ oDIV.id +"')"); 
       flashCode = flashCode.replace(/document.write/, "$('#"+ oDIV.id +"').append"); 


       // insert SWFObject 
       if(flashCode.indexOf("ox_swf.write")!=-1) { 
        //alert(flashCode); 
        eval(flashCode); 
        //oDIV.removeClass('hidden'); 
       }// else: the code was not as expected; don't show it 


      }else{ 
       // normal image banner; just set the contents of the DIV 
       oDIV.innerHTML = OA_output[$id]; 
       //oDIV.removeClass('hidden'); 
      } 
     } 
    } 
    //OA_show($id); 
} 
</script>

Źródło

2012-07-04 15:40:02

szukałem tego, aby załadować reklam z moim serwerze OpenX tylko wtedy, gdy reklama powinna być widoczna. Używam wersji openX iFrame, która jest ładowana w div.Odpowiedź tutaj postawiła mnie na drodze do rozwiązania tego problemu, ale zamieszczone rozwiązanie jest nieco zbyt proste. Po pierwsze, gdy strona nie jest ładowana od góry (w przypadku, gdy użytkownik wejdzie na stronę klikając "wstecz") żaden z elementów div nie zostanie załadowany. Potrzebujesz więc czegoś takiego:

$(document).ready(function(){ 
    $(window).scroll(lazyload); 
    lazyload(); 
});

również musisz wiedzieć, co definiuje widoczny element div. To może być div, który jest w pełni widoczny lub częściowo widoczny. Jeśli spód obiektu jest większy lub równy górnej części okna ORAZ górna powierzchnia obiektu jest mniejsza lub równa dolnej części okna, powinna być widoczna (lub w tym przypadku: załadowana). Twoja funkcja LazyLoad może wyglądać następująco:

function lazyload(){ 
    var wt = $(window).scrollTop(); //* top of the window 
    var wb = wt + $(window).height(); //* bottom of the window 

    $(".ads").each(function(){ 
     var ot = $(this).offset().top; //* top of object (i.e. advertising div) 
     var ob = ot + $(this).height(); //* bottom of object 

     if(!$(this).attr("loaded") && wt<=ob && wb >= ot){ 
     $(this).html("here goes the iframe definition"); 
     $(this).attr("loaded",true); 
     } 
    }); 
}

Testowane na wszystkich głównych przeglądarek, a nawet na moim iPhone, działa jak marzenie !!

Źródło

2013-02-25 10:04:10 patrick

Jak utrzymać OpenX przed blokowaniem ładowania strony?

Odpowiedz

Powiązane problemy