Как вам помочь ?

Шапки, меню

Актуально для версии магазина: 6.5

В данной статье мы рассмотрим настройку блоков типа "Шапка" в воронках.

 

 

Назначение и типы шапок в воронках

Элементы вида "шапка" предназначены для создания верхних частей страниц в воронках. В них можно размещать логотип, меню, контактные данные, ссылки на социальные сети, а также настраиваемую кнопку (в случае необходимости).

В режиме редактирования страницы воронки нажмите кнопку "Добавить".

Выберите категорию "Шапки".

Для выбора доступно несколько вариантов шапок:

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

 

Настройки шапки

Рассмотрим настройки шапки. Наведите курсор мыши на добавленную шапку и нажмите кнопку "Настройки".

Шапка имеет следующие вкладки с настройками:

 

 

Внешний вид

Цветовая схема - выбор цветовой гаммы и фона шапки. Можно выбрать одну из стандартных цветовых схем (Светлая, Умеренная или Тёмная) или создать свою (Пользовательскую). Для создания своей цветовой схемы выберите в выпадающем списке "Пользовательская" и нажмите "Редактировать цветовую схему". Укажите нужный цвет фона, текста и кнопок, после чего сохраните настройки.

Изображение - задаёт фоновое изображение шапки. При нажатии на кнопку "Обновить изображение" откроется меню управления изображением, через которое можно:

  • загрузить изображение с компьютера
  • загрузить по ссылке
  • загрузить изображение из галереи
  • удалить изображение

 

Отдельно отметим загрузку изображения из галереи: данная функция позволяет загружать изображения с ресурса www.pexels.com. Все изображения из данного источника являются полностью бесплатными для коммерческого использования.

Отступ сверху - задаёт величину пустого отступа в шапке сверху.

Отступ снизу - задаёт величину пустого отступа в шапке снизу.

Скрывать блок в мобильной версии - если данная галочка установлена, шапка не будет отображаться при открытии страницы воронки с мобильного устройства.

Показывать на всех страницах - если данная галочка установлена, настраиваемая шапка будет отображаться на всех страницах воронки.

Фиксировать при прокрутке - если данная галочка установлена, шапка будет зафиксирована в верхней части страницы при прокрутке страницы вниз.

Наезжать на соседний блок - если данная галочка установлена, шапка будет прозрачной и будет располагаться поверх следующего блока. Сравните:

Без галочки:

С галочкой:

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

Внимание!

В режиме редактирования блок меню не будет наезжать на нижний блок для упрощения процесса редактирования. Чтобы посмотреть результат, используйте функцию предпросмотра страницы.

 

Пункты меню

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

Размер шрифта - задаёт размер шрифта пунктов меню.

Расстояние между пунктами - задаёт расстояние между пунктами меню.

"Добавить новый элемент" - добавление нового элемента меню.

Каждый элемент меню имеет поля "Название" и "Ссылка". Ссылка для пункта меню в шапке может быть двух видов - URL-адрес (к примеру, URL-адрес другой страницы воронки или URL-адрес страницы другого сайта) и ссылка на блок.

Для добавления пункта меню второго уровня (вложенного пункта меню) нажмите на значок "+" рядом с нужным пунктом меню.

Настройки пункта меню второго уровня идентичны настройке пункта меню первого уровня. В клиентской части это выглядит следующим образом:

 

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

  • Прописать в поле "Ссылка" идентификатор блока (идентификатор блока - это его id; узнать его можно согласно инструкции https://www.advantshop.net/help/pages/work-with-css)
  • Выбрать блок вручную. Нажмите кнопку "Выбрать блок". Вы переключитесь на страницу воронки, где вам нужно будет просто кликнуть курсором мыши на нужный блок. После этого идентификатор блока автоматически пропишется в поле "Ссылка".

 

Открывать в новом окне - если данная галочка установлена, целевая ссылка пункта меню будет открываться в новом окне браузера.

 

Контакты

Телефон - поле для отображения телефона в шапке. Галочка включает/отключает показ этого элемента в шапке.

Email - поле для отображения e-mail в шапке. Галочка включает/отключает показ этого элемента в шапке.

Кнопки социальных сетей - отображение кнопок социальных сетей. Галочка включает/отключает показ этих элемента в шапке. В полях для кнопок социальных сетей необходимо указывать ссылки на ваши страницы в социальных сетях. Доступны такие социальные сети, как Вконтакте, Facebook, Youtube, Twitter, Instagram, Одноклассники.

Пример отображения контактов в шапке:

 

Логотип

Показывать логотип - данная галочка включает/отключает показ логотипа в шапке.

Загрузить логотип - возможность загрузки готового логотипа. Доступные варианты загрузки:

  • загрузить изображение с компьютера
  • загрузить по ссылке
  • загрузить изображение из галереи
  • загрузить иконку из галереи
  • удалить изображение

 

Отдельно отметим загрузку изображения из галереи: данная функция позволяет загружать изображения с ресурса www.pexels.com. Все изображения из данного источника являются полностью бесплатными для коммерческого использования.

Также отметим загрузку иконки из галереи: данная функция аналогична загрузке изображений из галереи, однако, в этом случае выбор производится не среди изображения, а среди иконок.

Создать логотип - возможность самостоятельно создать логотип, аналогично созданию логотипа для магазина.

Пример логотипа в шапке:

 

Кнопка 1

Настройки кнопок описаны в соответствующей статье.

Внимание!

Если кнопка активна в шапке, она будет отображаться вместо кнопок социальных сетей; кнопки социальных сетей не будут отображаться в шапке, если кнопка активна.

 

Другие статьи по теме

Открыть онлайн чат? Открыть
Статья оказалась полезной? Да Нет
Благодарим за отзыв.

Как мы можем улучшить статью?

Не нашли нужную статью? Предложить тему

Не нашли нужную статью?

Благодарим за отзыв.

Тэги: шапка, шапки, меню, воронка, воронки, шапка воронки, меню шапки