Рекомендации по размещению кодов AdRiver
В AdRiver на каждом типе кода можно показать только определённые виды баннеров. В данной статье мы расскажем, как наиболее оптимально разместить код в вёрстке HTML-страницы.
IFrame-код
- flash width x height
- html width x height
- img width x height
Баннеры содержатся в элементе IFrame. Имеет значение вес баннера — чем меньше вес, тем быстрее загрузится баннер. IFrame-код имеет фиксированный размер и не влияет на загрузку страницы. Занимает определённое место на странице, независимо от того, что в него загружено. Ввиду этого невозможно одному посетителю показывать баннер 600х90, а другому 800х40 на одном и том же IFrame-коде. Кроме того, баннер не может выходить за пределы фрейма. Если баннер размещен в левом верхнем углу сайта, он ничего не сможет показать в правом нижнем углу.
Рекомендуем размещать IFrame-код вне вёрстки таблиц, особенно, если настроен таргетинг на браузер Internet Explorer.
Синхронный JavaScript-код (баннеры Pop-Under и Rich-media)
Если на странице установлен синхронный JavaScript-код, то загрузка страницы дальше продолжаться не будет до тех пор, пока не будет загружен и выполнен код баннера.
В AdRiver синхронный JavaScript-код используется для показа баннеров Pop-Under и Rich-media, а также для некоторых нестандартных баннеров.
Рекомендуем ставить этот код в самый низ документа, чтобы он не мешал грузиться странице. Также запрещается ставить больше одного JavaScript-кода на странице, потому что переменные из одного баннера переписывают значения переменных в другом баннере и поведение баннера в этом случае непредсказуемо.
Рекомендуем поставить код JavaScript в тег div, но не указывать размер, так как в том случае, если баннер не сможет показаться, баннерное место схлопнется. Пример:
<!-- AdRiver code START. Type:javascript Site: primer PZ: 0 BN: 0 --> <script language="javascript" type="text/javascript"><!-- var RndNum4NoCash = Math.round(Math.random() * 1000000000); var ar_Tail='unknown'; if (document.referrer) ar_Tail = escape(document.referrer); document.write('<sc' + 'ript language="JavaScript" type="text/javascript" src="http://ad.adriver.ru/cgi-bin/erle.cgi?sid=92926&target=top&bt=16&pz=0&rnd=' + RndNum4NoCash + '&tail256=' + ar_Tail + '"><\/sc' + 'ript>'); //--></script> <!-- AdRiver code END -->
Асинхронный JavaScript-код
- Extension
- Poster
- AjaxJS
Достоинство асинхронного JavaScript-кода по сравнению с синхронным JavaScript-кодом заключается в том, что загрузка страницы происходит независимо от того, загрузился код баннера или нет.
Extension
Баннер на коде Extension загружется браузером одновременно с загрузкой контента страницы. Рекомендуем размещать на коде Extension баннеры TopLine, расположенные в видимой части страницы.
Код Extension вставляет на страницу тег div, в который загружается баннер. Поэтому код можно размещать самостоятельно. Пример:
<!-- AdRiver code START. Type:extension Site: primer PZ: 0 BN: 0 --> <script type="text/javascript"> (function(L){if(typeof(ar_cn)=="undefined")ar_cn=1; var S='setTimeout(function(e){if(!self.CgiHref){document.close();e=parent.document.getElementById("ar_container_"+ar_bnum);e.parentNode.removeChild(e);}},3000);', j=' type="text/javascript"',t=0,D=document,n=ar_cn;L+=escape(D.referrer||'unknown')+'&rnd='+Math.round(Math.random()*999999999); function _(){if(t++<100){var F=D.getElementById('ar_container_'+n); if(F){try{var d=F.contentDocument||(window.ActiveXObject&&window.frames['ar_container_'+n].document); if(d){d.write('<sc'+'ript'+j+'>var ar_bnum='+n+';'+S+'<\/sc'+'ript><sc'+'ript'+j+' src="'+L+'"><\/sc'+'ript>');t=0} else setTimeout(_,100);}catch(e){try{F.src="javascript:{document.write('<sc'+'ript"+j+">var ar_bnum="+n+"; document.domain=\"" +D.domain+"\";"+S+"<\/sc'+'ript>');document.write('<sc'+'ript"+j+" src=\""+L+"\"><\/sc'+'ript>');}";return}catch(E){}}}else setTimeout(_,100);}} D.write('<div style="visibility:hidden;height:0px;left:-1000px;position:absolute;"><iframe id="ar_container_'+ar_cn +'" width=1 height=1 marginwidth=0 marginheight=0 scrolling=no frameborder=0><\/iframe><\/div><div id="ad_ph_'+ar_cn +'" style="display:none;"><\/div>');_();ar_cn++; })('http://ad.adriver.ru/cgi-bin/erle.cgi?sid=92926&target=top&bt=43&pz=0&tail256='); </script> <!-- AdRiver code END -->
Poster
Баннер на коде Poster загружается только в том случае, когда посетитель сайта «прокрутил» страницу до места расположения баннера. Если баннерное место сразу попадает в видимую часть страницы, то баннер загрузится только после загрузки всей страницы. Рекомендуем использовать код Poster для баннеров, располагающихся в невидимой части страницы.
Код Poster вставляет на страницу тег div, в который загружается баннер. Поэтому код можно размещать самостоятельно. Пример:
<!-- AdRiver code START. Type:poster Site: primer PZ: 0 BN: 0 --> <script language="javascript" type="text/javascript"><!-- function adriverPoster(L){ if(typeof(ar_cn)=="undefined")ar_cn=1; var W=window,D=document,E=D.documentElement,T=0,N=ar_cn,P=0,C=D.compatMode=="CSS1Compat", X='<scr'+'ipt type="text/javascript">var ar_bnum='+N+';setTimeout(function(e){if(!self.CgiHref){document.close();e=parent.document.getElementById("ar_container_"+ar_bnum);e.parentNode.removeChild(e)}},3000);', Y='<\/sc'+'ript><sc'+'ript type="text/javascript" src="'+L+'&tail256='+escape(D.referrer||'unknown')+'&rnd='+Math.round(Math.random()*999999999)+'"><\/sc'+'ript>'; function G(){if(T++<100){var o=D.getElementById('ar_container_'+N);if(o){try{var d=o.contentDocument||(W.ActiveXObject&&W.frames['ar_container_'+N].document);if(d){d.write(X+Y)}else setTimeout(arguments.callee,100)}catch(e){try{o.src = "javascript:{document.write('"+X+'document.domain="'+D.domain+'";'+Y+"')}";return}catch(E){}}}else setTimeout(arguments.callee,100)}} function A(e,t,f){if(e.addEventListener)e.addEventListener(t,f,false);else if(e.attachEvent)e.attachEvent('on'+t,f)} function R(e,t,f){if(e.removeEventListener)e.removeEventListener(t,f,false);else if(e.detachEvent)e.detachEvent('on'+t,f)} function S(){var ch=self.innerHeight||C&&E.clientHeight||D.body.clientHeight,st=self.pageYOffset||C&&E.scrollTop||D.body.scrollTop;if(P>=st&&st+ch>=P){R(W,'scroll',S);G()}} A(W,'load',function(){var o=D.getElementById('ad_ph_'+N);if(o){while(o.offsetParent){P+=o.offsetTop;o=o.offsetParent}A(W,'scroll',S);S()}}); D.write('<div style="position:absolute;visibility:hidden;height:0px;"><iframe id="ar_container_'+N+'" width=1 height=1 marginwidth=0 marginheight=0 scrolling=no frameborder=0><\/iframe><\/div><div id="ad_ph_'+N+'"><\/div>'); ar_cn++; } adriverPoster("http://ad.adriver.ru/cgi-bin/erle.cgi?sid=92926&target=top&bt=49&pz=0"); //--></script> <!-- AdRiver code END -->
AjaxJS
Используется для реализации сложных многопанельных баннеров с анимацией и взаимодействием панелей друг с другом. Основной код для баннеров такого типа вынесен в отдельный файл (библиотеку). Таким образом, при подключении библиотек, код на сайте сокращается всего до одной строки. Баннеры на AjaxJS-коде отображаются только тогда, когда загрузка сайта завершена.
Рекомендуем не указывать размер в теге div при размещении кода AjaxJS, так как в том случае, если баннер не сможет показаться, баннерное место просто схлопнется. Пример:
<div id="adriver_banner"></div> <script type="text/javascript" language=javascript> new adriver("adriver_banner", {sid:92926,sz:"main",bt:52,pz:0,bn:0}); </script>
Counter
Невидимый счётчик. Обычно размещается рядом с баннером, загруженным в стороннюю систему, для учёта статистики в AdRiver. Никак не влияет на дизайн страницы. Код counter размещается в теге img. Для тега img используйте стиль «width=0 height=0 border=0». Не используйте для тэга img стиль «display: nonе».
Пример верного размещения кода counter:
<img style="width:0px; height:0px; border:0px;" src="http://ad.adriver.ru/cgi-bin/rle.cgi?sid=94499&bt=21&pz=0&bid=704928&bn=704928&rnd=1757060575">