AdRiver - система управления интернет-рекламой
О компании Вход в систему Справочное руководство Контакты
Рекламным агентствам
Владельцам сайтов
Управление рекламой
Технические требования

ScreenGlide

1. Карточка баннера

Номер: 26H039.
Краткое описание: баннер раскрывается по наведению на него курсора мыши, закрывая контент страницы.
Тип кода: ajax, poster, extension.
Примеры: Баннер МТС.
Обсчёт внешними системами: пиксель-аудит в flash-баннерах.
Техническое описание: рекламный модуль ScreenGlide представляет собой баннер небольшого размера, который показывается посетителю сайта при загрузке страницы. При наведении на него курсора мыши, баннер раскрывается до своего полного размера. При этом контент страницы закрывается. При переводе курсора мыши с рекламного модуля, баннер принимает свою первоначальную форму. Стандартный ScreenGlide может в качестве креативов принимать изображения. При этом, если ссылки не оканчиваются на .swf, то креативы также считаются картинками.
Другие названия формата: скринглайд.

Рекомендуется использовать код вызова poster только в случае необходимости показывать баннер при доскролле до баннерного места, так как данная технология задерживает загрузку баннера до окончания загрузки основной страницы. В остальных случаях рекомендуется использовать код вызова extension.

2. Подготовка flash-ролика на всех кодах

Подготовьте два flash-ролика: большой и маленький. Для маленького flash-ролика подготовьте заглушку (.gif или .jpeg). Она показывается тем посетителям сайта, у которых нет необходимой версии flash-плагина. Размеры заглушки и маленького flash-ролика должны совпадать.

В первом кадре flash-ролика пропишите следующие команды:

if(ar_init == undefined){
 ar_init = true;
 System.security.allowDomain(_parent._url);
}

System.security.allowDomain(_parent._url) разрешает доступ загрузчику к переменным баннера и позволяет правильно инициализировать переменную для клика (link1). При этом в загрузчике не нужно специально разрешать доступ для загружаемых роликов.

Для того, чтобы зарегистрировать событие «клик» создайте элемент button (при наведении курсора мыши на такой элемент, он изменяется). Для того, чтобы перейти по клику используется функция getURL. Ей передаётся два параметра: куда переходить — переменная link1 и _blank — значение переменной target, чтобы открывать ссылку баннера в новом окне.

В вашем flash-ролике сделайте элемент button. Для этого элемента напишите следующий код:

on (release) {
       getURL(_root.link1, "_blank");
}

Обязательно используйте переменную link1 для подсчёта кликов.

Для того, чтобы открывать ссылку баннера в том же окне, укажите во flash-ролике _top.

Если вы, как рекламная площадка, используете AdRiver в качестве основной системы управления рекламой на сайте, то в flash-ролике пропишите скрипт:

on (release) {
       getURL(_root.link1, _root.target);
}

Это позволит открывать ссылку баннера согласно тому параметру, который указан в коде рекламного места.

Размер загружаемых файлов должен соответствовать спецификации.

3. Подготовка скрипта

3.1. На коде ajax

Распакуйте пример. Откройте текстовым редактором файл script.js. Внесите изменения в верхнюю часть скрипта, отмеченную как Editable block.

var 	ar_img_name	= '0.gif',
	smallflashname	= '1.swf',
	ar_width_small	= '240',
	ar_height_small	= '400',
	bigflashname	= '0.swf',
	ar_width_big	= '480',
	ar_height_big	= '400',
	ar_valign	= '1',
	ar_align	= '1',
	ar_flashver	= '8',
	ar_alt_link	= '',
	ar_zeropixel	= '',
	ar_wmode	= 'opaque';

Переменные:

  • ar_img_name — имя заглушки. Укажите ваше имя файла. Может быть загружена со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://».
  • smallflashname — имя малого flash-ролика. Укажите ваше имя файла. Может быть загружен со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://». Если вы используете изображения в качестве креативов, впишите имя файла.
  • ar_width_small — ширина малого flash-ролика. Укажите ваше значение.
  • ar_height_small — высота малого flash-ролика. Укажите ваше значение.
  • bigflashname — имя большого flash-ролика. Укажите ваше имя файла. Может быть загружен со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://». Если вы используете изображения в качестве креативов, впишите имя файла.
  • ar_width_big — ширина большого flash-ролика. Укажите ваше значение.
  • ar_height_big — высота большого flash-ролика. Укажите ваше значение.
  • ar_valign — разворот по вертикали. Впишите 0, если баннер должен разворачиваться вверх; 1, если баннер должен разворачиваться вниз; 3, если баннер должен разворачиваться к центру.
  • ar_align — разворот по горизонтали. Впишите 0, если баннер должен разворачиваться влево; 1, если баннер должен разворачиваться вправо; 3, если баннер должен разворачиваться к центру.
  • ar_flashver — версия flash-плагина, которая необходима посетителю для просмотра flash-роликов. Проверяйте соответствие flash-плагина и роликов.
  • ar_alt_link — альтернативный клик по заглушке. Если не нужен, оставьте пустым.
  • ar_zeropixel — вызов стороннего счётчика для баннера. Если не нужен, оставьте пустым.
  • ar_wmode — прозрачность (wmode). Можно указать одно из значений:
    • transparent (прозрачный) — делает прозрачными области flash-ролика, не заполненные графикой, сквозь прозрачный фон видны другие элементы страницы.
    • opaque (непрозрачный) — все области flash-ролика становятся непрозрачными (значение по умолчанию), flash-ролик перекрывает другие элементы страницы.
    • window (в своём окне) — flash-ролик отображается в самом верхнем слое (в собственном окне), независимо от прочего контента на странице.

