JQuery Vertical Mega Menu Widget - бесплатный плагин, предназначенный для создания вертикального выпадающего меню в сайдбаре. Плагин предназначен для WordPress в целом, однако явно заточен под электронную коммерцию и может использоваться не только с WooCommerce, а и с другими плагинами для интернет-коммерции.
Мне встречалось несколько разных плагинов для создания разного рода структурированных, выпадающих менюшек в сайдбаре, однако этот плагин выделяется. Большинство из них автоматически создает меню на основе блоговых записей и категорий, на основе даты и месяца. Удобно, если у вас просто блог.
Рассматриваемый же плагин позволяет создавать совершенно любые менюшки на основе страниц, товаров, категорий, меток - чего угодно! Это именно то, что надо для каталога товаров, хотя придется немного повозиться - пункты добавляются вручную.
После скачивания, установки и активации плагина первое, что надо сделать - это создать необходимое меню, которое будет отображаться посредством плагина. В настройках сайта идем на вкладку "Внешний вид" -> "Меню" и создаем новое - ну допустим "menu2". Дальше наполняем его как хотим, делаем вложенные пункты. Поэкспериментировать можно и потом, первым делом главное создать хоть что-нибудь. Каждый пункт делается вручную ссылкой. То есть, если вставить в меню страничку каталога, то ссылка на каталог работать будет, но позиции из каталога в меню автоматически не подтянуться. Для наибольшего эффекта рекомендуется делать трехуровневые пункты меню, тогда плагин наибольшим образом себя покажет.
Когда меню создано, надо сделать так, чтобы плагин начал его отображать. Идем во "Внешний вид" -> "Виджеты", находим там новый виджет "jQuery Vertical Mega Menu" и помещаем его в нужное место на сайдбаре. Тут можно порыться немного в настройках, хотя главное сейчас - это выбрать наше предварительно созданное меню "menu2" и нажать "Сохранить". Меню создано, его можно просмотреть на сайте!
В настройках меню можно задать заголовок, выбрать нужное меню для отображения, выбрать количество колонок в развернутом меню, направление разворачивания, эффекты и скорость анимации, цветовой скин. Демонстрацию работы плагина в разных сочетаниях настроек можно просмотреть на странице разработчиков.
Изначально в плагин зашито 8 разноцветных стилей.
Однако отображение легко настраивается с помощью CSS (причем таблица CSS для каждого стиля своя, скопировал файлик white.css, переименовал в mybeststyle.css - вот тебе и новый скин "mybeststyle", который можно выбрать в настройках виджета ) и правкой фоновых картинок. Мне например пришлось вообще отказаться от использования картинок в качестве background'a в пользу простой цветовой заливки. К сожалению, из-за использования картинок менюшки отображались несколько некорректно, особенно когда пункт меню растягивался до двух строчек. Да и по цвету, по стилю мне родные скины не подходили. Немного терпения и знания CSS - и виджет изменяется как угодно, вплоть до добавления картинок.
Важный момент! Со многими темами плагин может сразу не заработать, но если внимательно читать readme, то разработчики рассказывают, как это лечится.
В общем, немного терпения - и великолепный выпадающий каталог с товарами, а при желании - и с дополнительной информацией готов!
Скачать плагин JQuery Vertical Mega Menu Widget бесплатно можно здесь.
Мне встречалось несколько разных плагинов для создания разного рода структурированных, выпадающих менюшек в сайдбаре, однако этот плагин выделяется. Большинство из них автоматически создает меню на основе блоговых записей и категорий, на основе даты и месяца. Удобно, если у вас просто блог.
Рассматриваемый же плагин позволяет создавать совершенно любые менюшки на основе страниц, товаров, категорий, меток - чего угодно! Это именно то, что надо для каталога товаров, хотя придется немного повозиться - пункты добавляются вручную.
После скачивания, установки и активации плагина первое, что надо сделать - это создать необходимое меню, которое будет отображаться посредством плагина. В настройках сайта идем на вкладку "Внешний вид" -> "Меню" и создаем новое - ну допустим "menu2". Дальше наполняем его как хотим, делаем вложенные пункты. Поэкспериментировать можно и потом, первым делом главное создать хоть что-нибудь. Каждый пункт делается вручную ссылкой. То есть, если вставить в меню страничку каталога, то ссылка на каталог работать будет, но позиции из каталога в меню автоматически не подтянуться. Для наибольшего эффекта рекомендуется делать трехуровневые пункты меню, тогда плагин наибольшим образом себя покажет.
Когда меню создано, надо сделать так, чтобы плагин начал его отображать. Идем во "Внешний вид" -> "Виджеты", находим там новый виджет "jQuery Vertical Mega Menu" и помещаем его в нужное место на сайдбаре. Тут можно порыться немного в настройках, хотя главное сейчас - это выбрать наше предварительно созданное меню "menu2" и нажать "Сохранить". Меню создано, его можно просмотреть на сайте!
В настройках меню можно задать заголовок, выбрать нужное меню для отображения, выбрать количество колонок в развернутом меню, направление разворачивания, эффекты и скорость анимации, цветовой скин. Демонстрацию работы плагина в разных сочетаниях настроек можно просмотреть на странице разработчиков.
Изначально в плагин зашито 8 разноцветных стилей.
Однако отображение легко настраивается с помощью CSS (причем таблица CSS для каждого стиля своя, скопировал файлик white.css, переименовал в mybeststyle.css - вот тебе и новый скин "mybeststyle", который можно выбрать в настройках виджета ) и правкой фоновых картинок. Мне например пришлось вообще отказаться от использования картинок в качестве background'a в пользу простой цветовой заливки. К сожалению, из-за использования картинок менюшки отображались несколько некорректно, особенно когда пункт меню растягивался до двух строчек. Да и по цвету, по стилю мне родные скины не подходили. Немного терпения и знания CSS - и виджет изменяется как угодно, вплоть до добавления картинок.
Важный момент! Со многими темами плагин может сразу не заработать, но если внимательно читать readme, то разработчики рассказывают, как это лечится.
В вольном переводе - если основное меню отображается а выпадающее - нет, то проверьте, не установлено ли для сайдбара стилевое свойство overflow: hidden, которое как раз прячет все, что в сайдбар не помещается. Например, для темы Wootique это лечится добавлением в custom.css следующей строчки:
Код:
#sidebar{overflow:visible;}Скачать плагин JQuery Vertical Mega Menu Widget бесплатно можно здесь.
Последнее редактирование:
