Введите часть искомого слова, названия или фразы...
↑ ↓
  1. Новые темы озаглавленные с маленькой буквы - удаляются без предупреждения!
  2. Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!

jQuery Vertical Mega Menu - плагин-виджет вертикального выпадающего меню

Тема в разделе "Общее для WordPress", создана пользователем Stork.71, 28 дек 2013.

  1. Stork.71

    Stork.71 Местный

    Сообщения:
    1.043
    Симпатии:
    254
    Баллы:
    83
    JQuery Vertical Mega Menu Widget - бесплатный плагин, предназначенный для создания вертикального выпадающего меню в сайдбаре. Плагин предназначен для WordPress в целом, однако явно заточен под электронную коммерцию и может использоваться не только с WooCommerce, а и с другими плагинами для интернет-коммерции.
    screenshot-4-jquery-vertical-mega-menu.png
    Мне встречалось несколько разных плагинов для создания разного рода структурированных, выпадающих менюшек в сайдбаре, однако этот плагин выделяется. Большинство из них автоматически создает меню на основе блоговых записей и категорий, на основе даты и месяца. Удобно, если у вас просто блог.
    Рассматриваемый же плагин позволяет создавать совершенно любые менюшки на основе страниц, товаров, категорий, меток - чего угодно! Это именно то, что надо для каталога товаров, хотя придется немного повозиться - пункты добавляются вручную.
    После скачивания, установки и активации плагина первое, что надо сделать - это создать необходимое меню, которое будет отображаться посредством плагина. В настройках сайта идем на вкладку "Внешний вид" -> "Меню" и создаем новое - ну допустим "menu2". Дальше наполняем его как хотим, делаем вложенные пункты. Поэкспериментировать можно и потом, первым делом главное создать хоть что-нибудь. Каждый пункт делается вручную ссылкой. То есть, если вставить в меню страничку каталога, то ссылка на каталог работать будет, но позиции из каталога в меню автоматически не подтянуться. Для наибольшего эффекта рекомендуется делать трехуровневые пункты меню, тогда плагин наибольшим образом себя покажет.
    screenshot-2.png
    Когда меню создано, надо сделать так, чтобы плагин начал его отображать. Идем во "Внешний вид" -> "Виджеты", находим там новый виджет "jQuery Vertical Mega Menu" и помещаем его в нужное место на сайдбаре. Тут можно порыться немного в настройках, хотя главное сейчас - это выбрать наше предварительно созданное меню "menu2" и нажать "Сохранить". Меню создано, его можно просмотреть на сайте!

    jQuery Vertical Mega Menu - Widget setup.jpg
    В настройках меню можно задать заголовок, выбрать нужное меню для отображения, выбрать количество колонок в развернутом меню, направление разворачивания, эффекты и скорость анимации, цветовой скин. Демонстрацию работы плагина в разных сочетаниях настроек можно просмотреть на странице разработчиков.
    Изначально в плагин зашито 8 разноцветных стилей.
    screenshot-3-jquery-vertical-mega-menu-plugin.png
    Однако отображение легко настраивается с помощью CSS (причем таблица CSS для каждого стиля своя, скопировал файлик white.css, переименовал в mybeststyle.css - вот тебе и новый скин "mybeststyle", который можно выбрать в настройках виджета ) и правкой фоновых картинок. Мне например пришлось вообще отказаться от использования картинок в качестве background'a в пользу простой цветовой заливки. К сожалению, из-за использования картинок менюшки отображались несколько некорректно, особенно когда пункт меню растягивался до двух строчек. Да и по цвету, по стилю мне родные скины не подходили. Немного терпения и знания CSS - и виджет изменяется как угодно, вплоть до добавления картинок.
    Важный момент! Со многими темами плагин может сразу не заработать, но если внимательно читать readme, то разработчики рассказывают, как это лечится.
    В вольном переводе - если основное меню отображается а выпадающее - нет, то проверьте, не установлено ли для сайдбара стилевое свойство overflow: hidden, которое как раз прячет все, что в сайдбар не помещается. Например, для темы Wootique это лечится добавлением в custom.css следующей строчки:
    Код:
    #sidebar{overflow:visible;}
    В общем, немного терпения - и великолепный выпадающий каталог с товарами, а при желании - и с дополнительной информацией готов!
    Скачать плагин JQuery Vertical Mega Menu Widget бесплатно можно здесь.
     
    Последнее редактирование: 11 апр 2014
    • Нравится Нравится x 2
  2. Zaknafain

    Zaknafain Местный

    Сообщения:
    137
    Симпатии:
    16
    Баллы:
    18
    добавил нужную строчку в custom.css темы вутик, но меню не выезжает почему то... да это снова я и снова с кучей вопросов )
     
  3. Stork.71

    Stork.71 Местный

    Сообщения:
    1.043
    Симпатии:
    254
    Баллы:
    83
    Вы само меню создали? Скриншот меню скиньте? Что ему раскрывать-то надо?
     
    • Нравится Нравится x 1
    • Согласен Согласен x 1
  4. Zaknafain

    Zaknafain Местный

    Сообщения:
    137
    Симпатии:
    16
    Баллы:
    18
    понял, выплывать нечему было, голова не соображала в тот день )))
     
  5. Drm

    Drm

    Сообщения:
    23
    Симпатии:
    10
    Баллы:
    3
    Доброго времени суток, такая проблема возникла.

    Стоит тема responsive


    Данный плагин подходит по функционалу, но дело в том, что на этой теме он некорректно работает. Как он работает видно на этой странице: http://drm1804.s7.webhost1.ru/?post_type=product

    Подскажите, в чем может быть проблема
     
  6. ADv

    ADv Местный

    Сообщения:
    430
    Симпатии:
    110
    Баллы:
    43
    Стили нужно править. Меню то работает, ссылки видно..
     
    • Нравится Нравится x 1
  7. Drm

    Drm

    Сообщения:
    23
    Симпатии:
    10
    Баллы:
    3
    Да это я уже понял, я удалил все стили, из основного шаблона и плагин заработал, но вот найти конфликт, я не могу

    Стили в плагине, или стили в основном шаблоне?
     
  8. ADv

    ADv Местный

    Сообщения:
    430
    Симпатии:
    110
    Баллы:
    43
    Все поправимо. Ковыряйте стили
    2.png
    Я понимаю, что это не идеальный результат. Просто показал, что дело конкретно в CSS. А еще конкретней, в том, что Ваше jQuery меню берет стили вашего верхнего меню..
     
    • Согласен Согласен x 1
  9. Drm

    Drm

    Сообщения:
    23
    Симпатии:
    10
    Баллы:
    3
    Еще такой момент по плагину. Я так понял ширина выпадающего окна рассчитывается в зависимости от количества столбцов. В стилях плагинаможно задать ширину каждого стобца, а вот общую ширину нет. Может кто-то правил, менял?
     
  10. sushkov

    sushkov

    Сообщения:
    2
    Симпатии:
    0
    Баллы:
    1
    Подскажите как избавиться от стрелок и точек которые выплывают выше строк? forestmsk.ru
     
  11. alexbelkevich

    alexbelkevich

    Сообщения:
    202
    Симпатии:
    22
    Баллы:
    18
    #secondary ul li:before,#secondary-left ul li:before {
    margin-right: 5px;
    content: "\f0da";
    font-family: "FontAwesome";сolor: #999999;
    display:none;
    }
     
    • Нравится Нравится x 2
  12. sushkov

    sushkov

    Сообщения:
    2
    Симпатии:
    0
    Баллы:
    1
    Большое спасибо)) Очень помогли(y)
     
  13. Sirojiddin

    Sirojiddin

    Сообщения:
    95
    Симпатии:
    10
    Баллы:
    8
    а как можно изменить внешний вид виджета?? дело в том что я не знаю работать с css кодами??? это мой первый интернет магазин.........
     
  14. Drm

    Drm

    Сообщения:
    23
    Симпатии:
    10
    Баллы:
    3
    Изменяется вид с помощью таблицы стилей, но если Вы не знаете CSS, то необходимо обращаться к специалистам.
     
  15. Sirojiddin

    Sirojiddin

    Сообщения:
    95
    Симпатии:
    10
    Баллы:
    8
    я понял....
    у меня еще проблема у меня это в теме
    Twenty Ten этот плагин неправильно работает ну дочерние элементы не выходят вот пример
    http://www.ooo-skrepka.uz
     
  16. Drm

    Drm

    Сообщения:
    23
    Симпатии:
    10
    Баллы:
    3
    Не совсем понял Вашу проблему. На сайте, который Вы показали в качестве примера все работает, но там стоит тема smartline-lite.
     
  17. Sirojiddin

    Sirojiddin

    Сообщения:
    95
    Симпатии:
    10
    Баллы:
    8
    ну я изменил тему всё работает.....но на теме Twenty Ten и во всех темах woocomerce......не работает
    я на пример на видео взял...

     
    Последнее редактирование: 11 янв 2015
  18. OniX

    OniX

    Сообщения:
    28
    Симпатии:
    2
    Баллы:
    3
    Хороший плагин, сталкивался с ним.
    А не встречали как сделать выпадающее меню для категорий товаров woocommerce автоматически. Т.е. для стандартного виджета категорий товаров реализовать выпадающее меню. А то вручную меню делать не совсем удобно.
     
  19. Stork.71

    Stork.71 Местный

    Сообщения:
    1.043
    Симпатии:
    254
    Баллы:
    83
    Когда-то попадались кажется, но мне на тот момент не понравились. Предпочитаю вручную :) Ищите! ;)
     
  20. OniX

    OniX

    Сообщения:
    28
    Симпатии:
    2
    Баллы:
    3
    Вот нашел WooCommerce Categories Menu
    В принципе делает что надо, остальное можно стилями допилить.
    Хотелось бы еще аккордеон реализовать :)