Admixer HelpCenter

Ukrainian

English

Russian

Назад до Огляду платформи

Глосарій

Креативи

Робота з креативами

Вартість креативів

Тех. вимоги до креативів

Додаткові налаштування

Viber Format Creatives specs

Шаблон в інтерфейсі: HTML5 Banner

Preview

Формат реклами з двома панелями - початковою та розгорнутою. Початкова панель складається з дев'яти 3D-елементів у формі куба. Клік на один з цих елементів відкриває відповідну розширену панель. При натисканні на центральний елемент (№4) відкривається розширена панель з відео. Анімація головної панелі може охоплювати частину контенту сайту. Повинна містити кнопку "X Закрити/Згорнути" у верхньому правому кутку розгорнутої панелі.

На цей формат реклами можуть накладатися обмеження, встановлені Google спільно з Coalition for Better Ads на показ реклами в браузері Chrome. Перелік рекламних елементів, яких слід уникати в цьому форматі відповідно до стандартів Initial Better Ads Standards:
- автоматичне відтворення відеореклами зі звуком.

Загальні вимоги до формату

Головна панель

Стандартні розміри, WxH, px: 300×600
Тип файлів: .png, .jpg

Розгорнута панель

Стандартні розміри, WxH, px: 900×600
Тип файлів: .png, .jpg

Розміри зображень банера, WxH, px.

200×200 – 4 файли для граней "куба"
300×150 – 2 файли для верхньої та нижньої панелей
900×600 – 4 файли для розгорнутих панелей, один з яких використовується як фон відеоплеєра (900×600-vid у шаблоні)

Відео

Контейнер відеоплеєра може мати будь-який розмір у межах розгорнутої панелі (у прикладі розмір контейнера відео 600×337; цей розмір можна змінити)
Тип файлів: .mp4
Максимальна тривалість: 30 sec

Аудіо

За ініціативою користувача (за замовчуванням вимкнено)

Кнопки

Кнопка "X Закрити" у верхньому правому куті розгорнутої панелі (дозволяє користувачеві закрити розгорнуту сцену)

Розмір

до 3 Mb

Завантажте архів з шаблоном:

3d-expand_v4.zip

Інструкція по роботі з .zip архівом (шаблон)

Розпакуйте архів з шаблоном креативу. Відкрийте папку images і замініть зображення на свої. Ім'я файлу краще залишити без змін.
У разі зміни імені та/або розширення файлу, відкрийте файл body.html за допомогою текстового редактора та відредагуйте наведені нижче фрагменти коду:

Файли для початкової панелі

#p1{top:0px;left:0px;background:url('images/1.jpg');}
#p2{top:0px;left:100px;background:url('images/2.jpg');}
#p3{top:0px;left:200px;background:url('images/3.jpg');}
#p4{top:100px;left:0px;background:url('images/2.jpg');}
#p5{top:100px;left:100px;background:url('images/4.jpg');}
#p6{top:100px;left:200px;background:url('images/2.jpg');}
#p7{top:200px;left:0px;background:url('images/3.jpg');}
#p8{top:200px;left:100px;background:url('images/2.jpg');}
#p9{top:200px;left:200px;background:url('images/1.jpg');}

Де images - ім'я папки, 1.jpg - ім'я файлу. Ці файли слугують гранями "куба".

HTML код

<div id="top"><img src="images/top.jpg"></div>
<div id="bottom"><img src="images/bottom.jpg"></div>

Де top.jpg - ім'я файлу верхньої панелі.
bottom.jpg - ім'я файлу нижньої панелі.

