Главная   ·   Справка   ·   Справка издателям   ·   Прикладные решения   ·   Размещение на сайте кода Ajax

Размещение на сайте кода Ajax

Для размещения на сайте кода вызова AjaxJS2.0 требуется подключить специальную библиотеку, идентифицировать и инициализировать баннерное место.

Для региональных кодов рекомендуется скачать библиотеку adriverCore2 для соответствующего региона:

Для остальных регионов России и стран мира подходит стандартная библиотека Core2.

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

1. Подключение библиотеки

На странице, где будет вызываться баннер, подключите библиотеку в тэгах <head>. Пример подключения:

<head>

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

</head>

Библиотека подключается только один раз, независимо от количества баннеров на странице.

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

Идентификация баннерного места — это определение элемента, который используется в качестве баннерного места в вёрстке страницы.

В качестве баннерного места может использоваться любой элемент, имеющий идентификатор (id), например, DIV, SPAN, A, Li, P и др.

Для определения баннерного места используется id элемента, в котором будет показываться баннер в вёрстке страницы. К параметру class всех баннерных мест рекомендуется (в некоторых случаях это обязательно) добавить последним описанием adriverBanner. Остальные описания класса могут быть использованы для того, чтобы задать визуальное представление баннерного места.

Пример баннерного места на странице:

<div id="top_banner" class="ext90 adriverBanner"></div>

Примечание: Длина id баннерного места не должна превышать 32-х символов.

3. Инициализация баннерного места

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

new adriver("top_banner");

Эта команда создаст экземпляр класса adriver и загрузит соответствующий баннер.

Также необходимо указать параметры запроса к AdRiver. В запросе к AdRiver стандартно указывается несколько параметров баннерного места: идентификаторы сайта, зоны сайта, зоны страницы, номер баннера и некоторые другие. Эти параметры можно указать непосредственно при создании экземпляра класса adriver. Например:

new adriver("top_banner", {sid: 12345, sz: "main", pz: 0, bn: 1, bt:52});

Данная команда создает экземпляр класса adriver, который имеет идентификатор “top_banner” и находится на сайте с id 12345, зоной сайта “main”, зоной страницы 0, номером баннера 1.

Другой пример инициализации баннерного места:

new adriver("left_banner", {sid: 12345, sz: "main", pz: 1, bn: 2, bt:52});

Данная команда создает экземпляр класса adriver, который имеет идентификатор “left_banner” и находится на сайте с id 12345, зоной сайта “main”, зоной страницы 1 (верх), номером баннера 2.

Параметры, используемые в запросе:

  • adriver_banner — идентификатор элемента, в который надо загрузить баннер (т.е. тот id, который был указан при идентификации баннерного места)
  • sid, sz, pz, bn, bt— параметры баннерного места:
    • sid — id сайта в AdRiver;
    • sz — зона сайта. Если зона сайта не определена, параметр можно не указывать
    • pz— зона страницы: 0 — любая, 1 — верх, 2 — середина, 3 — низ
    • bn— номер баннера на странице
    • bt— обязательный параметр. Его нельзя удалять или изменять

4. Пример размещения кода AjaxJS2.0. на странице сайта

<html>
<head>

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

</head>
<body>

<!-- Идентифицируем баннерное место top_banner -->
<div id="top_banner" class="ext90 adriverBanner"></div>

<!-- Идентифицируем баннерное место left_banner -->
<div id="left_banner" class="flash240 adriverBanner"></div>

<!-- Инициализируем баннерные места -->
<script type="text/javascript"> 
	new adriver("top_banner", {sid: 12345, sz: "main", pz: 1, bn: 1, bt:52});
	new adriver("left_banner", {sid: 12345, sz: "main", pz: 2, bn: 2, bt:52});
</script>

</body>
</html>

В данном примере идентифицируются два баннерных места: top_banner и left_banner. После чего баннерные места top_banner и left_banner инициализируются и передают в AdRiver необходимые параметры. Инициализировать все баннерные места в одном месте страницы, как в приведенном примере, необязательно. Можно инициализировать каждое баннерное место отдельно. Тогда код инициализации баннеров top_banner и left_banner выглядел бы так:

<!--Инициализация баннерного места top_banner-->
<script type="text/javascript"> 
	new adriver("top_banner", {sid: 12345, sz: "main", pz: 1, bn: 1, bt:52});
</script>
...
<!--Инициализация баннерного места left_banner-->
<script type="text/javascript"> 
	new adriver("left_banner", {sid: 12345, sz: "main", pz: 2, bn: 2, bt:52});
</script>

В случае, если вы генерируете код вызова баннера AjaxJS в интерфейсе системы AdRiver, код идентификации и инициализации соответствующего баннерного места генерируется автоматически, и вам остается просто его скопировать и разместить на сайте. Ниже приведен полученный в интерфейсе код для баннера Ajax:

<!--  AdRiver code START. Type:AjaxJS Site: yoursite PZ: 1 BN: 0 -->
<div id="adriver_banner_1721846881"></div>

<script type="text/javascript">
new adriver("adriver_banner_1721846881", {sid:199026, bt:52, pz:1});
</script>

<!--  AdRiver code END  -->

В данном примере красным выделена идентификация баннерного места, а зеленым – инициализация баннерного места. ID баннерного места генерируется автоматически и состоит из adriver_banner+уникальный идентификатор баннера. При необходимости ID баннерного места можно изменить, однако в таком случае крайне важно помнить, что ID баннерного места при его идентификации и ID баннерного места при его инициализации должны полностью совпадать, иначе баннер просто не сможет загрузиться.

Таким образом, для размещения на сайте кода AjaxJS 2.0. необходимо выполнить следующие шаги:

  1. Подключить библиотеку https://content.adriver.ru/adriver.core.2.js в тегах head страницы.
  2. Получить в интерфейсе AdRiver код HTML в соответствии с инструкцией, выбрав в качестве типа баннера AiaxJS.