Лучшие бесплатные плагины меню для WordPress
Описание лучших бесплатных плагинов для меню в WordPress, которые позволят вам легко создавать на вашем сайте горизонтальные и вертикальные выпадающие меню.Max Mega Menu
Max Mega Menu — автоматически преобразует ваше существующее меню или меню в мегаменю. Затем вы можете добавить любой виджет WordPress в свое меню, изменить стиль своего меню с помощью редактора тем и изменить поведение меню с помощью встроенных настроек. Max Mega Menu — это полноценный плагин для управления меню, идеально подходящий для управления существующим меню и превращения его в удобное для пользователя, доступное и готовое к касанию меню с помощью всего нескольких щелчков мыши.
Особенности Max Mega Menu:
- Основывается на стандартной системе меню WordPress
- Поддерживает несколько мест меню, каждое со своей конфигурацией
- Конструктор путем перетаскивания элементов
- Показывает виджеты WordPress в меню
- Настраиваются стили меню с помощью встроенного редактора тем
- Переходы подменю Fade, Fade Up, Slide Up или Slide
- Добавление иконок к пунктам меню
- Опции пунктов меню, включая «Скрыть текст», «Отключить ссылку», «Скрыть на мобильном» и т. д.
- Выравнивание пунктов меню
У вас нет разрешения на просмотр содержимого!
Admin Menus Fixed
Это один из наиболее известных бесплатных плагинов меню для WordPress, который позволяет добавлять разнообразные меню. Вам не нужна дополнительная прокрутка.
Особенности Admin Menus Fixed:
- Работает с WordPress 3.5+
- Имеет три варианта Admin Menus Fixed
- Включает в себя панель инструментов WordPress
- Автоматически встраивается в WordPress
- Показывает элемент окна администратора
У вас нет разрешения на просмотр содержимого!
Dropdown Menu Widget
Этот бесплатный плагин для меню в WordPress позволяет создавать пользовательские выпадающие навигационные меню, имеет множество тем CSS, которые являются частью основных характеристик плагина.
Особенности Dropdown Menu Widget:
- Выпадающее меню только для CSS
- Страницы листинга
- Вертикальное или горизонтальное расположение
- Выбор тем для виджета
У вас нет разрешения на просмотр содержимого!
The official plugin for OpenMenu
Создавайте выпадающее меню с помощью плагина The official plugin for OpenMenu, получайте удовольствие от его работы.
Особенности OpenMenu:
- Тип пользовательских записей для OpenMenu
- Пользовательские функции
- Настройки ширины сайта
- Управление просмотром меню
У вас нет разрешения на просмотр содержимого!
Admin Menu Tree Page View
Название этого бесплатного плагина меню для WordPress говорит о его работе, вы можете легко редактировать и просматривать порядок, установленный для выпадающего меню.
Особенности Admin Menu Tree Page View:
- Возможность изменить порядок
- Обзор всех страниц
- Иерархическая древовидная структура
- Совместимость с WPML
У вас нет разрешения на просмотр содержимого!
JQuery Accordion Menu Widget
Используйте более продвинутые виджеты и шорткоды для создания красивого выпадающего меню с помощью этого бесплатного плагина для меню.
Особенности JQuery Accordion Menu Widget:
- Клик/Наведение
- Автоматическое расширение в зависимости от текущей страницы/пункта
- Отключение родительских ссылок
- Различные меню
- Задержка при наведении
У вас нет разрешения на просмотр содержимого!
Admin Menu Tree Page View
Удобные меню поиска и редактирования, создание иерархического выпадающего меню и упорядочивание всех меню так, как вам нужно.
Особенности Admin Menu Tree Page View:
- Изменение порядка страниц
- Просмотр всех страниц
- Совместимость с WPML
У вас нет разрешения на просмотр содержимого!
Responsive Select Menu
Автоматически встраивается в WordPress 3.0 и выше, меню в окне выбора лучшее для мобильных устройств. Этот бесплатный плагин для меню в WordPress весьма интересен в использовании.
Особенности Responsive Select Menu:
- Устойчивая работа на мобильных устройствах
- Более лёгкая навигация для устройств с сенсорным экраном
- Не нуждается в дополнительном PHP-коде
У вас нет разрешения на просмотр содержимого!
JQuery Mega Menu Widget
Создавайте различные выпадающие меню с использованием меню пользователя в WordPress, просто используя jQuery.
Особенности JQuery Mega Menu:
- Наведение/Клик
- Нумерация элементов в строке
- Несколько обложек
- Эффект анимации
- Скорость анимации
- Набор подменю
У вас нет разрешения на просмотр содержимого!
WP-Easy Menu
Автоматическая генерация классификации для меню, пользовательских записей и добавление пользовательских ссылок на ваш сайт.
Особенности WP-Easy Menu:
- Страницы или пользовательские ссылки
- Создание встроенного меню
- Автоматическая работа меню
У вас нет разрешения на просмотр содержимого!
jQuery Dropdown Menu
Создавайте горизонтальное и вертикальное выпадающего меню с помощью этого известного плагина для меню в WordPress
Особенности jQuery Dropdown Menu:
- Цвет заднего фона в главном меню
- Скруглённые границы (или нет)
- Разделение кнопок
- Указатель мыши поверх цвета заднего фона
- Задаётся размер и цвет шрифта в меню
У вас нет разрешения на просмотр содержимого!
Ozh’ Admin Drop Down Menu
Создавайте прекрасное горизонтальное выпадающее меню с помощью плагина Ozh’ Admin Drop Down.
Особенности Ozh’ Admin Drop Down Menu:
- Выпадающее меню для CSS
- Интерфейс API для программистов
- Не поддерживаются инсталляции WordPress
У вас нет разрешения на просмотр содержимого!
JQuery Vertical Mega Menu Widget
Этот плагин для WordPress позволит вам при создании виджета добавлять вертикальное меню в ваши колонки, просто используйте меню пользователя в WordPress с помощью данного плагина.
Особенности JQuery Vertical Mega Menu Widget:
- Нумерация элементов в строке
- Эффект анимации
- Управление анимацией
- Скорость анимации
- 8 различных обложек
У вас нет разрешения на просмотр содержимого!
WP Responsive Menu
WP Responsive Menu — это простой плагин, который позволяет в кратчайшие сроки добавить настраиваемое адаптивное меню на любой сайт WordPress, а настройку можно выполнить прямо со страницы настроек, без необходимости кодирования.
Особенности WP Responsive Menu:
- Получите красивое слайд-меню менее чем за минуту.
- Заставляет ваше меню работать лучше на мобильных устройствах.
- Легко настроить без каких-либо навыков кодирования.
- Позволяет установить направление открытия меню сверху/снизу/влево/вправо в соответствии с вашими потребностями.
- Возможность изменить анимацию значка меню в соответствии с вашим сайтом.
- Добавьте свой логотип в строку меню и легко укажите ссылку на него.
- Поставляется в двух разных вариантах отображения на ваш вкус.
- Быстро скрыть ненужные элементы, когда активно адаптивное меню.
- Предоставляет лучшую возможность открывать / закрывать меню с помощью простых жестов.
- Легко настроить размеры шрифта и стили из настроек.
- Дает вам гибкость, чтобы добавить окно поиска внутрь меню.
У вас нет разрешения на просмотр содержимого!
Custom Taxonomies Menu Widget
Очень простое классификационное меню может быть создано с помощью Custom Taxonomies Menu Widget, также вы можете использовать панель управления виджета для дополнительных опций.
Особенности Custom Taxonomies Menu Widget:
- Выбор классификации пользователя для отображения
- Изменение порядка отображения в пользовательских классификациях
- Возможность выбора, следует ли отображать классификацию
- Возможность выбора, следует ли отображать список терминов в виде иерархии
Получилась такая подборка лучших плагинов меню для WordPress. Если вы знаете ещё какие-то интересные плагины, то напишите о них в комментариях они будут добавлены обзор.
1. Адаптивное меню
Если на вашем сайте еще нет адаптивного меню, то плагин Responsive Menu – хороший выбор для каждого уважающего себя владельца сайта. Расширение предоставляет возможность использовать множество настроек и имеет платную и бесплатную версии. Бесплатный вариант Responsive Menu позволяет изменить немало: цвет, шрифт, кегль, фоновые изображения, реализована возможность деактивировать элементы меню или поменять их порядок, поменять расположение меню на странице (слева, справа, сверху или снизу) и т.д.
2. Max Mega Menu
Удобство навигации и использования на сайтах, где меню состоит из десятков или сотен категорий и элементов, можно улучшить с помощью мега-меню. Мега-меню позволяют разместить все необходимые элементы и при этом не усложнять пользовательский интерфейс. Один из лучших плагинов для создания мега-меню — Max Mega Menu. Созданные с помощью него меню адаптивные, могут использоваться на устройствах с сенсорными и retina экранами.
В расширении Max Mega Menu используется drag-and-drop. Можно одновременно открывать несколько экземпляров плагина и наладить достаточно много визуальных эффектов в меню, например, которые появляются при наведении мыши. Можно сделать так, чтобы при наведении или нажатии мышью появлялись подменю, чтобы изображение плавно появлялось и исчезало, чтобы при навигации выдвигалось подменю сверху или сбоку, добавить иконки. Все это доступно в бесплатной версии, а в платной – еще больше.
3. All in Menu
All in Menu – еще одно расширение на WordPress для создания адаптивных и динамических заголовков мега-меню. В этом плагине тоже используется drag-and-drop, но этот плагин не пользуется такой же популярностью как Max Mega Menu и в нем нет таких же возможностей для индивидуальной конфигурации. Но это не значит, что его не стоит попробовать. Можно настроить расположение элементов меню, их цвет и ширину.
4. WP Mobile Menu
Если на вашем сайте значительный трафик с мобильных устройств, вас не совсем устраивает, как на нем работают адаптивные элементы и вы хотели бы разработать что-то специально под мобильные устройства, то есть смысл попробовать WP Mobile Menu. С помощью этого адаптивного плагина можно изменить существующие настройки меню. Дизайн и функционал можно настроить в соответствии с индивидуальными требованиями. Можно даже добавлять виджеты.
5. If Menu
If Menu – простой, но очень полезный плагин. С его помощью можно настроить параметры, с учетом которых элементы меню отображаются и скрываются. К таким параметрам относятся состояние пользователя (в системе или нет), роль пользователя (администратор и т.д.), тип страницы (домашняя страница и т.д.) и тип устройства (например, мобильный телефон). Продвинутые пользователи могут сами настроить параметры.
6. Menu Buttons
7. Menus
Помимо меню для пользователей существуют и меню для администраторов. В них вам тоже может захотеть внести изменения. Menus – один из меню для администраторов, которым можно воспользоваться сразу при работе с несколькими сайтами. Расширение позволяет переключаться между меню сайтов в вашей сети и даже удалять некоторые элементы из полосы меню администратора. Это отличный способ навести порядок в интерфейсе администратора и скрыть меню, которыми вы не пользуетесь.
8. Admin Menu Editor
Admin Menu Editor – еще один плагин для внесения изменений в главную страницу администратора. С помощью drag-and-drop можно изменить порядок меню, создать собственное меню, скрыть или отобразить элементы меню, изменить права доступа и т.д. Существует как платная, так и бесплатная версия. В платной версии доступны следующие продвинутые инструменты: настройка прав доступа для разных ролей, скрытие меню от всех за исключением конкретного пользователя, экспорт меню администратора.
Удобное меню – залог удобной навигации. Пока ваш сайт небольшой и он состоит из нескольких страниц, структурирование меню может не требоваться, но по мере развития вашего сайта, меню пользователей и администратора постепенно будут становиться слишком громоздкими и неудобными. Этого можно избежать, воспользовавшись расширениями в этой статье и облегчив жизнь себе и своим пользователям при навигации на сайте.
Если вы ищете виртуальный хостинг или виртуальный сервер для вашего сайта на WordPress, то помочь в этом может HOSTING.cafe.

