Плагин WP Mega Menu: функциональные возможности, установка, настройка. Max Mega Menu – многофункциональный плагин меню WordPress Мега меню вордпресс

Главная / Установка устройств

На чтение 8 мин. Опубликовано 01.11.2016

Привет! Мы продолжаем разбирать самые интересные и самые полезные плагины для сайта WordPress! Сегодня вы узнаете о супер полезном плагине, который позволит вам создать горизонтальное выпадающее меню. Вы сможете вставлять в выпадающее меню любые виджеты, текст, редактор, фото, видео, формы, html код.

Вы сможете полностью настроить внешний вид меню и настроить выпадающее меню. Можно добавить в горизонтальное выпадающее меню до 8 восьми колонок. Можно отключить выпадающее меню для мобильных устройств. Очень гибкий плагин, вы сможете сделать Супер меню!


Установить Супер плагин вы сможете прямо из админ-панели WordPress. Перейдите на страницу: Плагины – Добавить новый , введите название плагина в форму поиска, нажмите Enter, установите и активируйте плагин.



General Settings .

Click Event Behaviour, поведение при клике. Здесь у вас на выбор два варианта:

  • First click will open a sub menu, second click will close the sub menu , первый клик открывает подменю, второе нажатие закрывает подменю;
  • First click will open a sub menu, second click will follow the link , первый клик открывает подменю, второй клик по ссылке.
  • Оставьте по умолчанию, ничего не меняйте.

Mobile Menu Behaviour, поведение на мобильном меню,

  • Standard – Open sub menus will remain open until closed by the user , Стандарт – открытое подменю будет оставаться открытым, пока его не закроет пользователь.
  • Accordion – Open sub menus will automatically close when another one is opened , Аккордеон – открытые подменю будет автоматически закрываться, когда другое открыто.

CSS Output, оставьте по умолчанию, ничего не надо менять здесь.

Menu Item Descriptions, включить или отключить описание для пунктов меню.

Active Menu Instances, Некоторые темы будут выводить расположение меню несколько раз на одной странице. Например, ваша тема может выводить расположение меню после главного меню, затем снова для мобильного меню. Этот параметр можно использовать, чтобы убедиться, что меню Max Mega Menu применяется только к одному из этих экземпляров.

.

Menu Themes .

Select theme to edit, здесь указано меню, которое вы будете редактировать. Можно создать и выбрать другое меню.

Theme Title, заголовок темы меню, оставьте по умолчанию.

Arrow, можно выбрать стрелку, которая отображается в пункте меню с выпадающим меню.

Line Height, линия высоты.

Z Index, показатель Z Index, можно оставить по умолчанию.

Shadow, можно настроить тень меню.

Hover Transitions, включить переходы при наведении на пункты меню.

Reset Widget Styling, отключить стили виджетов Mega Menu.

Menu Bar .

Menu Height, высота меню.

Menu Background, цвет фона меню.

Menu Padding, обивка меню.

Menu Border Radius, радиус границы меню.

Menu Items Align, расположение пунктов меню.

Menu Item Background, цвет фона пунктов меню.

Menu Item Background (Hover), цвет фона пункта меню при наведении.

Menu Item Spacing, интервал пунктов меню.

Font, параметры шрифта, цвет, размер, расположение, семейство и т.д.

Font (Hover), параметры шрифта при наведении.

Menu Item Padding, обивка пунктов меню.

Menu Item Border, параметры границы пункта меню.

Menu Item Border (Hover), параметры границы пункта меню при наведении.

Menu Item Border Radius, параметры радиуса границы пункта меню.

Menu Item Divider, разделитель меню.

Highlight Current Item, выделять текущий пункт меню.

Mega Menus .

Panel Background, цвет фона выпадающего меню.

Panel Width, ширина окна выпадающего меню.

Panel Padding, обивка.

Panel Border, цвет и размер границ.

Panel Border Radius, радиус границы.

Item Padding , обивка пункта меню в выпадающем меню.

Widgets .

Heading Font, параметры шрифта заголовка виджета в выпадающем меню.

Heading Padding, обивка заголовка.

Heading Margin, отступы от границ заголовка виджета.

Header Border, параметры границы бордюра.

Content Font, шрифт в содержании виджета.

Second Level Menu Items .

Font, шрифт пунктов меню второго уровня.

Font (Hover), шрифт при наведении.

Background (Hover), цвет фона при наведении.

Padding, обивка.

Margin, отступ.

Border, бордюр, граница.

Third Level Menu Items . Те же настройки, только для пунктов меню третьего уровня.

Flyout Menus .

Menu Background, цвет фона выпадающего меню второго или третьего уровня.

Menu Width, ширина меню.

Menu Padding, обивка.

Menu Border, граница.

Menu Border Radius, радиус границы.

Item Background, цвет фона пункта меню.

Item Background (Hover), цвет фона пункта при наведении.

Item Height, высота пункта меню.

Item Padding, обивка пункта.

Item Font, шрифт текста в пункте меню.

Item Font (Hover), шрифт при наведении.

Item Divider, разделитель элемента.

Mobile menu .

Toggle Bar Designer, здесь показано как выглядит меню на мобильных устройствах.

Responsive Breakpoint, ширина для перехода в мобильное меню.

Toggle Bar Background, цвет фона кнопки открытия мобильного меню.

Disable Mobile Toggle, можно отключить переключатель меню.

Toggle Bar Height, высота переключателя мобильного меню.

Mega Menu Columns, сколько колонок в выпадающем меню на мобильном сайте.

Menu Background, цвет фона мобильного меню.

Menu Item Height, высота пункта меню.

Custom Styling . Здесь можно добавить свои CSS стили для меню.

Сохраните сделанные изменения .

Menu Locations .

– здесь вы сможете создавать области меню, в которые потом сможете добавлять меню. Чтобы создать область для меню, нажмите на кнопку – Add another menu location .


Область меню вы сможете добавлять на сайт, с помощью шорткода или php кода.


На странице: Внешний вид – Меню – Управление областями , вы сможете добавить меню для области.


Tools .

Cache, здесь можно очистить кэш CSS, не обязательно, кэш автоматически очищается при каждом сохранении меню.

Plugin Data, удалить все данные плагина, сохранённые в базе данных WordPress. Только в случае удаления плагина!

Export Theme, можно экспортировать тему мега меню в формате JSON или PHP.

Import Theme, можно импортировать тему мега меню.

Enable, поставьте здесь галочку, чтобы включить мега меню.

Event, здесь можно выбрать как будет открываться выпадающее меню.

Effect, можно выбрать эффект для выпадающего меню.

Theme, тема меню, по умолчанию.

После включения мега меню, в каждом виджете страницы, при наведении, появится кнопка – Mega Menu . Нажмите на данную кнопку, чтобы настроить выпадающее меню для данного пункта меню.


Далее, у вас откроется окно. Вверху справа нажмите по широкому полю, чтобы выбрать виджет и добавить его в меню. Вверху справа вы можете выбрать сколько будет колонок в выпадающем меню. Виджеты можно распределять по выпадающей панели, можно указать какую часть виджет будет занимать, пример 1/2 или 1/3. Жмите по стрелкам вправо и влево, чтобы указать какую часть будет занимать виджет.


Чтобы открыть и настроить виджет, добавить в него какое-либо содержание и т.д., справа в виджете нажмите на значок ключа. Настройте виджет и сохраните его.


Hide Text, скрыть текст из пункта меню.

Hide Arrow, скрыть стрелку.

Hide item on Mobile, скрыть пункт меню на мобильных устройствах.

Hide item on Desktop, скрыть пункт меню на компьютерах.

Menu item Align, расположение пункта меню.

Sub Menu Align, расположение меню второго уровня.

Hide sub menu on Mobile, скрыть меню второго уровня на мобильных устройствах.

