Функциональности баннеров

1.1. Управление событиями из HTML-баннеров

Чтобы сгенерировать событие для HTML-баннера, необходимо загрузить с сервера AdRiver определённый адрес. Адрес составляется следующим образом:

<script type="text/javascript">
	function ar_event(n) {
		if ((location.href.indexOf('mngcgi') !== -1)) return false;
		var d = document, b = d.body, send,
			src = ('https:' === location.protocol ? 'https:' : 'http:') + '//' + ar_rhost + '/cgi-bin/event.cgi?' + ar_p('bid', ar_bid) + ar_p('&sid', ar_sid) + ar_p('&bt', ar_bt) + ar_p('&ad', ar_ad) + ar_p('&ntype', ar_ntype) + ar_p('&nid', ar_nid) + ar_p('&sliceid', ar_sliceid) + ar_p('&rnd', ar_rnd) + ar_p('&xpid', ar_xpid) + '&type=';

		if (b) {
			send = function(src) {
				var i = d.createElement('img');
				i.style.width = i.style.height='0px'; i.style.position = 'absolute';
				i.onload = i.onerror = function(){b.removeChild(i)};
				i.src = src;
				b.insertBefore(i, b.firstChild);
			}
		} else { send = function(src) { new Image().src = src; } }

		send(src + n);
		ar_event = function(n) { send(src + n); }
	}

	ar_event(0);
</script>

Для учета событий вызовите функцию ar_event(n), где n – номер события. В примере указан номер 0.

Вставьте в код необходимый номер события.

Примечание: События нумеруются от 0 до 9. События с номерами больше 9 рассматриваются как ошибка и не засчитываются. События с 1 по 9 засчитываются только если произошло событие 0.

Примечание: Если вы используете функцию подсчета Viewability баннера, то использовать 0-ое событие нельзя, т.к. оно автоматически вызывается для подсчета Viewability.

1.2. Управление событиями из JavaScript-баннеров

Чтобы сгенерировать событие для JavaScript-баннера, необходимо загрузить с сервера AdRiver определённый адрес. Адрес составляется следующим образом:

function ar_event(n) {
	if ((location.href.indexOf('mngcgi') !== -1)) return false;

	var d = document, b = d.body, send,
		p = function(param, value) { return typeof(value) === 'undefined' ? '' : param + '=' + value; },
		src = ('https:' === location.protocol ? 'https:' : 'http:') + '//' + ar_rhost + '/cgi-bin/event.cgi?' + p('bid', bid) + p('&sid', ar_siteid) + p('&bt', ar_bt) + p('&ad', ar_adid) + p('&ntype', ar_ntype) + p('&nid', ar_nid) + p('&sliceid', sliceid) + p('&rnd', RndNum4NoCash) + p('&xpid', ar_xpid) + '&type=';

	if (b) {
		send = function(src) {
			var i = d.createElement('img');
			i.style.width = i.style.height='0px'; i.style.position = 'absolute';
			i.onload = i.onerror = function(){b.removeChild(i)};
			i.src = src;
			b.insertBefore(i, b.firstChild);
		}
	} else { send = function(src) { new Image().src = src; } }

	send(src + n);
	ar_event = function(n) { send(src + n); }
}

ar_event(0);

Для учета событий вызовите функцию ar_event(n), где n – номер события. В примере указан номер 0.

Примечание: События с 1 по 9 засчитываются, только если произошло событие 0.

Примечание: Если вы используете функцию подсчета Viewability баннера, то использовать 0-ое событие нельзя, т.к. оно автоматически вызывается для подсчета Viewability.

Для автоматической загрузки используется плагин autoLoad.adriver, который находит на странице все баннерные места c классом adriverBanner, инициализирует их и загружает все баннеры.

Примечание: Запрещается размещать стандартные плагины AdRiver на сторонних сайтах, так как это может привести к некорректному отображению баннеров.

Все значения параметров по умолчанию указываются в теге META документа, а на странице размещаются баннерные места, в data-Adriver которых задаются переменные параметры запроса к AdRiver. Для всех баннерных мест должен быть указан класс adriverBanner.

Примечание: Для обеспечения работы технологии необходимо дополнительно связаться со службой технической поддержки по вопросу использования мультизапросов.

2.1. Подключение библиотеки и плагина

Скачайте библиотеку Adriver.Core, разместите на вашем сайте и подключите её следующим образом:

<script type="text/javascript" src="adriver.core.2.js"></script>

Для автоматической загрузки используется плагин autoLoad.adriver. Подключите его следующим образом:

<script type="text/javascript"> 
	 new adriver.Plugin.require("autoLoad.adriver");
</script>

2.2. Идентификация и инициализация баннерного места

Разделим параметры вызова баннера на параметры по умолчанию, которые постоянны для данного сайта и переменные параметры для каждого конкретного баннерного места. Все значения параметров по умолчанию вынесем в тег META документа. Все переменные параметры зададим в data-Adriver баннерного места.

Параметры по умолчанию:

<meta name="adriverDefaults" content="sid:12345, bt:52" /> 

Укажем, что используется автоматическая загрузка нескольких баннеров:

<meta name="adriverOptions" content="autoLoad:1" /> 

Если поставить autoLoad:0, то автоматическая загрузка баннеров будет отключена.

Переменные параметры для каждого конкретного баннерного места:

<div id="top_banner" class="ext90 adriverBanner" data-Adriver="pz:1,bn:1"></div>

2.3. Пример размещения кода Ajax на странице сайта

<html>
<head>

<!-- Указать постоянные параметры -->
<meta name="adriverDefaults" content="sid:12345, bt:52" /> 

<!-- Указать, что используется автоматическая загрузка -->
<meta name="adriverOptions" content="autoLoad:1" />

<!-- Подключить библиотеку -->
<script type="text/javascript" src="adriver.core.2.js"></script>

<!-- Подключить плагины -->
<script type="text/javascript"> 
	 new adriver.Plugin.require("autoLoad.adriver");
</script>


</head>
<body>

<!-- Идентифицировать баннерное место top_banner -->
<div id="top_banner" class="ext90 adriverBanner" data-Adriver="pz:1,bn:1"></div>

<!-- Идентифицировать баннерное место left_banner -->
<p id="left_banner" class="html240 adriverBanner blockBanner" data-Adriver="pz:2,bn:2"></p>


</body>
</html>

3.1. Подключение библиотеки и плагина

Скачайте библиотеку Adriver.Core, разместите ее на вашем сайте и подключите следующим образом:

<script type="text/javascript" src="adriver.core.2.js"></script>

Для отложенной загрузки используется плагин onScroll.adriver. Подключите его следующим образом:

<script type="text/javascript">new adriver.Plugin.require("onScroll.adriver");</script>

3.2. Идентификация и инициализация баннерного места

Параметры вызова баннера разделяются на параметры по умолчанию, которые постоянны для данного сайта, и переменные параметры, которые индивидуальны для каждого баннерного места.

Все значения параметров по умолчанию выносятся в тег META документа. Все переменные параметры задаются в data-adriver баннерного места.

Параметры по умолчанию:

<meta name="adriverDefaults" content="sid:12345, bt:52" /> 

Для загрузки баннера по доскроллу (после попадания баннерного места в область видимости) обязательно должна быть включена автоматическая загрузка баннеров. Для включения автоматической загрузки баннеров укажите параметр autoLoad со значением 1:

<meta name="adriverOptions" content="autoLoad:1" /> 

Если поставить autoLoad:0, то автоматическая загрузка баннеров будет отключена, и баннер при доскролле до баннерного места загружен не будет.

Переменные параметры для конкретного баннерного места:

<div id="banner1" class="ext90 adriverBanner" data-adriver="pz:1,bn:1,onScroll: true"></div>

Баннерное место обязательно должно иметь класс adriverBanner.

Для отложенной загрузки необходимо в параметрах переменной onScroll указать значение true.

3.3. Пример размещения кода Ajax на странице сайта

<html>
<head>

<!-- Указать постоянные параметры -->
<meta name="adriverDefaults" content="sid:12345, bt:52" /> 

<!-- Указать, что используется автоматическая загрузка -->
<meta name="adriverOptions" content="autoLoad:1" />

