Плагин «Меню»
Плагин «Меню» редактора макета позволяет разместить меню, которое может содержать как основные, так и выбранные страницы сайта интернет-магазина. Этот плагин позволяет улучшить пользовательский опыт клиента интернет-магазина предлагая ему блок меню с релевантными страницами.
Чтобы начать работу с плагином «Меню» перейдите в редактор макета и нажмите на кнопку «ДОБАВИТЬ БЛОК».
После этого появится боковая панель, в которой нужно нажать на плагин «Меню» и перенести его в определенное место на странице сайта интернет-магазина.
После этого появится боковая панель настроек плагина «Меню». Рассмотрим детальнее каждую вкладку боковой панели настроек плагина «Меню».
Вкладка «Страницы» позволяет выбрать какие страницы будут отображаться в плагине «Меню». Можно выбрать отображение лишь основных страниц сайта интернет-магазина 1 или отображать выбранные страницы сайта интернет-магазина 2. При необходимости можно отображать главную страницу в плагине «Меню» при помощи соответствующего переключателя 3. Если удалить определенную страницу при помощи кнопки «Удалить» 4 будет выбран режим отображения выбранных страниц сайта интернет-магазина.
Также удалив определенную страницу при отображении лишь выбранных страниц в плагине «Меню» появится кнопка «Изменить». Если нажать на эту кнопку, появится всплывающее окно, в котором можно выбрать какие именно страницы должны отображаться в плагине «Меню».
Вкладка «Вид» позволяет выбрать один из дизайнов отображения меню 1, если выбрано дизайны отображения меню «Плитки» или «Слайдер» можно выбрать один из готовых дизайнов превью меню 2. Для каждого дизайна отображения меню можно изменить настройки элементов превью меню 3, в случае выбранного дизайна отображения меню «Слайдер» можно изменить настройки элементов управления слайдером превью меню 4.
Рассмотрим детальнее настройки элементов блока меню в случае выбранного дизайна отображения меню «Горизонтальное меню» и «Вертикальное меню».
Элемент превью меню «НАЗВАНИЕ» имеет следующие настройки.
- «Цвет текста» 1 – эти настройки позволяют установить цвет текста и цвет текста при наведении на пункт меню;
- «Размер текста» 2 – эта настройка позволяет установить размер в пикселях текста пункта меню;
- «Межстрочный интервал(%)» 3 – эта настройка позволяет установить межстрочный интервал для пунктов меню;
- «Стиль текста» 4 – эти настройки позволяют установить стиль пункта меню, а именно: жирный, курсивный, подчеркнутый, БОЛЬШИМИ БУКВАМИ;
- «Отступы сверху/снизу» 5 – эта настройка позволяет установить отступ в пикселях сверху и снизу от пункта меню;
- «Отступы справа/слева» 6 – эта настройка позволяет установить отступ в пикселях справа и слева от пункта меню.
Элемент превью меню «ДОПОЛНИТЕЛЬНО» имеет следующие настройки.
- «Выравнивание» 1 – эти настройки позволяют установить выравнивание блока меню по определенному критерию;
- «Количество отображаемых пунктов меню» 2 – эта настройка позволяет установить граничное значение отображаемых пунктов меню в блоке меню;
- «Сортировка» 3 – эта настройка позволяет сортировать пункты меню в блоке меню по определенному критерию;
- «Направление сортировки» 4 – эта настройка позволяет указать направление сортировки пунктов меню в блоке меню.
При необходимости можно отображать подстраницы при наведении на пункт меню. Для этого нужно включить переключатель «Отображать подменю».
Следует отметить, что этот переключатель появляется только при выбранном дизайне отображения меню «Горизонтальное меню».
Рассмотрим детальнее настройки элементов превью меню в случае выбранного дизайна отображения меню «Плитки», «Слайдер».
Элемент превью меню «ИЗОБРАЖЕНИЕ» позволяет выставить нужную пропорцию изображения пункта меню на превью по ширине:высоте.
Элемент превью меню «НАЗВАНИЕ» имеет следующие настройки.
- «Цвет текста» 1 – эти настройки позволяют изменить цвет текста и цвет текста при наведении на пункт меню в превью меню;
- «Размер текста» 2 – эта настройка позволяет установить размер текста в пикселях пункта меню в превью меню;
- «Межстрочный интервал(%)» 3 – эта настройка позволяет установить межстрочный интервал в процентах между пунктами меню и другими элементами превью меню;
- «Стиль текста» 4 – эти настройки позволяют установить стиль названия пункта меню, а именно: жирный, курсивный, подчеркнутый, БОЛЬШИМИ БУКВАМИ;
- «Отступы сверху/снизу» 5 – эта настройка позволяет установить отступ в пикселях сверху и снизу от пункта меню;
- «Отступы справа/слева» 6 – эта настройка позволяет установить отступ в пикселях справа и слева от пункта меню;
- «Выравнивание» 7 – эта настройка позволяет установить выравнивание пункта меню относительно превью меню, появляется опционально, в зависимости от выбранного дизайна превью меню;
- «Ограничить длину названия» 8 – этот чекбокс позволяет ограничивать длину пункта меню.
Элемент превью меню «КНОПКА» появляется лишь при выборе соответствующего дизайна превью меню и имеет следующие настройки.
- «Вид кнопки» 1 – эти настройки позволяют выбрать один из имеющихся видов кнопки «Подробнее»;
- «Цвет кнопки» 2 – эти настройки позволяют выбрать цвет текста и при наличии цвет фона кнопки «Подробнее»;
- «Цвет при наведении» 3 – эти настройки позволяют выбрать цвет текста и при наличии цвет фона при наведении на кнопку «Подробнее»;
- «Размер текста (рх)» 4 – эта настройка позволяет выбрать размер текста в пикселях кнопки «Подробнее»;
- «Закругление краев» 5 – эти настройки позволяют выбрать вид краев кнопки «Подробнее»;
- «Стиль текста» 6 – эти настройки позволяют установить стиль текста кнопки «Подробнее», а именно: жирный, курсивный, подчеркнутый, БОЛЬШИМИ БУКВАМИ;
- «Высота кнопки (рх)» 7 – эта настройка позволяет установить в пикселях высоту кнопки «Подробнее»;
- «Ширина кнопки (рх)» 8 – эта настройка позволяет установить в пикселях ширину кнопки «Подробнее»;
- «Отступ сверху» 9 – эта настройка позволяет установить отступ сверху в пикселях от кнопки «Подробнее» к другим элементам превью меню;
- «Отступ снизу» 10 – эта настройка позволяет установить отступ снизу в пикселях от кнопки «Подробнее» к другим элементам превью меню;
- «Скрывать на мобильных устройствах» 11 – этот переключатель позволяет скрыть отображение кнопки «Подробнее» в случае мобильных версий сайта интернет-магазина (экраны, которые меньше чем 740 пикселей).
Элемент превью меню «ДОПОЛНИТЕЛЬНО» имеет следующие настройки в случае выбранного дизайна отображения меню «Плитки».
- «ЦВЕТ ФИЛЬТРА ДЛЯ ИЗОБРАЖЕНИЯ» 1 – эти настройки позволяют установить цвет превью и цвет превью меню при наведении. В зависимости от выбранного дизайна превью меню эти настройки могут иметь название «ФОН ПРЕВЬЮ МЕНЮ» или «ЦВЕТ АКЦЕНТНЫХ ЭЛЕМЕНТОВ» с аналогичными настройками либо эта настройка может отсутствовать;
- «Закругление краев (рх)» 2 – эта настройка позволяет округлить в пикселях край изображения превью меню;
- «Количество отображаемых пунктов меню» 3 – эта настройка позволяет установить граничное значение отображаемых пунктов меню;
- «Расстояние между элементами (рх)» 4 – эта настройка позволяет установить боковое расстояние в пикселях между превью меню;
- «КОЛИЧЕСТВО ПУБЛИКАЦИЙ В РЯД» 5 – эта настройка позволяет установить граничное значение отображаемых превью меню для настольной, ноутбучной, планшетной, мобильных (вертикальной и горизонтальной, экраны, которые меньше чем 740 пикселей) версий сайта интернет-магазина;
- «Сортировка» 6 – эта настройка позволяет установить сортировку превью меню по определенным критериям;
- «Направление сортировки» 7 – эта настройка позволяет выбрать направление сортировки превью меню.
Элемент превью меню «ДОПОЛНИТЕЛЬНО» имеет следующие настройки в случае выбранного дизайна отображения меню «Слайдер».
- «ЦВЕТ ФИЛЬТРА ДЛЯ ИЗОБРАЖЕНИЯ» 1 – эти настройки позволяют установить цвет превью и цвет превью меню при наведении. В зависимости от выбранного дизайна превью меню эти настройки могут иметь название «ФОН ПРЕВЬЮ МЕНЮ» или «ЦВЕТ АКЦЕНТНЫХ ЭЛЕМЕНТОВ» с аналогичными настройками либо эта настройка может отсутствовать;
- «Закругление краев (рх)» 2 – эта настройка позволяет округлить в пикселях край изображения превью меню;
- «Количество отображаемых пунктов меню» 3 – эта настройка позволяет установить граничное значение отображаемых пунктов меню;
- «Расстояние между элементами (рх)» 4 – эта настройка позволяет установить боковое расстояние в пикселях между превью меню;
- «Бесконечная прокрутка» 5 – этот переключатель позволяет установить бесконечную прокрутку превью меню, то есть последнее превью меню слайда можно прокрутить вправо и после этого будет отображаться первое превью меню слайда. В случае выключенного переключателя «Бесконечная прокрутка» прокрутить последнее превью меню слайдера будет невозможным, необходимо будет повернуться влево к первому превью меню;
- «Скорость прокручивания слайдера (сек)» 6 – эта настройка позволяет установить скорость прокручивания слайдера превью меню в миллисекундах;
- «КОЛИЧЕСТВО ПУБЛИКАЦИЙ В РЯД» 7 – эта настройка позволяет установить граничное значение отображаемых превью меню для настольной, ноутбучной, планшетной, мобильных (вертикальной и горизонтальной, экраны, которые меньше чем 740 пикселей) версий сайта интернет-магазина;
- «Сортировка» 8 – эта настройка позволяет установить сортировку превью меню по определенному критерию;
- «Направление сортировки» 9 – эта настройка позволяет выбрать направление сортировки превью меню.
Элемент превью публикации «ТОЧКИ» появляется лишь в случае выбранного дизайна отображения превью меню «Слайдер» и имеет следующие настройки.
- «Отображать точки» 1 – этот переключатель позволяет отображать элемент управления слайдером превью меню «Точки»;
- «Цвет» 2 – эта настройка позволяет выбрать цвет элемента управления слайдером превью меню «Точки»;
- «Форма» 3 – эти настройки позволяют выбрать форму элемента управления слайдером превью меню «Точки»;
- «Выравнивание» 4 – эти настройки позволяют выбрать выравнивание элемента управления слайдером превью меню «Точки»;
- «Скрывать на мобильных устройствах» 5 – этот переключатель позволяет скрыть отображение элемента управления слайдером превью меню «Точки» в случае мобильных версий (экраны, которые меньше чем 740 пикселей) сайта интернет-магазина.
Элемент превью публикации «СТРЕЛКИ» появляется лишь в случае выбранного дизайна отображения превью меню «Слайдер» и имеет следующие настройки.
- «Отображать стрелки» 1 – этот переключатель позволяет отображать элемент управления слайдером превью меню «Стрелки»;
- «Иконка» 2 – эти настройки позволяют выбрать вид элемента управления слайдером превью меню «Стрелки»;
- «Стиль» 3 – эти настройки позволяют выбрать стиль элемента управления слайдером превью меню «Стрелки»;
- «Форма» 4 – эти настройки позволяют выбрать форму элемента управления слайдером превью меню «Стрелки»;
- «Размер стрелок» 5 – эта настройка позволяет выбрать размер в пикселях элемента управления слайдером превью меню «Стрелки»;
- «Цвет кнопки» 6 – эта настройка позволяет выбрать цвет элемента управления слайдером превью меню «Стрелки»;
- «Цвет при наведении» 7 – эта настройка позволяет выбрать цвет элемента управления слайдером превью меню «Стрелки» при наведении на него;
- «Положение» 8 – эти настройки позволяют выбрать положение элемента управления слайдером превью меню «Стрелки»;
- «Скрывать на мобильных устройствах» 9 – этот переключатель позволяет скрыть отображение элемента управления слайдером превью меню «Стрелки» в случае мобильных версий (экраны, которые меньше чем 740 пикселей) сайта интернет-магазина.
Вкладка «Заголовок» недоступна лишь в случае дизайна отображения меню «Горизонтальное меню». На этой вкладке можно настроить заголовок 1 и краткое описание 2 блока плагина «Меню».
Вкладка «Устройства» содержит настройки отображения плагина «Меню» в виде мобильного меню и недоступна лишь в случае дизайна отображения меню «Слайдер».
Рассмотрим детальнее настройки вкладки «Устройства».
- «Отображать в качестве мобильного меню» 1 – этот переключатель позволяет включить отображение плагина «Меню» в виде мобильного меню;
- «Название раздела в мобильном меню» 2 – эта настройка позволяет установить название блока плагина «Меню» в мобильном меню;
- «Отображать начиная с устройства» 3 – эта настройка позволяет добавить пункты меню к имеющемуся мобильному меню сайта интернет-магазина с определенного выбранного размера экрана если настройка «Отображать в качестве мобильного меню» выключена;
- «Отображение подкатегорий в мобильном меню» 4 – эта настройка позволяет выбрать вид отображения подкатегорий пункта меню в мобильном меню. Настройка не появляется в случае дизайна отображения меню «Плитки»;
- «Позиция в мобильном меню» 5 – эта настройка позволяет установить позицию блока меню плагина «Меню» в мобильном меню.
Закончив с настройками плагина «Меню» нажмите на кнопку «СОХРАНИТЬ», далее нажмите на кнопку «СОХРАНИТЬ» в редакторе макета, чтобы сохранить имеющиеся настройки.
Настроенный плагин «Меню» с дизайном отображения «Горизонтальное меню» с отображением подменю имеет следующий вид на сайте интернет-магазина.
Настроенный плагин «Меню» с дизайном отображения «Плитки» имеет следующий вид на сайте интернет-магазина.
Настроенный плагин «Меню» с дизайном отображения «Слайдер» имеет следующий вид на сайте интернет-магазина.
Настроенный плагин «Меню» с дизайном отображения «Вертикальное меню» имеет следующий вид на сайте интернет-магазина.
58 отзывов