Сохраните изменения .



Всё готово! Сохраните меню, перейдите на сайт и наслаждайтесь результатом!

Внимание! После включение мега меню, стиль вашего меню по умолчанию будет полностью изменён. Вам нужно будет настраивать стиль меню в настройках, на вкладке “Menu Themes” .

Остались вопросы? Напиши комментарий! Удачи!

Меню является основой всей навигации по сайту. Благодаря меню, пользователь может быстро сориентироваться на сайте и найти нужную ему информацию. Вполне можно утверждать, что сайт “начинается” с меню, ведь только этот элемент может дать пользователю представление о структуре интернет-ресурса.

WordPress из “коробки” предлагает довольно широкие возможности для работы с меню. Так, встроенные инструменты позволяют создать одно или несколько меню, с любой вложенностью, добавить туда произвольные ссылки и пр. Но часто владельцу сайта стандартных инструментов бывает недостаточно для построения меню, отвечающего всем его запросам.

Мега плагин Max Mega Menu

Обычно разработчики тем не предусматривают каких-либо расширенных настроек для кастомизации внешнего вида меню на сайте. Например, эффекты при наведении и нажатии и т.п. Мощный бесплатный плагин Max Mega Menu призван расширить инструментарий навигации сайта и предлагает для этого WordPress-пользователю следующие возможности:

  • основывается на стандартной системе WordPress;
  • поддержка нескольких областей меню (каждая со своей конфигурацией);
  • обеспечение удобного перетаскивания с помощью Drag&Drop ;
  • возможность отображения виджетов WordPress в меню;
  • настройка стилей меню, используя встроенный редактор тем;
  • поддержка стилей подменю;
  • поддержка Hover , Hover Intent или Click для открытия подменю;
  • эффекты Fade , Fade Up , Slide Up или Slide при переходе в подменю;
  • возможность добавления иконок к пунктам меню;
  • расширенные параметры пункта меню, включая “Скрыть текст” , “Отключить связь” , “Скрыть на мобильном телефоне и т.п.;
  • выравнивание элементов меню влево или вправо от строки и родительского пункта меню;
  • адаптивный дизайн для отображение на любом экране;
  • поддержка разных фильтров/хуков;
  • высокое быстродействие работы;
  • детальная документация и форум поддержи.

Настройка Max Mega Menu

Для начала плагин необходимо установить и активировать. Теперь давайте рассмотрим, что он умеет. Для этого следует перейти в админ-раздел Внешний вид -> Меню . Следует отметить, что если у Вас на сайте еще нет навигационного меню, то создайте его, добавив необходимые пункты. О том, как создать на сайте WordPress меню, мы детально рассказывали в из наших прошлых статей. После этого обратите внимание на блок опций слева, который называется Настройки Max Mega Menu .

Для того, чтобы плагин начал свою работу, следует отметить опцию Включено .

Рассмотрим коротко каждую из настроек.

Настройка Событие определяет, при каком событии будут выпадать подпункты меню.

Эффект отвечает за анимационные появления и ее скорость.

В опции Тема можно выбрать оформление меню. По умолчанию там только одна тема. О том, как создать свою, мы расскажем ниже.

Кликните на нее, после чего перед Вами откроется всплывающее окно с настройками.

В окне настроек разделено на три вкладки.

Вкладка Мега Меню позволяет определить, будет выводиться обычное меню или меню с виджетами. Если будет выбрано последнее, то в списке Режим отображения подменю нужно указать Мега меню и в соседнем списке выбрать необходимые виджеты. Если же требуется обычное меню, то следует выбрать Выпадающее меню .

Вкладка Settings позволяет настроить пункты меню. Тут присутствуют опции текста, ссылки, иконки, адаптивности и другое.

На вкладке Icon можно задать иконку для пунктов меню.

Можно сделать вывод, что присутствующие в плагине настройки позволяют гибко настроить по отдельности каждый пункт навигации.

