Banner.Holder™Ad.Holder™Context.Holder™System.Holder™Video.Holder™

Логин


зарегистрироваться

Пароль


напомнить пароль

Система

Технические требования System.Holder™

1. Требования к FullScreen HTML5 баннерам для разработчиков

1.1. Баннеры сделанные для системы AdRiver
Разрешается размещать FullScreen HTML5 баннеры, сделанные по техническим требования системы AdRiver на коде AjaxJS. Технические требования можно взять на сайте AdRiver для формата FullScreen

1.2. Баннеры сделанные для системы Holder
Все подгружаемые элементы, должны быть высланы вместе с баннером (index.html), а их пути в HTML должны быть прописаны относительно.
Общий вес всех элементов баннера не должен превышать 600 Кб.
После того, как вы убедитесь что общий вес всех компонентов баннера не превышает 600 Кб, их нужно запаковать в ZIP-архив в одной корневой папке, без подкаталогов. Архивировать нужно только файлы, а не папку в которой они находятся. Разрешенные форматы файлов - jpg, png, gif, html, css, js, json.
- Cтруктура HTML должна быть внутри одного элемента с id.
- HTML должен быть полностью готовым и рабочим, в т.ч. включать в себя ссылку перехода с баннера на рекламируемый сайт. Она должна иметь такой вид
<a href='http://ссылка_перехода' onclick="return holderClick();" target="_blank">
Если кнопок перехода несколько, последующие необходимо делать таким
<a href='http://вторая ссылка_перехода' onclick="return holderClick('http://вторая ссылка перехода');" target="_blank">
- Все стили должны быть либо собраны в один inline, либо в один файл css. Если в стилях фигурируют конструкции URL (урл к картинке) - обязателен inline.
- Все скрипты должны быть либо собраны в один тег script, либо в один файл js. Если в скриптах фигурируют ссылки на внешние ресурсы - обязательно тег script, либо следует передавать url этих ресурсов в js из кода баннера параметрами.
- Если в процессе переопределяются стандартные события - перед этим они должны быть сохранены в tmp-переменные, и после окончания работы возвращены обратно.
- Стили должны определяться только относительно id начального родительского элемента, все id и css классы в коде баннеров должны содержать префикс h-banner_
- Скрипты должны работать относительно id начального родительского элемента.
- О размещении HTML5 баннера необходимо сообщить не позднее, чем за 5 рабочих дней до старта компании для согласования креатива. HTML5 креативы должны быть предоставлены для проверки и установки не позднее, чем за 3 рабочих дня до старта кампании.
В HTML необходимо указать такие параметры
<style>html, body {width: 100%; height: 100%; margin:0; padding:0;}</style>


2. Добавление в Holder. Инструкция для менеджеров

Перед добавлением баннера убедитесь что:
- общий вес компонентов баннера НЕ ЗААРХИВИРОВАННЫХ в ZIP-архив не превышает 600Кб
- файлы запакованы в ZIP архив без подпапок
- файлы запакованы именно в ZIP архив (не в RAR, не в 7z, не в какой либо другой)

1) В интерфейсе кампании кликните "добавить баннер".
2) Выберите "Формат баннера:" (размер).
3) В "Тип баннера:" должно быть установлено "добавить файл" (обычно выбрано по умолчанию).
4) С помощью кнопки "Выберите файл" (сразу под пунктами "Тип баннера" и "Файл") добавьте ZIP-файл.
5) Установите ссылку перехода в поле "Рекламируемый URL:".
6) Далее, по необходимости, выполните остальные настройки и сохраните баннер, сняв галочку "Добавить включенным" (сразу после приоритетов). После добавления баннера все его файлы из ZIP-архива распакуются в одну папку и index.html будет главным файлом, который запустится внутри iframe. Сохраните баннер.
7) Откройте баннер на редактирование. Из сгенерированного ajax-кода скопируйте адрес к загруженным компонентам, это будет ссылка типа:
//i.holder.com.ua/h/9/0/1238_0.html/
Скопируйте эту ссылку и подставьте в код ниже, в строку:
var fs_src_folder='//i.holder.com.ua/h/9/0/1238_0.html/';

Далее копируем весь скрипт который ниже с новой ссылкой, добавляем как AJAX код вместо текущего кода:

function init(){
var txt=document.createElement("a");
txt.id="iFrameFullScreen_text";
txt.style.position="fixed";
txt.style.bottom="20px";
txt.style.left="20px";
txt.style.color="#EEE";
txt.style.zIndex='65002';
txt.href = 'javascript:void(0);';
txt.onclick = function () {window.iFrameFullScreenClose(); return false;};
window.document.body.appendChild(txt);


window.timer = function(){
if(seconds>4 || seconds==0){ending='секунд'
}else{
if(seconds>1){ending='секунды'
}else{
ending='секунда'}
}//end if
if(seconds>0){
if(document.getElementById('iFrameFullScreen_text')){
document.getElementById('iFrameFullScreen_text').innerHTML = 'До повернення на сайт залишилось '+seconds+' '+ ending;
}
seconds--;
setTimeout(timer,1000);
}else{
window.iFrameFullScreenClose();
}//end if
}//end timer
//timer();


var fs_src_folder=' //i.holder.com.ua/h/9/0/1238_0.html/';
var seconds=15;
var fs=document.createElement("div");
fs.id="iFrameFullScreen";
fs.style.backgroundColor="#cdcdcd";
fs.style.position="fixed";
fs.style.top="0px";
fs.style.left="0";
fs.style.width="100%";
fs.style.height="100%";
fs.style.zIndex='65000';
window.document.body.appendChild(fs);
fs.innerHTML = '<iframe src="'+fs_src_folder+'index2.html?bn_url=' +bn_url + '" width="100%" height="100%" scrolling="no" frameborder="0" vspace="0" hspace="0" marginwidth="0" marginheight="0" onload="timer();"></iframe>';

var cls=document.createElement("a");
cls.id="iFrameFullScreen_close";
cls.style.position="fixed";
cls.style.top="40px";
cls.style.right="30px";
cls.style.width="41px";
cls.style.height="41px";
cls.style.zIndex='65001';
cls.href = 'javascript:void(0);';
cls.onclick = function () {window.iFrameFullScreenClose(); return false;};
window.document.body.appendChild(cls);
cls.innerHTML = '<img src="'+fs_src_folder+'close.png" />'


window.iFrameFullScreenClose = function(){
if(document.getElementById('iFrameFullScreen')){
var el = document.getElementById('iFrameFullScreen');
el.parentNode.removeChild(el);
}
if(document.getElementById('iFrameFullScreen_close')){
var el = document.getElementById('iFrameFullScreen_close');
el.parentNode.removeChild(el);
}
if(document.getElementById('iFrameFullScreen_text')){
var el = document.getElementById('iFrameFullScreen_text');
el.parentNode.removeChild(el);
}
}//end iFrameFullScreenClose

var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var event = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
// Listen to message from child window
event(messageEvent,function(e) {if (e.data == 'hideSG') window.iFrameFullScreenClose();},false);

} // end init
window.onload = init();

cкрыть ответ