Мобильное меню на сайте WordPress

Опубликовано: 02.06.2017

Приветствую вас, дорогой друг!

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

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

Mobile Menu Мобильное меню Супер плагин Wordpress !

Навигация по статье:

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

При нажатии на иконку открывается вот такая панелька с пунктами меню:

Универсальное адаптивное меню для сайта

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

Создание адаптивного меню при помощи плагина

Для создания мобильного меню на сайте мы воспользуемся плагином Responsive Menu .

Устанавливаем его как обычно. Переходим в раздел «Плагины» => «Добавить новый» , вставляем название плагина, устанавливаем и, после установки активируем.

После активации, у нас в боковом меню административной панели появился пункт «Responsive Menu» . Нажав на него попадаем в раздел настроек. Все настройки плагина идут на английском языке и это немного усложняет процесс задания нужных параметров.

Вкладка «Settings»

Здесь можно при желании включить возможность вывода данного меню при помощи шорткода. Все остальные настройки на этой вкладке оставляем как есть.