Теперь следует рассмотреть более глобальные настройки плагина Max Mega Menu . Для этого необходимо перейти в админ-меню в раздел Мега Меню -> Основные настройки . Видно, что тут находятся всяческие технические опции плагина. В принципе их можно оставить по умолчанию. Также тут можно задать поведение меню при клике мышки, его адаптивность, настройки CSS и т.п.

В разделе Мега Меню -> Темы меню можно изменить существующую или создать новую тему оформления. Видно, что присутствует довольно большое количество разнообразных настроек, включая цвет, размер, тень, анимация, отступы, ориентации для компьютерного и мобильного вида. Также при необходимость можно использовать собственные CSS -правила. Созданные таким образом темы можно применить в редакторе меню.

В разделе Мега Меню -> Локации меню Вы сможете создавать новые области для размещения меню. После создания вы получите специальный PHP -код, который позволяет публиковать области в любом месте сайта, в файлах темы, а также шорткод, благодаря которому области меню можно добавлять прямо в записи/страницы.

Раздел Мега Меню -> Инструменты служит для экспорта/импорта созданных ранее тем, а также присутствует еще несколько технических опций (очистка кеша, полное удаление всех данных плагина).

В качестве заключения

Плагин Max Mega Menu обладает огромным количеством настроек, благодаря которым можно сделать оригинальную и красочную навигацию на Вашем сайте.

Нажмите, пожалуйста, на одну из кнопок, чтобы узнать понравилась статья или нет.

Мне нравится 1 Не нравится

Привет! В моей жизни как всегда происходит множество событий, поэтому очень сложно выкроить время для блога. Вчера мы купили билеты в Шри-Ланку и скоро улетаем на 4 месяца, приезжайте в гости! А теперь я занимаюсь поиском самого красивого свадебного платья:))
Сегодня поговорим о том, как создать меню в WordPress, а также добавлять данные блоки в произвольных областях шаблона.
Мы научимся настраивать меню и редактировать его по своему усмотрению.

Редактирование и настройка меню в Вордпресс

Для начала разберем функционал, доступный нам в админ-панели блога. В новых шаблонах, совместимых с последними версиями WordPress, вывод меню достаточно прост и настройка не составляет особых трудностей.

После того, как мы создали дочернюю тему, в которую можно вносить изменения без ущерба для основной темы, добавим в ее файл function.php следующую функцию.

1 2 3 register_nav_menus( array ( "additionalmenu" => __( "Additional Menu" , "Название Вашей Темы" ) ) ) ;

register_nav_menus(array("additionalmenu" => __("Additional Menu", "Название Вашей Темы")));

Если вы не создаете дочернюю тему, то добавляем ее в основной файл функций вашей темы.

Данная функция позволит нам добавить дополнительное меню WordPress в наш шаблон и создаст для него еще одну область.

После добавления заходим в админку в «Управление областями»:

Должна появиться дополнительная область темы с названием, которое мы задали в функции.

Нажимаем «Использовать новое меню», если хотим изменить разделы для дополнительной области, либо выбираем «Главная». Тогда в новой области будут отображаться те же разделы, что и в Primary Menu.

В нашем случае создаем новое меню под названием Additional:

Выбираем для него область темы «Additional Menu».

Но теперь нам нужно связать эту область с блоками шаблона. Например, нам нужно сделать дополнительное меню под шапкой сайта на WordPress. Заходим в файл header.php или копируем его в дочернюю тему. После тега body добавляем следующее:

1 2 3 <div id = "additionalmenu" > ( array( "theme_location" = > "additionalmenu")); ?> </ div >

"additionalmenu")); ?>

Смотрим результат:

У нас над шапкой образовалось дополнительное меню. Теперь нам нужно задать для него стили, выровнять пункты в строку и спустить блок под шапку.

