Узкий баннер над шапкой отображается на всех страницах сайта и помогает привлечь дополнительное внимание к акциям, распродажам и другой важной информации.
Примеры баннеров над шапкой сайта
Как добавить баннер над шапкой
- Перейдите в раздел Баннеры и нажмите кнопку Добавить.
- В поле Страница выберите Все страницы.
- Настройте содержание баннера и нажмите Сохранить.
Особенности некоторых настроек
- Изображение — картинка для фона, размещается по центру баннера, на узких экранах обрезается.
- Текст — текст на баннере, поддерживает HTML и CSS.
- Высота — высота баннера: 30, 40 или 50 пикселей. На мобильной версии высота автоматически увеличивается, если текст на баннере не помещается в одну строку.
- Отображать баннер на версии сайта — показывать баннер только на десктопной версии, только на мобильной или везде. Используйте эту настройку, чтобы создать два разных баннера под каждую версию сайта.
- Отображать кнопку закрытия — если включено, посетитель сайта сможет скрыть баннер, после чего он больше не появится.
Баннер на мобильной версии
На мобильной версии баннер отображается под шапкой: он остается заметным, а шапка не смещается с привычного для пользователя места на экране. Это важно для комфортного пользования сайтом.
Проектируя баннер, позаботьтесь о том, чтобы он был понятным и читабельным на мобильной версии. Рекомендуем несколько вариантов решения этой задачи.
- Задайте контент баннера текстом. На мобильной версии текст не обрежется, а перенесется на новую строку. При этом баннер может растягиваться по высоте.
- Спроектируйте макет так, чтобы важный контент умещался в ширину экрана смартфона. Изображение обрежется по бокам, но контент останется читабельным.
- Создайте отдельный баннер для мобильной версии. В настройках этого баннера укажите, чтобы он отображался только на мобильной версии, а оригинальный баннер — только на десктопе (настройка Отображать баннер на версии сайта).
Порядок отображения баннеров
Над шапкой может отображаться только один баннер — тот, у которого самый высокий порядок отображения в разделе Баннеры в админке.
На первом месте по порядку отображения стоит Тестовый баннер, поэтому именно его увидят все посетители сайта
Но если у первого по приоритету баннера включена кнопка закрытия, тогда после скрытия этого баннера посетитель сайта увидит следующий (после перезагрузки страницы или перехода на другую страницу).