Перейти до основного контенту
Усі колекціїСторінки сайтуБанери
Банер на головній сторінці сайту
Банер на головній сторінці сайту

Розміщення та налаштування банерів на головній сторінці сайту, зміна типу, розміщення та порядку відображення банерів.

Оновлено понад 4 міс. тому

Кожен банер займає на сторінці свій блок — банерну лінію. Для кожної банерної лінії необхідно визначити її розташування на сторінці та тип банера, який буде налаштовано для неї.

На Головній сторінці сайту немає обмежень щодо кількості банерних ліній та їх розташування, що дозволяє зробити головну сторінку сайту інформативною та привабливою для покупців. Врахуйте, що велика кількість банерів може призвести до сповільнення завантаження сторінки, тому ретельно обмірковуйте, які саме зображення потрібні.

Для розміщення банера на головній сторінці потрібно:

  1. Визначити, які банери ви хочете виводити на головній сторінці.

  2. Якщо необхідно, створити нові лінії або змінити ті, що вже існують.

  3. Підготувати зображення правильного розміру для кожного банера.

  4. Завантажити зображення, налаштувати та активувати банери в адмінці.

Підготовка банерних ліній для завантаження банерів

Необхідно визначити кількість банерів, які ви хочете розмістити на головній сторінці, та їх тип і розмір.

Приклад банерних ліній на головній сторінці

Приклад банерних ліній на головній сторінці — Хорошоп

Приклад відображення банерів у шаблоні Shaniya із галереї дизайнів:

  • Банерна лінія 1: wideblock, розмір L;

  • Банерна лінія 2: 3х, розмір M, відступи: S, заокруглення: S;

  • Банерна лінія 3: 2х, розмір: M, відступи: S, заокруглення: S;

  • Банерна лінія 4: block, розмір: L.

Інші комбінації банерів ви можете побачити у нашій галереї дизайнів.

Створення або зміна банерних ліній

Для створення нових банерних ліній, зміни параметрів банерів у лініях, що вже існують, або зміни їх розташування перейдіть в розділ адмін панелі Сайт Дизайн Редактор дизайну і розгорніть пункт Головна сторінка. Натисніть Додати банер або розгорніть існуючу банерну лінію та задайте необхідні параметри банера. Попередній перегляд в редакторі дизайну дозволяє відразу оцінити внесені зміни.

Важливо: перед зміною банерних ліній рекомендуємо зберегти зображення, які ви використовували раніше. Після застосування змін ваші попередні зображення можуть бути видалені.

Підготовка зображень для банерів

Для коректного відображення банерів зображення повинні відповідати таким вимогам:

  • Розмір зображення повинен повністю відповідати вибраному типу та розміру банера.

  • Зображення має бути у форматі jpeg або png.

  • Якщо ви вибрали банер cover, варто залишати відступ від лівого і правого краю 500px, а важливу інформацію розміщувати по центру.

  • Якщо ви вибираєте налаштування з відступами, під час підготовки зображення необхідно передбачити, що 10-15 пікселів від краю буде перекрито відступом.

  • Зображення мають бути високої якості.

Налаштування та увімкнення банерів на сайті

Після того, як потрібні банерні лінії створені, завантажте зображення в адмін панель і увімкніть банери:

  1. Перейдіть до розділу Сайт → Банери та натисніть Додати.

  2. У полі Сторінка виберіть Головна.

  3. У полі Розташування виберіть потрібну лінію.

  4. Переконайтеся, що в полі Шаблон вибрано тип Зображення.

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

  6. Позначте чекбокс Увімкнути та натисніть Зберегти.

Посилання

У полі Посилання можна задати адресу для переходу по кліку на банер: сторінку сайту або посилання на сторонній ресурс. Для налаштування посилання виберіть:

  • Назва сторінки сайту — у цьому випадку, у другій частині поля буде відображено відносне посилання на цю сторінку, своє для кожної мовної версії сайту.

  • Своє посилання — у такому разі ви можете вказати у другій частині поля посилання на будь-яку сторінку (як на сайті, так і в інших джерелах).

Якщо по кліку на банер покупець повинен потрапляти на сторінку конкретного товару на сайті або на сторінку з результатами фільтрації, необхідно вибрати своє посилання і вписати в другу частину поля відносне посилання (без домену).

Якщо по кліку на банер покупець повинен потрапляти на сторінку іншого сайту, посилання має бути абсолютним (наприклад, https://horoshop.ua/functions/)

Банери для різних мовних версій сайту

Для кожної мовної версії сайту можна завантажувати різні зображення, задати різні посилання та прописати відповідні метатеги alt та title.

Банери для різних мовних версій сайту — Хорошоп

Зверніть увагу:

  • Якщо для додаткової мовної версії не завантажено банер, буде відображатися банер, встановлений для основної мови сайту.

  • Якщо банер не вибрано для основної мови сайту, банери з інших мовних версій не відображатимуться. Якщо такий банер буде увімкнено, на сайт буде виводитися порожнє місце.

Створення Слайдера (зображення, що змінюються)

Для банерів типу block, wideblock, cover, blockplus (тільки великий банер) можна налаштувати слайдер — зображення, що автоматично змінюються з певною періодичністю.

Слайдер (зображення, що змінюються) — Хорошоп

Для налаштування слайдеру необхідно створити кілька банерів в одній банерній лінії.

Порядок відображення банерів у лінії

Порядок виведення банерів у слайдері та лінії з декількома банерами визначаться їх послідовністю у списку в розділі Банери.

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

Порядок відображення банерів у лінії — Хорошоп

Читайте також

Ви отримали відповідь на своє запитання?