Реклама в видеоплеере
Общие положения
VAST — это стандарт, описывающий процесс отображения баннеров видеоплеером и отправку статистики на рекламный сервер.
Для встраивания рекламы используются международные стандарты медиаиндустрии. В этой статье описываются конечные решения в рамках этих стандартов.
Показ рекламы выглядит следующим образом: плеер делает запрос за видеобаннером, отображает содержимое VAST-ответа и отсылает статистику о показах и других событиях в ADFOX (статистику так же можно отправлять в сторонние системы с помощью пикселей). Это может происходить как напрямую между видеоплеером и ADFOX, так и между видеоплеером, ADFOX и сторонним рекламным сервером. При обращении к ADFOX плеер получает VAST XML, пример.
- Запрос за рекламой — видеоплеер посылает запрос в ADFOX для получения VAST.
- VAST ответ — ADFOX присылает VAST, в котором содержатся ссылки на медиафайлы и события, необходимые для отображения и сбора статистики по баннеру.
- Отправка статистики — по мере наступления событий при воспроизведении рекламы (ролик загружен, первая четверть и т. д.) плеер отправляет статистику о них в ADFOX.
- Запрос за рекламой — видеоплеер делает запрос в ADFOX для получения VAST.
VAST редирект (Wrapper) — ADFOX отправляет в ответ VAST, в котором содержатся ссылки на события, а так же URI стороннего сервера рекламы в тегах
<VASTAdTagURI></VASTAdTagURI>
.Пример Wrapper ответа от ADFOX:
<?xml version="1.0" encoding="UTF-8"?> <VAST version="2.0"> <Ad id="%campaignId%-%user1%"> <Wrapper> <AdSystem>Adfox</AdSystem> <VASTAdTagURI> <![CDATA[ССЫЛКА НА СТОРОННИЙ СЕРВЕР РЕКЛАМЫ]]> </VASTAdTagURI> <Error> <![CDATA[%event20%]]> </Error> <Impression> <![CDATA[%event3%]]> </Impression> <Creatives> <Creative> <Linear> <TrackingEvents> ... </TrackingEvents> <VideoClicks> <ClickTracking> <!![CDATA[%request.reference_mrc%]]> </ClickTracking> </VideoClicks> </Linear> </Creative> </Creatives> <Extensions> ... </Extensions> </Wrapper> </Ad> </VAST>
- Запрос за рекламой — после обработки VAST-ответа от ADFOX видеоплеер делает запрос к стороннему серверу рекламы, используя URI, который ADFOX прислал внутри тегов
<VASTAdTagURI></VASTAdTagURI>
. - Отправка статистики — по мере наступления событий при воспроизведении рекламы (ролик загружен, первая четверть и т. д.) плеер отправляет статистику о них в ADFOX и на сторонний сервер рекламы путем отправки запросов по ссылкам из VAST.
Wrapper
со ссылкой на сторонний сервер рекламы. Сторонний сервер может отдать баннер Linear Ad или Wrapper, который ссылается на еще один сервер рекламы. В конечном счете последний сервер в цепочке должен отдать все необходимые файлы для отображения рекламы.Доступные предзаданные шаблоны
Linear Ads Video
Реклама на весь кадр, которая приостанавливает воспроизведение видеоконтента. Обычно это видеореклама, но могут использоваться статичные изображения, которые отображаются в определенное время. Такой тип рекламы может проигрываться до воспроизведения видеоконтента (pre-roll), в перерыве во время воспроизведения контента (mid-roll) или после воспроизведения видео (post-roll).
Тип содержимого — видеофайл.
- Linear-Ad (Pre / Mid / Post - Roll) VAST 3.0 Viewability
-
Шаблон с проверкой видимости. Если более 50% плеера находится в пределах области видимости, через 2 секунды срабатывает событие видимости. Статистика по событию доступна в отчетах.
- Linear-Ad (Pre / Mid / Post - Roll) VAST 2.0 Compatible No Click
-
Шаблон для видео без поддержки клика.
- Linear-Ad (Pre / Mid / Post - Roll) VAST 3.0
-
Шаблон с поддержкой клика.
Linear Ads Audio
Тип содержимого — аудиофайл.
- Linear-Ad (Pre / Mid / Post - Roll) Audio VAST 3.0
-
Шаблон для аудио без поддержки клика.
Nonlinear Ads
Наложенная реклама, отображаемая одновременно с воспроизведением основного видео. Обычно это статическое изображение, размещенное в проигрывателе и занимающее часть области плеера.
- Non-Linear ADFOX Overlay Image VAST 3.0
-
Шаблон для показа изображения поверх видео. Тип содержимого — изображение.
Параметры при добавлении в ADFOX:
- Изображение — файл или ссылка на изображение.
- Ширина — ширина изображения.
- Высота — высота изображения.
- Нижний отступ — отступ от нижней границы плеера в процентах.
- URL перехода — ссылка, на которую осуществляется переход при клике.
box-shadow
— CSS-свойство, описывающее стиль тени, отбрасываемой изображением на видео.
Обязательные параметры — изображение, ширина и высота.
- Non-Linear ADFOX Overlay HTML VAST 3.0
-
Шаблон для отображения произвольного HTML поверх видео. Тип содержимого — HTML-код. Вся область баннера кликабельная.
Параметры при добавлении в ADFOX:
- HTML-код — HTML-код креатива.
- Ширина — ширина iframe-баннера.
- Высота — высота iframe-баннера.
- Нижний отступ — отступ от нижней границы плеера в процентах.
- URL перехода — ссылка, на которую осуществляется переход при клике.
box-shadow
— CSS-свойство, описывающее стиль тени, отбрасываемой изображением на видео.
Обязательные параметры — HTML-код, ширина и высота.
- Non-Linear ADFOX Overlay HTML Custom VAST 3.0
-
Шаблон для отображения произвольного HTML поверх видео. Тип содержимого — HTML-код. Шаблон с возможностью задавать кликабельные области.
Параметры при добавлении в ADFOX:
- HTML-код — HTML-код креатива.
- Ширина — ширина iframe-баннера.
- Высота — высота iframe-баннера.
- Нижний отступ — отступ от нижней границы плеера в процентах.
- URL перехода — ссылка, на которую осуществляется переход при клике.
box-shadow
— CSS-свойство, описывающее стиль тени, отбрасываемой изображением на видео.
Обязательные параметры — HTML-код, ширина и высота.
Wrapper (VAST редирект)
Экземпляр VAST, который переадресует на другой URL для получения рекламы и содержит дополнительные пиксели. Используется для проброса сторонней рекламы и промера событий в ADFOX.
VAST 2.0 Wrapper может ссылаться на содержимое VAST 3.0, а VAST 3.0 Wrapper может ссылаться на VAST 2.0.
Тип содержимого — ссылка на VAST XML.
Доступные в ADFOX предзаданные шаблоны InPage
- Linear-Ad (Pre / Mid / Post - Roll) VAST 2.0 for InPage
-
Шаблон для содержимого типа «видеофайл».
- Linear-Ad (Pre / Mid / Post - Roll) VAST 3.0 for InPage Viewability
-
Шаблон для содержимого «видеофайл» c проверкой видимости.
- Wrapper VAST 2.0 for InPage
-
Шаблон для содержимого «Wrapper VAST XML».
Подробнее об использовании шаблонов см. раздел InPage video.
Получение ссылки на VAST XML
Ссылку на VAST можно получить, как и обычные коды вставки ADFOX.
Вместо кода будет ссылка следующего вида:
https://yandex.ru/ads/adfox/168627/getCode?p1=bigha&p2=eojh&puid1=&puid2=&puid3=
Проверка ссылок
Проверить ссылки можно на специальной странице.
Использование собственного плеера
- Подключите библиотеку ADSDK внутри тега
<head>
.<html xmlns="http://www.w3.org/1999/xhtml"> <head> <script type="text/javascript" charset="utf-8" src="https://yandex.ru/ads/system/adsdk.js"> </script> </head> </html>
- Объявите переменную: объект с параметрами ADFOX.
var adFoxParameters = { adFoxParameters: { ownerId: 168627, // ID родительского контейнера тега <video></video> containerId: 'videoParent', // Параметры ADFOX params: { p1: 'bdcfe', p2: 'ekza', pfc: 'bupfm', pfb: 'frtqn' }, } }
- Для старта проигрывания вызовите метод
play
, передав в него конфигурацию ADFOX.ya.videoAd.play({ // Видеоэлемент videoSlot: document.querySelector('#video'), // Элемент для показа контролов. Элемент не должен быть статически позиционирован. // Можно использовать родительский элемент видео. slot: document.querySelector('#videoParent'), // Конфиг загрузки и конфиг проигрывания рекламы. config: adFoxParameters, });
Инструкции по интеграции:
События
Предзаданные шаблоны в ADFOX содержат контейнер <TrackingEvents>
, внутри которого лежат теги <Tracking>
. Каждый элемент <Tracking>
содержит URI ADFOX, по которому видеоплеер должен делать запрос, когда наступает определенное событие. Название события передается в атрибуте event
.
Название | Событие |
---|---|
Ролик выбран | creativeView |
Начало просмотра | start |
Первая четверть просмотра | firstQuartile |
Середина просмотра | midpoint |
Третья четверть просмотра | thirdQuartile |
Окончание просмотра | complete |
Клик на крестик закрытия | close |
Выключить звук | Mute (слайдер управления громкостью рекламных роликов по умолчанию выставляется на 40%) |
Включить звук | Unmute (слайдер управления громкостью рекламных роликов по умолчанию выставляется на 40%) |
Название | Событие |
---|---|
Ролик выбран | creativeView |
Начало просмотра | start |
Первая четверть просмотра | firstQuartile |
Середина просмотра | midpoint |
Третья четверть просмотра | thirdQuartile |
Окончание просмотра | complete |
Клик на крестик закрытия | close |
Выключить звук | Mute (слайдер управления громкостью рекламных роликов по умолчанию выставляется на 40%) |
Включить звук | Unmute (слайдер управления громкостью рекламных роликов по умолчанию выставляется на 40%) |
Ответ в случае отсутствия рекламы
Когда нет подходящей рекламы для показа, ADFOX возвращает следующий XML:
- Тип баннера InStream:
<?xml version=”1.0”?><nobanner></nobanner>
- Тип баннера InPage:
<?xml version=”1.0”?><VAST version="2.0"/>
Чтобы добавить баннер по умолчанию для плеерной рекламы VAST, у вас должна быть ссылка запроса за рекламой. Поместите эту ссылку между квадратными скобками в блок VASTAdTagURI
:
<?xml version="1.0" encoding="UTF-8"?>
<VAST version="2.0">
<Ad id="%placeId%">
<Wrapper>
<AdSystem>AdFox.ru</AdSystem>
<VASTAdTagURI>
<![CDATA[//yandex.ru/ads/adfox/XXXXXX/getCode?p1=xxx&p2=xxx&pfc=a&pfb=a&plp=a&pli=a&pop=a&puid1=%userValue1%]]>
</VASTAdTagURI>
<Impression></Impression>
<Creatives></Creatives>
</Wrapper>
</Ad>
</VAST>
При необходимости передавать в пробрасываемый код запроса дополнительные параметры используйте макросы:
- для значений пользовательских характеристик:
puidN
со значением%request.puidN%
, гдеN
— номер характеристики. Пример:&puid1=%request.puid1%
; для передачи referer:
dl
со значением%request.referrer:urlenc%
. Пример:&dl=%request.referrer:urlenc%
.
Полученный код скопируйте и установите в поле XML-код баннера по умолчанию площадки и/или типа баннера.