<!-- Подключить библиотеку -->
<script type="text/javascript" src="adriver.core.2.js"></script>

<!-- Подключить плагин -->
<script type="text/javascript">new adriver.Plugin.require("onScroll.adriver");</script>


</head>
<body>

<!-- Идентифицировать баннерное место banner1 -->
<div id="banner1" class="ext90 adriverBanner" data-adriver="pz:1,bn:1,onScroll: true"></div>


</body>
</html>

4.1. Подготовка кода для размещения на сайте

• Скопируйте скрипт ниже и вставьте его в новый текстовый файл

  <script type="text/javascript">
  if(typeof(ar_cn)=="undefined") var ar_cn=1;
  document.write('<div id="ad_ph_'+ar_cn+'"></div>');
  
  (function(num,link,w,h){
  	function addEvent(e,t,f){
  		if (e.addEventListener) e.addEventListener(t, f, false);
  		else if (e.attachEvent) e.attachEvent('on'+t, f)
  	}
  	function removeEvent(e,t,f){
  		if (e.removeEventListener) e.removeEventListener(t, f, false);
  		else if (e.detachEvent) e.detachEvent('on'+t, f)
  	}	
  	function ar_getDoc(){
  		if (typeof ar_twins_shown=='undefined') ar_twins_shown = 1;
  		else return;
  	
  		var RndNum4NoCash = Math.round(Math.random() * 1000000000);
  		var ar_Tail = document.referrer ? escape(document.referrer) : 'unknown';
  		
  		document.getElementById('ad_ph_'+num).innerHTML = '<iframe src="' + link + '&rnd=' + RndNum4NoCash + '&tail256=' + ar_Tail
  			+ '" frameborder=0 vspace=0 hspace=0 width="'+w+'" height="'+h+'" marginwidth=0 marginheight=0 scrolling=no></iframe>';
  	}
  
  	var BannerLoader = {
  		top: 0,
  		cm: document.compatMode == "CSS1Compat",
  
  		scroll: function (){
  			var ch = self.innerHeight || this.cm && document.documentElement.clientHeight || document.body.clientHeight;
  			var st  = self.pageYOffset || this.cm && document.documentElement.scrollTop || document.body.scrollTop;
  			if (this.top >= st && st + ch >= this.top) {
  				removeEvent(window, 'scroll', this.sfunc);
  				ar_getDoc()
  			}
  		},
  
  		sfunc: function(){BannerLoader.scroll()},
  
  		init: function(){
  			var t = this;
  			var obj = document.getElementById('ad_ph_'+num);
  			if (obj){
  				while(obj.offsetParent){t.top += obj.offsetTop; obj = obj.offsetParent}
  				addEvent(window, 'scroll', this.sfunc);
  				t.scroll();
  			}
  		}
  	};
  
  	addEvent(window, 'load', function(){BannerLoader.init()});
  //***************** editable block ***************************
  })(ar_cn++, 'http://ad.adriver.ru/cgi-bin/erle.cgi?sid=130599&target=_blank&bt=1&pz=0', '468', '60');
  //********************** end *********************************
  </script>
  

• Найдите строку, помеченную, как editable block (находится в самом низу)
• Замените в ссылке выделенные красным параметры на ваши параметры сайта и баннерного места. Эти параметры вы можете увидеть, сгенерировав код для баннера в интерфейсе системы. Обратите внимание, что вставлять в ссылку на показ &rnd и &tail256 не надо — они подставляются скриптом автоматически
• Впишите ваши размеры баннера.

4.2. Размещение кода

Подготовленный код разместите в двух нужных местах на странице. Покажется баннер на том коде, который первый окажется в видимой области страницы. Баннер на другом коде не будет показываться и не будет отправлять в AdRiver запрос.

Слайс, переданный в рекламную кампанию, должен быть того же типа, что и баннер.

1. Получите скрипт для каждого текстово-графического блока, используя инструкцию

2. Настройте рекламную кампанию следующим образом:
   • Создайте три сценария
   • Добавьте в каждый из них баннер типа special -> AjaxJS -> Generic AjaxJS и загрузите в них материалы: сформированный скрипт (пункт 1) и картинку
   • Старгетируйте каждый сценарий по номеру баннера (bn) 1, 2, 3 соответственно
   • Передайте в кампанию слайс типа AjaxJS