Сохраните файл script.js, баннер готов к загрузке.

3.2. На коде poster

Распакуйте пример. Откройте текстовым редактором файл script.js. Внесите изменения в верхнюю часть скрипта, отмеченную как Editable block.

var gifname			= '0.gif',
	smallflashname	= 'small.swf',
	ar_height_small	= '90',
	ar_width_small	= '100%',
	bigflashname	= 'big.swf',
	ar_width_big	= '100%',
	ar_height_big	= '200',
	ar_valign		= '1',
	ar_align		= '1',
	ar_flashver		= 8,
	ar_alt_link		= '',
	ar_pixel		= '',
	ar_wmode		= 'opaque';

Переменные:

  • gifname — имя заглушки. Укажите ваше имя файла. Может быть загружена со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://».
  • smallflashname — имя малого flash-ролика. Укажите ваше имя файла. Может быть загружен со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://». Если вы используете изображения в качестве креативов, впишите имя файла.
  • ar_width_small — ширина малого flash-ролика. Укажите ваше значение.
  • ar_height_small — высота малого flash-ролика. Укажите ваше значение.
  • bigflashname — имя большого flash-ролика. Укажите ваше имя файла. Может быть загружен со стороннего сервера — в этом случае впишите полный адрес, начинающийся с «http://». Если вы используете изображения в качестве креативов, впишите имя файла.
  • ar_width_big — ширина большого flash-ролика. Укажите ваше значение.
  • ar_height_big — высота большого flash-ролика. Укажите ваше значение.
  • ar_valign — разворот по вертикали. Впишите 0, если баннер должен разворачиваться вверх; 1, если баннер должен разворачиваться вниз; 3, если баннер должен разворачиваться к центру.
  • ar_align — разворот по горизонтали. Впишите 0, если баннер должен разворачиваться влево; 1, если баннер должен разворачиваться вправо; 3, если баннер должен разворачиваться к центру.
  • ar_flashver — версия flash-плагина, которая необходима посетителю для просмотра flash-роликов. Проверяйте соответствие flash-плагина и роликов.
  • ar_alt_link — альтернативный клик по заглушке. Если не нужен, оставьте пустым.
  • ar_pixel — вызов стороннего счётчика для баннера. Если не нужен, оставьте пустым.
  • ar_wmode — прозрачность (wmode). Можно указать одно из значений:
    • transparent (прозрачный) — делает прозрачными области flash-ролика, не заполненные графикой, сквозь прозрачный фон видны другие элементы страницы.
    • opaque (непрозрачный) — все области flash-ролика становятся непрозрачными (значение по умолчанию), flash-ролик перекрывает другие элементы страницы.
    • window (в своём окне) — flash-ролик отображается в самом верхнем слое (в собственном окне), независимо от прочего контента на странице.

Сохраните файл script.js, баннер готов к загрузке.

4. Загрузка баннера

4.1. На коде extension

  • Добавьте баннер типа ScreenGlide (special --> special --> ScreenGlide).
  • Укажите Линк Баннера и другие параметры при необходимости.
  • Нажмите на кнопку Добавить, включите баннер, укажите распределение в течение дня.
  • Кликните по ссылке Загрузить баннер, в открывшемся окне загрузите файлы для баннера: заглушку, малый и большой flash-ролики. Укажите другие необходимые параметры.
  • Нажмите на кнопку Загрузить.

4.2. На коде poster

  • Добавьте баннер типа genericposter (special --> special --> genericposter).
  • Укажите Линк Баннера и другие параметры при необходимости.
  • Нажмите на кнопку Добавить, включите баннер, укажите распределение в течение дня.
  • Кликните по ссылке Загрузить баннер, в открывшемся окне загрузите файлы для баннера: скрипт, заглушку, малый и большой flash-ролики.
  • Нажмите на кнопку Загрузить.

Или (загружать скрипт не нужно)

  • Добавьте баннер типа SG-Poster (special --> special --> SG-Poster).
  • Укажите Линк Баннера и другие параметры при необходимости.
  • Нажмите на кнопку Добавить, включите баннер, укажите распределение в течение дня.
  • Кликните по ссылке Загрузить баннер, в открывшемся окне загрузите файлы для баннера: заглушку, малый и большой flash-ролики. Укажите другие необходимые параметры.
  • Нажмите на кнопку Загрузить.

4.3. На коде ajax

  • Добавьте баннер типа Generic AjaxJS (special --> special --> Generic AjaxJS).
  • Укажите Линк Баннера и другие параметры при необходимости.
  • Нажмите на кнопку Добавить, включите баннер, укажите распределение в течение дня.
  • Кликните по ссылке Загрузить баннер, в открывшемся окне загрузите файлы для баннера: скрипт, заглушку, малый и большой flash-ролики.
  • Нажмите на кнопку Загрузить.

5. Полезные ссылки

Последнее обновление: 29.07.2011
← Rich-media    ScreenGlideMove →
Поиск