Вносим следующие изменения в файл стилей style.css:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 #additionalmenu nav { width : 940px ; /*ширина контейнера */ margin : 0 auto ; } #additionalmenu li { display : inline ; padding : 10px ; /* отступы */ margin : 20px 0 ; } #additionalmenu { width : 100% ; top : 420px ; /* Отступ от верхнего края */ background-color : #000 ; /* цвет фона */ position : relative ; }

#additionalmenu nav { width: 940px; /*ширина контейнера */ margin: 0 auto; } #additionalmenu li { display: inline; padding: 10px; /* отступы */ margin: 20px 0; } #additionalmenu { width: 100%; top: 420px; /* Отступ от верхнего края */ background-color: #000; /* цвет фона */ position: relative; }

Смотрим, что получилось:

Отображение созданного нами меню еще далеко от идеала, но, при должном , вы сможете привести его в соответствующий вашему блогу вид.

Виджеты и плагины для добавления меню в WordPress

Предлагаю к просмотру видео о создании меню в WordPress:

В статье про упоминался виджет «Произвольное меню». Разберем его подробнее.

Заходим «Внешний вид» — «Виджеты», находим виджет «Произвольное меню» и перетаскиваем его в доступную для вашей темы и подходящую для блога область:

В нашем случае блок меню добавлен в сайдбар. Для него мы выбрали разделы, созданного нами блока Additional.

Соответственно в боковой панели справа у нас отобразится следующий блок:

Кроме встроенного в тему стандартного виджета, также есть множество дополнительных плагинов, предназначенных для создания различных видов меню: вертикальные, горизонтальные, выпадающие и т.д.

Вот, к примеру, плагин для создания вертикального мультиуровневого меню в WordPress: Navgoco Vertical Multilevel Slide Menu.

Или обладающий расширенными функциями настройки виджет Dropdown Menu Widget.

Также популярны виджеты с JQwery эффектами для меню, например: JQuery Slick Menu Widget.

Разберем на примере принцип его работы.

После установки виджета JQuery Slick Menu Widget, переходим во «Внешний вид» — «Виджеты».

Среди списка доступных виджетов должен появится новый, установленный нами. Перемещаем его в доступную область, в нашем случае сайдбар:

Раскрываем его настройки:

Выбираем название меню (разделы, которые мы создавали), Tab Text – название блока, который будет выводиться на сайте, место размещения (выберем Left – слева), Offset – отступ от верхнего края в пикселях, Animation Speed – скорость анимации (Fast). Можно выбрать Auto-Close Menu, чтобы блок исчезал автоматически. И выбираем цвет блока. Нажимаем сохранить и смотрим результат:

Слева в шапке появилось выдвижное меню. При клике на язычок, появляется отображение разделов:

При повторном нажатии, блок снова исчезнет.

Это лишь один из видов установки, редактирования и вывода меню в WordPress.

Выбирайте наиболее приемлемый и удобный способ создания меню для своего WordPress-блога. Удачи!

Широко известно, что в WordPress 3.0 добавлена поддержка произвольных меню (настраиваемых меню). Вещь, на мой взгляд, крайне удобная и полезная. Собственно, отсюда и эта статья.

Удобство заключается в том, что теперь можно создавать и конфигурировать меню прямо из админки, добавляя ссылки кликами по чекбоксам и меняя порядок ссылок простым перетаскиванием. В меню можно добавить ссылки на страницы, категории и отдельные посты. Можно создавать многоуровневые меню, так же в меню можно добавлять свои произвольные ссылки, о которых WordPress не знает. В общем, полная свобода действий.

Однако, чтобы такая "свобода" была доступна, нужно, скажем так, легким движением мышки, настроить вывод произвольного меню в шаблон.

Использовать такие меню будет крайне удобно, если пользоваться мультисайтовой возможностью WordPress, потому что для разных сайтов можно будет настраивать разные меню, а шаблон для них использовать один.

Заметка: меню работает через таксономию (nav_menu) WordPress, а произвольные (внешние) ссылки, записываются в основную таблицу БД posts. Такой подход более гибкий и динамичный, однако требует постоянной генерации таких меню.