Толчком к развитию концепции мега-меню послужил, вероятно, ленточный интерфейс 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 различных вариантов расположения на странице, возможности настройки, цвета, содержимого и количества пунктов.
Стоимость: $17
Mega Menu by WooRockets.com (Free)
WR Mega Menu — это мощное, адаптивное мега-меню со встроенным, интуитивно понятным редактором, позволяющим в итоге получить именно то, что вы задумывали.Flexi Menu WordPress Plugin
Flexi Menu — это 5 различных, полностью настраиваемых типа меню: fly-меню, широкое (на ширину страницы), широкое+описания, широкое+изображения и вертикальное.Стоимость: $14
Max Mega Menu (Free)
Очень неплохой плагин с drag-and-drop редактором меню и возможностью встраивания в пункты меню практически любых виджетов — от контактных форм до карт Google.Способен автоматически преобразовывать уже существующие обычные меню в одно мега-меню с полным контролем над процессом преобразования и сохранением или переназначением соответствующих действий.
Side – WordPress Responsive Menu
Этот плагин, несомненно, понравится приверженцам минимализма. Меню открывается на весь экран по нажатию пиктограммы Menu и прячется после выбора нужного пункта. Все предельно просто. Дизайн простой и ясный, никаких посторонних элементов.Стоимость: $12
Очень симатичное и оригинальное меню для WordPress. При нажатии на основную кнопку которая, кстати, может располагаться в любом месте страницы, «выскакивают» значки и располагаются вокруг нее. У вас есть полный контроль над месторасположением этих кнопок: в линию горизонтально или вертикально, по окружности вокруг или вдоль более сложной линии, такой как кривая Безье. Иконки внутри объектов можно легко изменять простой заменой файлов-иконок в медиа-галерее.
Стоимость: $18
Morph
Разработанный изначально для мобильных устройств этот плагин отлично показал себя и на десктопных экранах. Он имеет встроенный редактор, позволяющий создавать обычные и многоуровневые меню, устанавливать фон отдельно для каждого пункта или меню в целом и управлять другими аттрибутами и внешним видом меню.Стоимость: $18
Tactile
Как становится понятным из названия это меню заточено именно под мобильные устройства. Дизайн выполнен в стиле Google’s Material Design, присутствуют различные анимационные эффекты. В целом меню производит приятное впечатление как внешним видом, так и богатыми возможностями настройки различных параметров.Стоимость: $13
Привет, друзья! Счастлив видеть вас на страницах моего блога. Эту статью целиком и полностью посвящаю меню WordPress. Постараюсь осветить эту тему со всех сторон: рассмотрю наиболее интересные плагины для меню WordPress, посвящу несколько строк созданию верхнего меню, расскажу о стандартных возможностях WP. Чтобы материал, описанный в этой статье, был понятен, обязательно перед его прочтением ознакомьтесь с постом о виджетах WordPress.
Стандартные способы создания и вывода меню в WordPress:
- Если тема поддерживает WordPress 3 Menu System, то верхнее menu можно создать через раздел «Внешний вид» — «Меню», в противном случае оно формируется автоматически из публикуемых страниц.
- Создать меню, содержащее активные рубрики блога, можно с помощью виджета «Рубрики».
- Меню с ссылками на страницы блога выводится с помощью виджета «Страницы». Лично я никогда этим виджетом не пользовался, потому что на блоге страницы WP используются для вывода технической информации (о себе, карта сайта, обратная связь и так далее). Лучшее место для них — в шапке блога в горизонтальном виде. Так уж принято.
- Произвольное меню создается в разделе «Внешний вид» — «Меню», для вывода на блог используется одноименный виджет.
- Использовать дополнительными плагины WordPress.
Если 2 и 3 пункты очевидны, и достаточно только добавить соответствующие виджеты, то остальные могут показаться запутанными, поэтому я рассмотрю их поподробнее.
Стандартные возможности WordPress
Перейдите в раздел «Внешний вид» — «Меню», нажмите на кнопку «+» и введите заголовок.
Теперь необходимо добавить в него пункты:
Произвольные ссылки — добавьте ссылку на страницу блога или внешний ресурс и введите текст, под которым она будет выводится. Таким способом можно добавить ссылку на какую-то отдельную запись блога.
Страницы — выберете нужные страницы и нажмите «Добавить в меню».
Рубрики — отметьте галочками нужные рубрики и тоже нажмите «Добавить в меню».
Есть возможность создать иерархию, просто перетаскивая их друг относительно друга. Как эта иерархия будет отображаться на блоге — зависит от используемой темы.
Не забывайте сохранять внесенные изменения.
В темах, которые поддерживают WordPress 3 Menu System присутствует так же опция «Области темы» — это место в шаблоне WordPress, которое специально отведено под меню. Чаще всего оно предназначено для вывода верхнего горизонтального меню блога, которое часто называют «главным». В таком случае достаточно задать «Область темы», и оно автоматически появится на сайте.
В противном случае, используется виджет «Произвольное меню». Перейдите в раздел «Внешний вид» — «Виджеты», найдите в общем списке данный виджет и перетащите его в сайтбар (боковая колонка). После этого появятся настройки, в которых нужно выбрать созданное ранее меню.
Сохраните настройки и полюбуйтесь на свое творение.
Верхнее меню WordPress — как отредактировать и удалить
Во многих темах верхнее menu формируется автоматически из публикуемых страниц, которые в основном используются для общей информации — «О блоге», «Полезная информация», «Карта сайта» и так далее. Для этого в файле header.php используется следующий код:
<ul> <?php wp_list_pages('title_li=' ); ?> </ul> |
В моей теме оно дублируется еще внизу страницы, поэтому этот же код был и в шаблоне footer.php.
Чем это неудобно:
- Формируется динамически из всех созданных и опубликованных страниц, хотите вы того или нет. Порой некоторые страницы нужно оставить незамеченными.
- В некоторых темах под верхнее меню выделяется очень мало места, поэтому в нем отображаются только первые 3-4 пункта, а остальные скрываются под соседним слоем (будь то область контента или логотип). Смотрится это очень некрасиво, да и поисковые системы могут это счесть за преднамеренное сокрытие ссылок от посетителей.
Исправить эти недочеты достаточно легко — нужно просто удалить тот код, что я привел выше и написать следующую конструкцию:
<ul> <li><a href="http://имя_блога.ru">Главная</a></li> <li><a href="http://fairheart.ru/o-bloge.html">О блоге</a></li> ... </ul> |
Для людей, которые знают html, разобраться в этом коде не составит труда, для незнающих поясню. Строчки будут отличатся только двумя параметрами:
- значением атрибута href — содержит ссылку на нужную страницу;
- значением между тегами <a></a> — задает текст ссылки.
Плагины меню для WordPress
Для расширения возможностей WordPress можно воспользоваться дополнительными плагинами. В большинстве своем, создаваемые таким образом меню хоть и красивые, но громоздкие, что может вызвать некоторые сложности с продвижением блога в поисковых системах. Использовать их или нет — решать вам.
Вот перечень плагинов меню для WordPress с лучшими рейтингами:
- Floating Menu — простой плагин, с помощью которого легко добавить симпатичное меню с использованием JQuery (библиотека JavaScript, которая используется для создания различного рода визуальных эффектов).
- JQuery Slick Menu Widget — весьма интересное меню, которое можно закрепить в одном из шести местах по периметру экрана. Отлично подойдет для вывода такой информации как подписка на RSS ленту, форма регистрация, социальные кнопки, поиск по сайту и так далее.
- JQuery Vertical Mega Menu Widget — плагин позволяет создать красивое вертикальное меню с использованием JQuery эффектов. После установки плагина добавляется новый виджет, в настройках которого можно выбрать внешний вид и эффекты. Само меню формируется стандартным образом — как я описывал выше.
- JQuery Mega Menu Widget — плагин во многом аналогичен предыдущему, только создает горизонтальное меню, поэтому используйте его не в боковых сайтбарах/колонках, а в горизонтальных.
- JQuery Accordion Menu Widget — продолжает серию плагинов с использованием JQuery. Создает красивый «аккордеон». Кто не знает, что такое «аккордеон», советую попробовать и увидеть своими глазами.
Спасибо за внимание! Подписывайтесь на мою RSS ленту новостей. Всех вам благ!
Лучший способ выразить благодарность автору — поделиться с друзьями!
Узнавайте о появлении нового материала первым! Подпишитесь на обновления по email:
Следите за обновлениями в Twitter и RSS.
Давайте рассмотрим решение одной тривиальной задачи с wordpress меню которая время от времени встречается разработчикам. Бывает, что на сайтах нужно выводить сразу два меню, которые при этом между собой взаимосвязаны: одно верхнее горизонтальное 1-го уровня, а второе в сайдбаре 2-го уровня. Причем в боковом отображаются только те подпункты, для которых выбран соответствующий родительский элемент в главном меню. Например, если у вас в шапке сайта есть перечень стран, то выбрав, допустим, Италию, в сайдбаре получите только лишь список итальянских городов.
Теоретически, реализовать такую фишку можно с помощью функции wp_nav_menu и какого-то хитрого PHP кода, но я предлагаю воспользоваться готовым решением — виджетом меню для wordpress под названием Advanced Sidebar Menu. Это максимально просто и не нужно делать никакие правки шаблона.
Скачать плагин можно отсюда или установить через админку. Основная функция — создание и вывод динамического бокового меню с учетом связи «родитель / наследник» для страниц и категорий сайта.
Никаких дополнительных настроек после установки делать не нужно, в разделе «Внешний вид» — «Виджеты» просто появится 2 новых элемента: Advanced Sidebar Pages Menu и Advanced Sidebar Categories Menu. Настройки данных виджетов меню для wordpress плюс-минус похожие:
Здесь:
- Title — заголовок виджета.
- Include Parent Page — добавлять ли родительский элемент в меню.
- Include Parent Even With No Children — включать ли страницы без подстраниц.
- Order By — варианты сортировки (порядковый номер, заголовок, дата).
- Use this Plugin’s Styling — использование стилей оформления от плагина.
- Pages to Exclude (ids) — исключаемые страницы.
- Always Display Child Pages — всегда выводить подстраницы.
- Levels to Display — количество уровней меню для отображения.
Как видите на скриншоте выше, для категорий все, в принципе, аналогично, но без сортировки и уровней. Плюс добавляется опция отображения элемента на странице с полным текстом записи (Display Categories on Single Posts).
Итого, в большинстве случаев вам просто нужно добавить виджет меню для wordpress в сайдбар и он сразу начнет работать. Конечно, при этом на сайте должна существовать соответствующая иерархия с подстраницами. Если честно, не совсем понятно как настроить зависимое меню для сложных проектов с родительской страницей, начиная со 2-го уровня. В описании модуля сказано, что нужно назначить родительскую страницу/категорию, но в настройках ничего похожего я не увидел. С другой стороны подобные ситуации встречаются крайне редко, как правило, зачастую у вас всего 2 меню (боковое и главное), поэтому виджет Advanced Sidebar Menu полностью подходит.
Напоследок следует заметить, что есть в модуле Pro версия с более широкими настройками (опции оформления, стиль аккордеона для меню и т.п.). Разработчикам советую заглянуть на страницу Developer Docs где собрана информация о специальных фильтрах/функциях для более сложных вариантов использования плагина.
Если у вас остались какие-то вопросы по боковому меню в wordpress или знаете другие подходящие виджет меню для решения этой задачи, пишите в комментариях.
Понравился пост? Подпишись на обновления блога по RSS, Email или twitter!Здравствуйте, сегодня расскажу о плагинах, позволяющих достаточно легко создать вертикальное меню на сайте.
Скачать исходники для статьи можно ниже
1. JQuery Accordion Menu Widget
Данные о плагине на основе сайта wordpress.org:
Последнее обновление: 2012-5-14
Загрузок: 124,401
Демо пример можно посмотреть на сайте:
http://www.designchemical.com/lab/demo-wordpress-vertical-accordion-menu-plugin/#
Описание плагина:
Создает вертикальное меню (аккордион) из любого WordPress пользовательское меню с помощью jQuery.
Меню можно добавить либо с помощью виджетов, либо используя шорткод.
После установки плагина появляется виджет, который можно вставить в боковую колонку.
Или же можно воспользоваться следующим шорткодом: [dcwp-jquery-accordion menu=”Test Menu”]
, где вместо Test Menu указываем название меню.
2. JQuery Vertical Mega Menu Widget
Данные о плагине на основе сайта wordpress.org:
Последнее обновление: 2012-6-30
Загрузок: 71,375
Демо пример можно посмотреть на сайте:
http://www.designchemical.com/lab/demo-wordpress-jquery-vertical-mega-menu-plugin.html#
Описание плагина:
Создает виджет, который позволяет добавить вертикально всплывающее мега меню из любого стандартного WordPress пользовательского меню с помощью jQuery.
Может работать с несколькими вертикальными мега меню на каждой странице и предлагает 3 эффектов анимации.
3. JQuery Drill Down Ipod Menu Widget
Данные о плагине на основе сайта wordpress.org:
Последнее обновление: 2011-5-15
Загрузок: 20,265
Демо пример можно посмотреть на сайте:
http://www.designchemical.com/lab/demo-wordpress-jquery-drill-down-ipod-menu-plugin/
Описание плагина:
Добавляет виджет, который позволяет создавать разворачивающееся меню в стиле ipod из любого пользовательского меню wordpress с использованием JQuery.
4. Collapsing Categories
Данные о плагине на основе сайта wordpress.org:
Последнее обновление: 2012-6-20
Загрузок: 104,823
Как работает плагин можете посмотреть у меня на сайте в боковой колонке справа.
Описание плагина:
Плагин Collapsing Categories создает вертикальное меню с древовидной структурой рубрик, при этом рубрики и подрубрики будут раскрываться.
Об установке и настройке данного плагина можете прочитать в моей статье: Вертикальное меню с раскрывающимися рубриками, плагин Collapsing Categories
Описание
Iks Menu - это плагин WordPress, который предоставляет мощную настраиваемую систему и имеет множество настроек для создания аккордеонных меню WordPress.
Все превью | Меню боковой панели WooCommerce | Удобная документация со скриншотами
Iks Menu - лучший выбор для бокового меню. Этот плагин позволяет выбирать пользовательские меню WordPress или любую таксономию (категории, теги записей, категории продуктов WooCommerce и т. Д.).) в качестве источника для аккордеонных меню.
Он также обеспечивает поддержку изображений как для пользовательских меню, так и для таксономий (также поддерживает изображения категорий WooCommerce).
Вы можете показать свое меню, используя виджеты WordPress, шорткод или код PHP.
И вам не нужно изучать кодирование, чтобы использовать Iks Menu! Просто установите все настройки с помощью специально разработанного супер-быстрого живого редактора с мгновенными изменениями и без перезагрузки страниц! Это ускорит ваш процесс разработки.
Iks Menu имеет более 15 стартовых скинов (6 БЕСПЛАТНО) - поэтому он очень прост в использовании для новичков и очень настраиваем для опытных пользователей.
Планы
Iks Menu имеет 2 плана: БЕСПЛАТНО и ПРО (Цены и характеристики).
БЕСПЛАТНАЯ версия Особенности
Поддерживает таксономии (категории, теги, продукты WooCommerce, любые другие)
Поддерживает пользовательские меню WordPress (созданные в «Внешний вид»> «Меню»)
Поддерживает изображения для всех таксономий и для пользовательских меню WordPress
Поддерживает отображение сообщений для источника таксономии
Быстрый и удобный редактор меню с мгновенным просмотром!
Настройка внешнего вида для любой части меню (цвета, шрифты, поля, отступы, высоты и ширины без какой-либо кодировки)
Настройка внешнего вида для нескольких состояний (например, Hover, Current и Children)
Поддерживает экспорт и импорт настроек для повторного использования (все настройки или только для внешнего вида)
Предоставляет различные уникальные настройки для вашего меню
Обеспечивает 6 бесплатных скинов из коробки: начните использовать скины с чистым дизайном прямо сейчас одним щелчком мыши.
... Просто посмотрите на скриншоты, чтобы увидеть все функции!
Особенности PRO
- Все функции БЕСПЛАТНОГО плана
- Настройки «Начальное расширение» для расширения некоторых элементов при загрузке страницы
- Развернуть и свернуть анимации для подменю
- Возможность отображения количества сообщений
- Настройка «Пользовательские стили»
- Настройка использования родителей в качестве переключателей подменю
- Toggle: 50+ иконок и 5+ анимаций для расширения
- 20+ скинов
- … Посмотрите на цены
Настройки
С помощью меню таксономии вы можете настроить следующие параметры:
- Скрыть пустые термины - Скрыть ли термины, не назначенные ни одному сообщению.
- Сортировать по - Поле для заказа по условиям.
- Заказ - заказывать ли условия в порядке возрастания или убывания.
- Иерархический - включать ли термины с непустыми потомками (даже если для параметра hide_empty установлено значение true)
- Включить термины - запятая / разделенная пробелами строка идентификаторов терминов для включения.
- Исключить термины - запятая / разделенная пробелами строка идентификаторов терминов для исключения.
- Поиск - Критерии поиска для соответствия условиям. Будет форматироваться в SQL с подстановочными знаками до и после.
- Child of - Термин ID для получения дочерних терминов.
- Parent - идентификатор родительского термина для извлечения прямых дочерних терминов.
- бездетный - правда, чтобы ограничить результаты терминами, которые не имеют детей. Этот параметр не влияет на неиерархические таксономии.
Использование
3 варианта использования плагина. Вы увидите руководство по публикации меню внутри плагина.
- Виджет - Используйте его непосредственно в области виджетов
Шорткод- - используйте его везде с шорткодом
- Внедрение PHP-кода - используйте его где угодно в своей теме с PHP-кодом
Помощь
- Получите помощь в любое время 24/7 - Задайте свой вопрос, и мы все равно поможем
- См. Документацию для плагина - Супер подробные документы для лучшего понимания того, как работает плагин
- Вам не подходит? - Предложите новые функции для плагина, и мы предоставим его в ближайшее время
Установка
Проверьте процесс установки со скриншотами в официальной документации.
Автоматическая установка
Автоматическая установка - самый простой вариант - WordPress будет обрабатывать передачу файлов, и вам не нужно выходить из веб-браузера. Чтобы выполнить автоматическую установку Iks Menu, войдите в свою панель управления WordPress, перейдите в меню плагинов и нажмите «Добавить новый».
В поле поиска введите «Iks Menu», затем нажмите «Search Plugins». Найдя нас, вы можете просмотреть подробную информацию о нем, например, точную версию, рейтинг и описание. Самое главное, конечно, вы можете установить его с помощью! Нажмите «Установить сейчас», и WordPress возьмет его оттуда.
Ручная установка
Метод ручной установки требует загрузки плагина Iks Menu и загрузки его на ваш веб-сервер через ваше любимое приложение FTP. Кодекс WordPress содержит инструкции о том, как это сделать здесь.
Авторы и разработчики
«Iks Menu - WordPress Category Accordion Menu» - это программное обеспечение с открытым исходным кодом. Следующие люди внесли свой вклад в этот плагин.
участников История изменений
ГРАФИК
- Поиск по терминам
- Настройка области виджета (заголовок, содержимое и т. Д.))
- Атрибуты шорткода
- Загрузка меню от AJAX
- Групповые скины по тегам (например, плоские, белые, цветные и т. Д.)
- Перевести плагин на другие языки
- WP do_actions и фильтры
В ПРОЦЕССЕ
- Возможность сортировки пользовательских меню WP
- Возможность заказа контента (ссылка, изображение, переключатель и т. Д.)
- Возможность добавлять значки для пунктов меню
1,8,2 - 2028-05-20
- Исправлено: Internet Explorer совместимость
- Исправлено: Некоторые проблемы с определением предмета как текущего
1.8.1 - 2020-05-20
- Исправлено: дубликаты выбора изображений для пользовательских меню WP (WordPress 5.4+)
- Исправлено: Текущий элемент не работал на не первой странице таксономических архивов
- Добавлено: атрибут «target» для ссылок пользовательских меню WP
1,8,0 - 2020-02-28
- Добавлено: Теперь термины, включающие текущую запись, также будут помечены как «Текущая» (только для источника «Таксономия»).
- Добавлено: Новая настройка «Развернуть страницы, включая текущую страницу» внутри настроек «Начальное расширение»
- Добавлено: новая настройка «Исключить условия (без детей)»
- Добавлено: добавлен специальный класс CSS для элементов сообщений
- Исправлено: улучшения заголовков и описаний некоторых настроек
1.7,9 - 2020-02-22
- Исправлено: у некоторых пользователей были проблемы с сохранением настроек
1.7.8 - 2020-02-17
- Исправлено: Совместимость плагинов кеша (т.е. Swift Performance)
1,7 - 2020-02-11
- Исправлено: значок переключателя по умолчанию снова «Шеврон-1», а не «Пользовательский текст»
- Исправлено: настройка «Включить» не работала должным образом
- Исправлено: Непрозрачность для ввода цвета не менялась при смене через пикап
- Исправлено: пустые входные значения иногда обрабатывались как нули
- Рефакторинг кода массы (разделение ядра)
1.7.6 - 2020-01-04
- Добавлено: новая опция «Порядок меню» для настройки «Порядок по»
- Добавлено: Новая настройка «Значок - Пользовательский текст» для значка переключения
- Добавлено: Новые 4 анимации: Fade Up, Fade Right, Fade Left, Zoom Fade
1.7.5 - 2020-01-02
- Исправлено: WPML Совместимость с постами
- Исправлено: отображение флажка для последней версии WordPress
- Добавлено: Freemius SDK был обновлен до последней версии
1.7,4 - 2019-11-06
- Добавлено: кнопка для привязки четырех значений для параметров Padding, Margin и Border-radius
- Исправлено: мелкие ошибки
- Изменено: Улучшения дизайна страницы администратора
1,7 - 2019-10-21
- Исправлено: Не все значки Toggle были включены для PRO плана
1.7.2 - 2019-10-20
- Исправлено: Иногда пункты меню не были упорядочены правильно
- Исправлено: настройка «Сдвиг уровня» работала некорректно
1.7.1 - 2019-10-18
- Добавлено: Freemius SDK был обновлен до последней версии
- Исправлено: некоторые проблемы с кешированием плагинов
1,7 - 2019-10-16
- Добавлено: Возможность показа сообщений для источника таксономии
- Исправлено: мерцание ширины редактора и модальности
- Исправлено: «Текущее» расширение термина иногда не работало
- Исправлено: PHP 5.4 совместимость
- Изменено: ul и li были заменены на div, чтобы избежать плохих стилей тем
1.6.2 - 2019-10-09
- Исправлено: удалены основные поля браузера и отступы для элемента UL
- Исправлено: Иногда отображение страницы администратора было неправильным
- Исправлено: Иногда настройки «Начальное расширение» не работали
1.6.1 - 2019-09-26
- Исправлено: пользовательские стили не работали для скинов
1,6,0 - 2019-09-25
- Добавлено: Freemius
- Исправлено: иногда пункты меню не отображались как текущие
- Исправлено: Иногда предварительный просмотр был разрушен с неправильной настройкой «Начальное расширение»
1.5.1 - 2019-09-17
- Изменено: «Скрыть пустые термины» теперь по умолчанию ложно
- Исправлено: Не плавное расширение для подменю с многострочными текстами элементов
- Исправлено: Внешний вид скина № 14 без изображения
1,5,0 - 2019-09-12
- Добавлено: Возможность устанавливать изображения для всех таксономий и пользовательских меню WordPress
- Добавлено: Новая настройка «Заполнитель» для изображений
1,4,0 - 2019-09-05
- Добавлено: Возможность отображать количество сообщений для терминов
- Добавлено: Возможность задать пользовательское «имя класса» для Toogle Icon, чтобы использовать любой другой пакет значков, включенный в вашу тему
- Добавлено: Контейнеры каждого меню теперь имеют уникальные идентификаторы
- Добавлено: Новый дизайн для модального окна создания меню
- Исправлено: настройка «Начальное расширение - Отключить» работает лучше
- Исправлено: теперь некоторые настройки, такие как «Анимация», «Переход», «Тип / положение изображения» и некоторые другие, не являются «Настройки внешнего вида», и они не будут импортированы со скинами
1.3.0 - 2019-07-24
- Добавлено: Настройки «Начальное расширение» (позволяет расширять определенные термины при загрузке страницы)
- Исправлено: ошибка при разрушении меню
1,2,0 - 2019-07-18
- Добавлено: Настройка «border-radius» для всех элементов меню
- Исправлено: подменю теперь расширяются сразу после загрузки страницы
- Исправлено: Ошибки с проверкой лицензии
- Исправлено: добавлена проверка пустого заголовка виджета
- Улучшения на вкладке «Скины»
Редактор- теперь загружается немного быстрее
- Другие незначительные улучшения
1.1.0 - 2019-07-10
- Добавлено: теперь вы можете нажать CTRL + SHIFT + S или CTRL + ALT + S, чтобы сохранить текущее редактируемое меню
- Добавлено: настройка для изменения типа предварительного просмотра редактора (скрыть или показать фон подложки)
- Добавлено: Настройки «ширина» и «максимальная ширина» для контейнера
- Добавлено: входы типа «Размер» теперь могут быть установлены с процентным значением
- Добавлено: улучшенный дизайн для ввода в редакторе администратора (фокус добавлен)
- Добавлено: улучшенный дизайн вкладок редактора
- Исправлено: удален ненужный контейнер div для виджета
1.0,0 - 2019-07-04
,