Все коллекции
Страницы сайта
Баннеры
Баннер на главной странице сайта
Баннер на главной странице сайта

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

Обновлено больше недели назад

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

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

Для размещения баннера на главной странице необходимо:

  1. Определить какие баннеры, вы хотите выводить на главной странице.

  2. Если необходимо, сделать запрос в поддержку на создание новых линий или изменение существующих.

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

  4. Загрузить изображения, настроить и активировать баннеры в админке.

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

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

Пример баннерных линий на главной странице

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

Пример отображения баннеров в шаблоне Shaniya из галереи дизайнов:

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

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

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

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

Другие комбинации баннеров вы можете увидеть в нашей галерее дизайнов.

Запрос для подключения или изменения баннерных линий

Для подключения новых баннерных линий, или изменения вида баннеров в существующих линиях, обратитесь в отдел поддержки.

Пример запроса

Прошу вас подключить такие баннеры для главной страницы:

  • Первая линия баннеров — wideblock, размер L, отступы S, скругления: нет

  • Вторая линия баннеров — block, размер L, отступы M, скругления: S

  • Третья линия баннеров — 2x, размер M, отступы S, скругления: L

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


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

Для корректного отображения баннеров изображения должны соответствовать следующим требованиям:

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

  • Изображение должно быть в формате jpeg или png.

  • Если вы выбрали баннер cover, то стоит оставлять отступ от левого и правого края 500px, а важную информацию размещать по центру.

  • Если вы выбираете настройки с отступами, при подготовке изображения необходимо предусмотреть, что 10-15 пикселей от края будут перекрыты отступом.

  • Изображения должны быть высокого качества.


Настройка и включение баннеров на сайте

После того как нужные баннерные линии созданы загрузите изображения в админ панель и включите баннеры:

  1. Перейдите в раздел Баннеры и нажмите кнопку Добавить.

  2. В поле Страница выберите Главная.

  3. В поле Расположение выберите нужную баннерную линию.

  4. Убедитесь что в поле Шаблон выбран тип Картинка.

  5. Загрузите файл с баннером в поле Изображение, установите ссылку и дополнительные настройки при необходимости.

  6. Отметьте чекбокс Включить и нажмите Сохранить.

Ссылки

В поле Ссылка можно задать адрес для перехода по клику на баннер: страницу сайта либо же ссылку на сторонний ресурс. Для настройки ссылки выберите:

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

  • Своя ссылка — в таком случае вы можете указать во второй части поля ссылку на произвольную страницу (как на сайте, так и в других источниках).

Если по клику на баннер покупатель должен попадать на страницу конкретного товара на сайте либо на страницу с результатами фильтрации, необходимо выбрать Своя ссылка и вписать во вторую часть поля относительную ссылку (без домена).

Если по клику на баннер покупатель должен попадать на страницу другого сайта, ссылка должна быть абсолютной (например, https://horoshop.ua/functions/)

Баннеры для разных языковых версий сайта

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

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

Обратите внимание:

  • Если для дополнительной языковой версии не загружен баннер, будет отображаться баннер установленный для основного языка сайта.

  • Если для основного языка сайта баннер не выбран, баннеры из других языковых версий отображаться не будут. При выборе Включен на сайт будет выводиться пустое место.

Создание Слайдера (сменяющиеся изображения)

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

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

Для настройки слайдера необходимо создать несколько баннеров для одной баннерной линии.

Порядок отображения баннеров в линии

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

Менять последовательность отображения можно перетаскивая баннеры за стрелки в левой колонке.

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

Нашли ответ на свой вопрос?