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


Попередній перегляд

Повноекранний мобільний формат, що залучає користувача у взаємодію з банером. Користувачеві пропонують струснути смартфон для здійснення певної дії.

Підтримувані платформи

Desktop Tablet Phone
Windows Mac iOS Android iOS Android
ver. 8.0+ ver. 5+ ver. 8.0+ ver. 5+

Відомі обмеження

На мобільних пристроях із платформою iOS 12 і вище налаштування Рух і орієнтація може бути вимкнена за замовчуванням. У такому разі модуль shake запустить показ усіх панелей креативу автоматично з інтервалом 5 секунд.

Завантажити архів з прикладом:

Завантажити

Інструкція по роботі з архівом

  1. Розпакуйте архів з прикладом.
  2. Для перегляду креативу використовуйте сторінку  https://preview.admixer.net. Також можна скопіювати всі файли в папку index – banners – banner – body і відкрити файл index.html у середовищі перегляду на мобільному пристрої через localhost (наприклад, браузер Chrome з режимом емулятора мобільного пристрою). У цьому випадку потрібне попереднє встановлення та налаштування веб-сервера (наприклад,  IIS для Windows, Apache для Mac OS).
  3. Додатково можете перевірити прев’ю креатива попередньо скопіювавши на нього посилання і переглянувши з мобільного девайсу.

  4. Відкрийте текстовим редактором файл body.html і відредагуйте частину коду, яка знаходиться всередині тегів <body> </body>.
  1. Відредагуйте JS код.
  2. Збережіть і заархівуйте всі використовувані матеріали в ZIP форматі (архів має створюватися з файлів, а не з папки, в якій ці файли знаходяться).

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

Основна панель

Стандартні розміри, WxH, 100%x100%

Відео

  • Розмір контейнера для відеоплеєра може бути заданий будь-який у межах розгорнутої панелі
  • Тип файлів: .mp4
  • Макс. тривалість: 30 сек

Вага креативу

  • до 300 Kb без відео
  • до 2 Mb з відео

Вимоги до файлів

ZIP архів

.zip архів із необхідними матеріалами. Рекомендуємо використовувати архів із прикладом.

HTML файл

HTML-Файл повинен містити шляхи до завантажуваних матеріалів (JS-файлів, зображень). Рекомендована назва  HTML-файла — body.html.

Підключення та використання  API

globalHTML5Api підключається автоматично, викликається за допомогою методу:

Показати код globalHTML5Api
globalHTML5Api.on('load', function(){
  /*
    YOUR CODE IS HERE
  */
});

Усі використовувані об'єкти та методи globalHTML5Api поміщаються всередину викликаної функції.  Модулі , що підключаються, передаються як параметри функції. Цей формат може використовувати модуль PlayerShake.

Спрощений приклад використання globalHTML5Api для формата Shake:

Показати приклад коду globalHTML5Api
globalHTML5Api.on('load', function(Shake){
	globalHTML5Api.init({
		'resize' : [
			{
				'name': 'state-1',
				'fixed' : {
						'vertical':'center',
						'horizontal':'center'
					},
				'width': '100%',
				'height': '100%'
			}
		]
	});
})

Параметри globalHTML5Api.init

Ключ Властивості Тип Опис
resize Array Масив об'єктів
name (required) String Ім'я об'єкта. Кожен об'єкт являє собою окреме положення контейнера (resizeState).
fixed Об'єкт із властивостями. Описує положення контейнера щодо вікна браузера
vertical (required) top, bottom Положення контейнера по вертикалі
horizontal (required) center Положення контейнера по горизонталі
width (required) String|Number Значення ширини контейнера з банером
height (required) String|Number Значення висоти контейнера з банером

Приклад використання модуля Shake:

Показати приклад коду
var container = $('container');
    Shake.subscribe(function(){
		container.style.backgroundColor = "rgb(" + rnd(0,255) + "," + rnd(0,255) + "," + rnd(0,255) + ")";
	})

*У прикладі вище функція зворотного виклику змінює колір банера за подією shake.

Параметри Shake

Метод Аргументи Опис
subscribe Function Метод відповідає за відстеження події Shake і запуск функції по здійсненню події, тобто після того як користувач потряс пристрій.

Методи globalHTML5Api

Метод Аргументи Тип Опис
click(URL) Виклик клік-переходу на цільову сторінку. Посилання переходу може бути передано безпосередньо в коді креативу. Також посилання переходу може бути задано з шаблону заливки креативу в інтерфейсі користувача. Посилання, задане в коді, має більший пріоритет, ніж посилання, задане через шаблон, що може призвести до конфлікту. Тому для передачі посилання обов'язково використовувати тільки один із доступних способів.
URL (optional) String Посилання переходу
src(URL) Метод повертає абсолютний шлях до файлу
URL (optional) String Відносний шлях до файлу
globalHTML5Api.on(‘event’, callback);) Виклик функції за подією
event String Подія ‘positionChange()’
callback(positionData) Function callback-функція

Відео

Якщо креатив містить відео, скористайтеся інструкцією Додавання відео в HTML5 банер.

Зображення

Підтримувані типи файлів: .jpg, .png, .gif, .svg.

Облік подій

  • View/ Перегляд
  • Confirmed view/Підтверджений перегляд
  • Click/Клік
З питань технічних вимог до банерів, будь ласка, звертайтеся до менеджера підтримки вашого акаунта.
Оновлено 08 квітня, 2024