Register_nav_menus(array("top" => "Верхнее меню", //Название месторасположения меню в шаблоне "bottom" => "Нижнее меню" //Название другого месторасположения меню в шаблоне));

Сейчас мы зарегистрировали 2 меню с идентификаторами " top " и " bottom " с соответствующими им названиями. Идентификаторы нужны, чтобы использовать их в теме, для указания того места, где, через функцию вывода wp_nav_menu() , будет выводиться созданное в админке меню. Названия зарегистрированных расположений мы увидим в админке, когда зайдем в раздел Внешний вид -> Меню.

После того, как меню зарегистрированы, идем в админку и создаем свои меню (в данном примере 2 менюшки):

    Задаем название меню (меню в шаблоне можно выводить по указанному названию, функцией wp_nav_menu()

    Создаем пункты меню. Используем левый блок: страницы ссылки, рубрики

  1. Выбираем где будет расположено меню, так как мы зарегистрировали 2 менюшки, у нас будет 2 варианта: "Верхнее меню" и "Нижнее меню".

Поддержка произвольных меню в WordPress включается для каждой темы отдельно, такой строчкой в файле functions.php add_theme_support("menus"); Однако, в этой строчке нет необходимости, если мы регистрируем меню. В этом случаем поддержка будет включена автоматически.

Вывод произвольных меню через функцию wp_nav_menu

Меню зарегистрированы и созданы, осталось добавить их в шаблон. Делается это функцией wp_nav_menu() , которая может принимать следующие параметры:

Wp_nav_menu(array("menu" => "", // (string) Название выводимого меню (указывается в админке при создании меню, приоритетнее // чем указанное местоположение theme_location - если указано, то параметр theme_location игнорируется) "container" => "div", // (string) Контейнер меню. Обворачиватель ul. Указывается тег контейнера (по умолчанию в тег div) "container_class" => "", // (string) class контейнера (div тега) "container_id" => "", // (string) id контейнера (div тега) "menu_class" => "menu", // (string) class самого меню (ul тега) "menu_id" => "", // (string) id самого меню (ul тега) "echo" => true, // (boolean) Выводить на экран или возвращать для обработки "fallback_cb" => "wp_page_menu", // (string) Используемая (резервная) функция, если меню не существует (не удалось получить) "before" => "", // (string) Текст перед каждой ссылки "after" => "", // (string) Текст после каждой ссылки "link_before" => "", // (string) Текст перед анкором (текстом) ссылки "link_after" => "", // (string) Текст после анкора (текста) ссылки "depth" => 0, // (integer) Глубина вложенности (0 - неограничена, 2 - двухуровневое меню) "walker" => "", // (object) Класс собирающий меню. Default: new Walker_Nav_Menu "theme_location" => "" // (string) Расположение меню в шаблоне. (указывается ключ которым было зарегистрировано меню в функции register_nav_menus)));

В данном примере в шаблон нужно вставить примерно (зависит от необходимых вам параметров) такие, 2 кода:

#1. Вывод меню по расположению

Верхнее меню. Вставляем в шапку шаблона (header.php), там где будет выводится верхнее (top) меню:

"menu", "theme_location"=>"top", "after"=>" /")); ?>

Выведет созданное в админке меню, прикрепленное к расположению "Верхнее меню" с подобной структурой:

Нижнее меню. Вставляем в подвал шаблона (footer.php), там где будет выводится нижнее (bottom) меню:

Выведет созданное в админке меню, прикрепленное к расположению "Нижнее меню". Структура будет идентичная первой.

Обратите внимание, в первом варианте параметры были переданы через массив (array). Во втором через строку. Оба варианта правильны. Это обычное дело для функций WordPress - параметры можно передавать как массивом, так и строкой (строка потом преобразовывается в массив).

#2 Выводим меню по названию

Чтобы вывести меню по его названию можно воспользоваться аргументом "menu". Название указывается, то которое было задано при создании меню в админке. В нашем примере (см. картинку) "Главное меню". Аргумент menu обладает большим приоритетом чем theme_location , а значит, если мы выводим по названию, то параметр theme_location будет игнорироваться.

Можно указать ID меню, а не название. Так, при изменении названия меню, код останется рабочим. ID меню можно посмотреть в УРЛ во время редактирования меню:

Заметки

Уберем обертку Div

Вы наверное обратили внимание, что меню "оборачивается", часто, ненужным тегом div. Его можно удалить, указав в аргументах для функции wp_nav_menu() пустой параметр "container"=>"" .

Изменяем параметры по умолчанию

Чтобы постоянно не указывать один и те же параметр для вставляемых меню, их можно переопределить в functions.php . Делается это через фильтр wp_nav_menu_args:

Register_nav_menus(array("top" => "Верхнее меню", "bottom" => "Нижнее меню")); add_filter("wp_nav_menu_args", "my_wp_nav_menu_args"); function my_wp_nav_menu_args($args=""){ $args["container"] = ""; return $args; }

По аналогии, можно создать свои аргументы по умолчанию: $args["аргумент"] = "значение" .

Проверка зарегистрировано ли меню

В WordPress так же есть, функция условия: has_nav_menu("top") - проверяет было ли зарегистрировано расположение меню top . Если меню не указано, то функция wp_nav_menu() сработает, как wp_list_pages() , но "обворачиватель" div останется, несмотря на то что в аргументах мы его убрали. Решить эту проблему можно так:

If (has_nav_menu("top")){ wp_nav_menu(array("container" => "", "theme_location" => "top", "menu_class" => "menu")); } else { echo "

"; }

Выпадающие мега-меню - отличная дизайнерская находка.Навигация по сайту , содержащим большое количество страниц, всегда представляла собой определенную проблему. Классическое статическое меню а-ля sitemap быстро разрастаются по мере роста числа страниц и занимают очень много места. Динамические выпадающие меню позволяют существенно экономить пространство страницы, но в жертву приносится удобство пользования - для навигации требуется активная и довольно точная работа мышью. Чуть промахнулся и раскрывается не то меню.

Толчком к развитию концепции мега-меню послужил, вероятно, ленточный интерфейс Microsoft Office 2007. Эта концепция находится как раз посредине между простым статическим меню и динамическим раскрывающимся. С одной стороны, такое меню достаточно информативно и интуитивно понятно, с другой - значительно сокращает необходимые манипуляции мышью. Раскрываясь, оно может использовать все доступное пространство экрана, что позволяет пользователю охватить взглядом все предлагаемые в данном контексте пункты, а при необходимости скрывается.

Как бы там ни было, а мега-меню сейчас, что называется, в тренде и если вы до сих пор еще не использовали его, то стоит присмотреться к нему поближе.

UberMenu: WordPress Mega Menu Plugin

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

Кроме того меню также имеет ряд других замечательных особенностей, таких как:

  • Встроенная адаптивная сетка
  • Индивидуальная настройка ширины каждой колонки а также задание ширины по умолчанию
  • Объединение пунктов меню в группы
  • Центрирование пунктов меню в горизонтальных строках
  • Индивидуальные фоновые изображения
  • Прокручиваемые подменю, содержащие большое количество пунктов.
В целом, очень мощный плагин, который я настоятельно рекомендую.

Стоимость: $19

Mega Main Menu

Очень популярный и широко используемый плагин Mega Main Menu умеет держать баланс между функциональностью и простотой. В вашем распоряжении свыше 10 различных инструментов для создания выпадающих меню, которые могут содержать текст, изображения, ссылки и виджеты . А кроме этого - неограниченные цветовые настройки и свыше 600 шрифтов Google.

Стоимость: $15

Liquida Mega Menu

Liquida Mega Menu - современный и многофункциональный плагин, который подойдет как обычным пользователям, так и разработчикам - его можно легко встроить в собственную разрабатываемую тему.

Плагин предлагает широкие возможности для создания меню с современным и стильным дизайном: вертикальной или горизонтальной ориентацией, возможностью включать в пункты меню ссылки, изображения и даже карточки товаров WooCommerce или Easy Digital Downloads, что может пригодиться при разработке интернет-магазинов.

Стоимость: $19

Sky Mega Menu

Три варианта дизайна для мобильных устройств, 9 цветовых схем, собственная сетка, формы и 360 векторных иконки. Этот набор позволяет Sky Mega Menu занять достойное место среди себе подобных.

Стоимость: $6

WP Mega Menu

Плагин из категории must have. Множество настроек и опций, работа с категориями, подкатегориями и сообщениями, SEO-оптимизация и две предустановленные цветовые схемы (темная и светлая), которые, впрочем, можно легко изменить по своему вкусу.

Стоимость: $29

NOO Menu

Для того, чтобы разобраться в панели настроек NOO Menu вам даже не придется читать документацию - настолько все интуитивно понятно. Имея под рукой предварительный просмотр в реальном времени, вы сможете просто изменять значения и передвигать ползунки, наблюдая производимый эффект. Цветовую схему можно изменять совершенно произвольно и каждый вариант сохранять под своим именем, причем количество этих вариантов неограничено.

Содержимое пунктов меню может представлять собой текст, ссылки, изображения, видео , формы и различные виджеты . Для размещения всего этого используется собственная 12-колоночная сетка.

Стоимость: $15

Hero Menu – Responsive WordPress Mega Menu Plugin

Hero Menu позволяет привязывать к пунктам меню ссылки на сообщения, категории, внешние URL, а также отображать в них записи блога вместе с featured image. В последней версии анонсирована полная поддержка платформы WooCommerce. Для удобной работы имеет встроенный drag-and-drop редактор .

Дизайн современный и стильный и, конечно же, полностью .

Стоимость: $19

Superfly - Responsive WordPress Menu Plugin

Так называемое fly-меню - последний тренд в мире веб-дизайна. Такое меню тихо «дремлет» в углу странички в виде пиктограммы, практически не занимая места, а при наведении курсора раскрывается, смещая элементы страницы, а не перекрывая их.

Одним из представителей данной разновидности мега-меню является Superfly - Responsive WordPress Menu Plugin. Впечатляющий инструмент как в плане дизайна, так и характеристик.

Стоимость: $22

Toggle Menu

С ростом популярности мобильных устройств, всплывающие (или контекстные) меню приобретают важное значение, поскольку позволяют значительно экономить экранное пространство.

Toggle menu - очень простое, минималистическое меню , которое, тем не менее, отлично справляется со своей основной функцией.

Стоимость: $5

WP Floating Menu Pro

WP Floating Menu Pro - это плагин 2 в 1. Меню-навигатор для одностраничного сайта и меню-наклейки. Более того: при помощи этого плагина вы сможете, по крайней мере визуально, превратить свой традиционный сайт в современный одностраничный. WP Floating Menu Pro обеспечит плавную прокрутку от одной части страницы к другой.

В распоряжение разработчика WP Floating Menu Pro предлагает 13 и 7 различных вариантов расположения на странице, возможности настройки, цвета, содержимого и количества пунктов.
Для экранов разрешением менее 480px имеется возможность автоматического отключения меню.

Стоимость: $17

Flexi Menu WordPress Plugin

Flexi Menu - это 5 различных, полностью настраиваемых типа меню: fly-меню , широкое (на ширину страницы), широкое+описания, широкое+изображения и вертикальное.

Стоимость: $14

Max Mega Menu (Free)

Очень неплохой плагин с drag-and-drop редактором меню и возможностью встраивания в пункты меню практически любых виджетов - от контактных форм до карт Google .

Способен автоматически преобразовывать уже существующие обычные меню в одно мега-меню с полным контролем над процессом преобразования и сохранением или переназначением соответствующих действий.

© 2024 ermake.ru -- Про ремонт ПК - Информационный портал