3. Получите код типа extension для своего сайта в интерфейсе системы в разделе Сайты. Если для определения баннерных мест на страницах используются параметры баннерного места (bn, pz,sz), то их необходимо указать при генерации HTML-кода.

   <!--  AdRiver code START. Type:extension Site: atest PZ: 0 BN: 4 -->
   <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=174329&bn=4&target=top&bt=43&pz=0&tail256=');
   </script>
   <!--  AdRiver code END  -->
   

4. Модифицируйте полученный код, оставив часть кода, выделенную красным. Пример:

   http://ad.adriver.ru/cgi-bin/erle.cgi?sid=174329&bn=4&target=top&bt=43&pz=0&tail256= 

5. Разместите код вызова на странице сайта:
   • Определите баннерное место на странице:

     <div id="adriver_TGB"></div>
     

   • Разместите на странице следующий скрипт (он должен располагаться после баннерного места):

     <script type="text/javascript">
     var siteID    = ЗАДАЙТЕ НОМЕР ВАШЕГО САЙТА В СИСТЕМЕ;  // Номер вашего сайта в системе  sid
     var bnList = [1,2,3];    
     var bannerPlace = 'adriver_TGB'; 
     var extensionURL= 'http://ad.adriver.ru/cgi-bin/erle.cgi?sid=174329&bn=4&target=top&bt=43&pz=0&tail256='; // Установите код из пункта 4
     (function() {
     var ID=[],N=bnList.length;i=N,t=document.getElementById(bannerPlace).appendChild(document.createElement('TABLE')), tgb=[];
     while(i--){ID[i]=i+1};ID.sort(function(){return 0.5-Math.random()});
     tr=t.insertRow(-1);for(i=1;i<=N;i++){tr.insertCell(0).id='_'+i;}; 
     for(i=0;i<N;i++){tgb[i]=new adriver('_'+ID[i],{sid:siteID,bt:52,bn:bnList[i]})};
     var i1=0,n1=50;
     (function() {
         var args = arguments,r=true;
     	for(i=0;i<N;i++) {
     	   if(tgb[i].reply) {if(tgb[i].reply.bid!=399800) return;}
     	   else {r=false;}
     	}; 
     	if(!r) {if (i1++<n1) {setTimeout(function(){args.callee();},100); return;}}(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);}}
     document.getElementById(bannerPlace).innerHTML='<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++;
     })(extensionURL);
     })();
     })();
     </script>

     Переменные:

     • siteID — ID сайта в AdRiver, укажите ID вашего сайта.
     • bnList — список параметров bn – номера баннеров на странице, соответствующие настройкам текстово-графических блоков. Укажите числа через запятую.
     • bannerPlace — идентификатор баннерного места.
     • extensionURL — ссылка для загрузки баннера Extension, полученная в п.4.

Для создания динамической ссылки баннера выполните следующие действия:

1. Добавьте баннер
2. В поле Линк Баннера впишите ссылку вида:

   https://www.sitename.ru/![sdt11]/![sdt12]/

   Макросы ![sdt11] и ![sdt12] при клике по баннеру подставят переданные значения параметра custom, указанные в кликовой сслыке баннера

3. На странице редактирования баннера поставьте галочку Кликовый баннер
4. Скопируйте кликовую ссылку для баннера (кликовую ссылку можно получить на странице редактирования баннера). Пример кликовой сылки:

   https://ad.adriver.ru/cgi-bin/click.cgi?sid=1&ad=568823&bt=2&pid=2245780&bid=4327920&bn=4327920&rnd=329113546

5. Допишите в конец ссылки параметр custom:

   https://ad.adriver.ru/cgi-bin/click.cgi?sid=1&ad=568823&bt=2&pid=2245780&bid=4327920&bn=4327920&rnd=329113546&custom=11=value1;12=value2

   Замените value1 и value2 на ваши значения

В результате указанных изменений, при клике URL-баннера преобразуется в ссылку:

https://www.sitename.ru/value1/value2/