Возможности и особенности меню в BXReady: Интернет-магазин.

Технологии, которые мы использовали при создании BXReady: Интернет-магазин дают возможность расширения функционала нашего решения, в частности, меню, которое уже на сегодняшний день имеет массу преимуществ и особенностей. В этой статье и последующих, часто используется слово hover, которое будет означать всплывающее подменю.

1) Разные типы меню. Под типом меню мы понимаем не только месторасположение меню, но то из каких пунктов оно состоит:
  • Каталог товаров представлен как один из пунктов меню (1);
  • В меню располагаются только разделы каталога (2);
  • В меню, нет пункта связанного с каталогом товаров (3).
menu_1.jpg

2) Для вас доступен ряд настроек, которые могут дать вам сотни вариаций верхнего меню:
  • Не вошедшие в список разделы сворачиваются(1);
  • Включение/отключение кнопки поиска (и самой формы поиска) (2);
  • Выбор типа hover (3, 4), подробнее в пункте 4;
  • Меню преобразуется в мобильное на портативных устройствах;
  • Фиксация меню вверху экрана;
  • Расширение на весь экран.
menu_2.jpg


3) Не менее мощный набор настроек и у левого меню:
  • Выбор стилей;
  • Включение/выключение иконок;
  • Изменение внешнего вида и поведения (шаблоны "аккордеон" и "hover" );
  • Управление активными пунктами меню (показывает развёрнутыми все пункты меню или только активные) — возможно только для шаблона "аккордеон";
  • Выбор hover (пункт 4).
Пример левого меню с шаблоном "аккордеон":

menu_5.jpg

4) Любое меню, может подключать различные hover. Это очень интересный принцип сборки
На сегодняшний день hover меню имеет 2 шаблона (но у каждого десятки вариаций), но мы на этом не остановимся, и продолжим вас радовать, а пока подробнее про эти 2 шаблона:
Шаблон классического hover имеет следующие настройки:
  • Настройка цвета;
  • Включение/выключение иконок и использование иконок по умолчанию.
Пример того как может выглядеть ваше меню с классическим hover:

menu_6.jpg

На первом скриншоте мы видим следующие настройки: цветное меню + иконки.


menu_7.jpg
На втором скриншоте: hover в светлом стиле + иконки + иконки по умолчанию.


Шаблон многоколоночного hover:
  • Возможность выводить картинку раздела (в виде изображения, иконки или иконки по умолчанию);
  • Включение/выключение картинки категории (слева/справа);
  • Установка количества колонок для разных расширений экрана (от 1 до 4 колонок). Обратите внимание! Вы сами адаптируете его под устройства так, как это надо проекту
Меняя всего несколько настроек многоколоночного hover можно добиться разных по виду меню.

menu_8.jpg
В первом случае использованы следующие настройки: меню разбито на три колонки + иконки, картинка раздела не включена.


menu_9.jpg

Во втором случае: меню разделено на две колонки + выводятся картинки раздела.


menu_10.jpg

На третьем скриншоте: выводится картинка категории слева + иконки, меню разделено на 2 колонки, картинка раздела не включена.

В заключение хотелось бы сказать, что посмотреть и попробовать основные возможности нашего меню, вы можете уже сейчас на нашем демо-сайте  http://market.bxready.ru/, но помните — это всего лишь малая доля того, на что способен BXReady: Интерент-магазин.

Поэкспериментируйте с этими настройками на странице демо-версии сайта! Вкладка с цифрой 1 - настройки верхнего меню, вкладка 2 - настройки левого меню.
menu_11.jpg