Настройка Max Mega Menu для Wordpress и обзор всех его функций
Опубликовано: 24.08.2018
Насколько я понимаю, под термином мега меню в WordPress подразумевают сверхфункциональное огромный блок навигации по сайту со множеством разных элементов: списками, картинками, текстами, слайдерами и т.п. Наверняка вы такие встречали. Когда-нибудь опубликую полноценную подборку по теме, но сегодня речь пойдет о вполне конкретном решении — плагине Max Mega Menu. Выбрал его так как уже тестировал в работе для WooCommerce меню , он часто попадает в списки лучших модулей , плюс тут имеется одна из самых толковых и постоянно развивающихся бесплатных (Lite) версий.
Создание и вывод меню в сайтбаре
Сразу после установки Max Mega Menu в WordPress ваша стандартная навигация преобразуется в более мощный и функциональный механизм с возможностью добавления разного рода виджетов, удобным редактором и кучей дополнительных настроек. Скачивайте плагин отсюда либо ищите его через WP админку.
На данный момент минимальная требуемая версия системы — 3.8, работает до последней сейчас 4.8.3. Загрузок около 100 тысяч. Мне нравится, что за последние 2 месяца было исправлено почти 70 разных багов из 89, что свидетельствует о хорошей активности разработчиков.
Основные функции и фишки Max Mega Menu
Поддерживаются несколько мест размещения, для каждого из которых сможете выбирать свои параметры; Простая работа с элементами навигации через Drag&Drop. Добавление иконок в пунктах меню . Есть удобный редактор тем оформления. Добавление любых виджетов: картинки, тексты, списки и др. Условие срабатывания: при наведении, клике. Эффекты вывода подменю: выезд, появление/затухание и т.п. Разные дополнительные опции по типу скрытия текста/ссылки или выключения на мобильной версии. Последний пункт поможет упростить создание отдельного обычного и мобильное меню в WordPress . Выравнивание для пунктов меню.Чтобы понять насколько все это круто и удобно, советую просто глянуть следующее видео:
Кроме всего разработчики могут похвастаться очень правильными и корректным подходим к созданию своего решения. WordPress Max Mega Menu — действительно качественный продукт, вот вам парочка подтверждений:
все оформление задается с помощью одного CSS файла, где вообще не используется «знаменитое» свойство important; поддержка Retina, адаптивность, срабатывание на смартфонах и планшетах (тестировали практически во всех существующих десктопных и мобильных браузерах); чистый код, JS скрипты при gzipped будут занимать менее 2Кб; поддержка разных фильтров/хуков; детальная документация + в отличии от многих других плагинов, форум поддержи достаточно живой.Настройка и работа с Max Mega Menu
Сразу после установки в админке появится одноименный раздел. В «Основных настройках» вы сможете подправить несколько опций, касающихся поведения подменю, мобильных девайсов и т.п. Куда более интересными выглядят «Темы».
Здесь сразу 6 вкладок с разными фишками:
Основные — выбирайте тип стрелок, тени, высоту строки и т.п. Меню бар — оформление основного блока: фоны, отступы, шрифты, наведение. Mega Menus — стили и настройки Mega Menu. Выпадающие — аналогичный остальным набор стилей. Mobile Menu — размер экрана для срабатывания и другие опции мобильного меню. Кастомное оформление — добавляйте свои CSS стили.После того как основные параметры заданы, переходим в раздел WP админки «Внешний вид» — «Меню».
Вам нужно выбрать меню, с которым хотите работать, а затем в его настройках поставить галочку напротив «Включено». Активировать Max Mega Menu в WordPress получится только когда для меню заданна область отображения в шаблоне (шапка, футер, сайдбар и т.п.). Здесь же есть параметры эффектов и событий срабатывания.
Чтобы открыть редактор модуля наводим курсор на один из пунктов иерархии и нажимаем на появившуюся кнопку «Мега меню». Во всплывающем окне отобразится соответствующий инструмент, который вы могли видеть в видеопрезентации плагина выше.
Тут сможете, во-первых, определить количество столбцов, а также добавить любые виджеты. Кроме того, допускается изменение размеров каждого элемента. Выбирать виджеты разрешается только в первом (главном) уровне навигации. Если кликать по кнопке «Мега меню» напротив других элементов, то только для задания иконок и разных свойств:
Скрытие текста/линка, выравнивание и отключение на декстопе/мобильных — весьма полезный набор функций. Допускается задание подобных опций в каждом пункте меню. Не забывайте сохранять изменения.
Max Mega Menu Pro и Выводы
Вообще у данной разработки кроме репозитория есть еще отдельный сайт . Там собраны описания всех возможностей модуля, представлена документация и небольшая его демка, а также есть ссылка на тех.поддержку и загрузку. Стоимость продвинутой версии Max Mega Menu Pro, в принципе, не такая уж и высокая — для 1 / 5 / 99 сайтов она обойдется вам в $23 / $35 / $99 долларов соответственно. Сюда входит апдейт и поддержка в течении года. Если вы разработчик, то взяв Pro Business Licence и установив плагин на 5 сайтов, получите итоговую стоимость решения = 7 долларам!
Что же входит в Max Mega Menu Pro:
Sticky фиксированное меню . Интеграция Google Fonts, наличие FontAwesome и пользовательских иконок в настройках. Поддержка вертикального и меню типа аккордеон. Общий логотип в навигации + блок поиска. Стили отдельных пунктов. Поддержка WooCommerce и EDD. Возможность настройки ролей пользователей . Поиск, иконки/лого и HTML для мобильных элементов. Автообновление и приоритетная поддержка.Для рядовых классических сайтов вполне хватает обычной бесплатной версии Max Mega Menu в WordPress, которая по функциональности очень хороша. Разных настроек здесь очень много. Понравилось также, что разработчики поддерживают свое детище, относительно быстро исправляют текущий баги и заботятся о чистоте/корректности кода. На ознакомление придется потратить некоторое время, но оно того стоит. Чтобы проще было разобраться с работой плагина — смотрите видео и читайте документацию.
А какие модули Mega Menu в WordPress вы используете и почему? Работали с данным решением, что можете по нему добавить?