Файли для розгорнутої панелі

   <div id="size_2"
         style="position: absolute;width: 900px; height: 600px;transform-origin: 0 0;opacity: 0; right: 0;">
        <img src="images/900x600-2.jpg">
    </div>
    <div id="size_3"
         style="position: absolute;width: 900px; height: 600px;transform-origin: 0 0;opacity: 0; right: 0;">
        <img src="images/900x600-1.jpg">
    </div>
    <div id="size_4"
         style="position: absolute;width: 900px; height: 600px;transform-origin: 0 0;opacity: 0; right: 0;">
        <img src="images/900x600-3.jpg">
    </div>
    <div id="size_vid"
         style="position: absolute;width: 900px; height: 600px;transform-origin: 0 0; background-image:url(images/900x600-vid.jpg);opacity: 0; right: 0;">
        <div id="player_container" style="position : absolute; width: 600px; height: 337px; top:131.5px; z-index: 1;">
        </div>
    </div>

Кількість початкових панелей збігається з кількістю відповідних розгорнутих панелей. Наприклад, при натисканні на елемент 200×200 #1 (файл 1.jpg) розгортається панель 900×600 #1 (файл 900×600-1.jpg).

Файли з однаковими іменами використовують як джерело одне й те саме зображення, тому вони є рівноправними.

Якщо посилання на цільову сторінку для верхньої, нижньої, розгорнутої панелей має відрізнятися, відкрийте файл body.js за допомогою текстового редактора і вкажіть цільове посилання URL (globalHTML5Api.click(‘https://yourdomain.com’)) для відповідної панелі - верхньої (“Link – Top”), нижньої (“Link – Bottom”) і розгорнутої (Link – 1, 2, 3):

Код файлу body.js

s_2.onclick = function(_event) {
  prevent(_event);
  globalHTML5Api.click(‘’);
  //alert(“Link – 2”);
};
s_3.onclick = function(_event) {
  prevent(_event);
  globalHTML5Api.click(‘’);
  //alert(“Link – 1”);
};
s_4.onclick = function(_event) {
  prevent(_event);
  globalHTML5Api.click(‘’);
  //alert(“Link – 3”);
};
s_v.onclick = function(_event) {
  prevent(_event);
  globalHTML5Api.click(‘’);
  //alert(“Link – Video”);
};
topLink.onclick = function(_event) {
  prevent(_event);
  globalHTML5Api.click(‘’);
  //alert(“Link – Top”);
};
bottomLink.onclick = function(_event) {
  prevent(_event);
  globalHTML5Api.click(‘’);
  //alert(“Link – Bottom”);
};

Відеофайл повинен мати назву video.mp4 і бути розміщений у кореневій директорії .zip-файлу.
Збережіть та заархівуйте всі матеріали банера у форматі .zip (ви повинні заархівувати файли, а не папку, в якій вони містяться).

Файл body.html повинен знаходитися в кореневій директорії .zip-файлу.

Цей шаблон посилається на попередньо визначений досвід роботи з банером. Розміри панелей, параметри банера можуть бути змінені відповідно до інструкцій: Video player module and Expandable.

Відстеження подій

View/Перегляд
Confirmed view/Підтверджений перегляд
Click/Клік
Expand by user/Розхлоп банера користувачем
Collapse by user/Згортання банера користувачем
Play/Запуск відеоролика
Pause/Пауза
Resume/Повторний запуск відеоролика
Sound on/Увімкнення звуку
Sound off/Вимкнення звуку
Progress (firstQuartile, midpoint, thirdQuartile, complete)/Перегляд відеоролика (перша чверть, середина, третя чверть, закінчення)

Chrome може обмежувати використання ресурсів рекламою (до взаємодії користувача з нею) шляхом видалення важкого креативу зі сторінки. Реклама вважається важкою, якщо користувач не взаємодіяв з нею (наприклад, не клікнув) і якщо вона відповідає будь-якому з таких критеріїв:
— Використовує основний потік загалом понад 60 секунд
— Використовує основний потік понад 15 секунд у будь-якому 30-секундному вікні
— Використовує більше 4 мегабайт пропускної здатності мережі

З питань технічних вимог до банерів, будь ласка, звертайтеся до менеджера підтримки вашого акаунта.

Оновлено 15 січня, 2024