Как сделать меню в WordPress

Меню в WordPress

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

Не знаете, что выбрать, — WordPress или Joomla?

Меню в WordPress

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

Создание меню WordPress можно осуществить несколькими способами:

  • если ваша тема поддерживает систему меню, вы можете создать верхнее меню в разделе «Внешний вид → Меню» либо оно сформируется из опубликованных вами страниц;
  • вы можете добавить рубрики в меню WordPress, используя виджет «Рубрики»;
  • с помощью виджета «Страницы» вы можете создать меню, состоящее из всех страниц вашего блога;
  • произвольное меню WordPress можно создать в разделе "Внешний вид → Меню", а для его вывода есть виджет «Произвольное меню»;
  • создание меню WordPress при помощи плагинов.

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

Создание меню WordPress стандартными способами

Первым делом вам нужно открыть упомянутый выше раздел "Внешний вид → Меню". Чтобы в WordPress добавить меню, нажмите кнопку «+» и введите в текстовое поле заголовок вашего будущего меню.

Как сделать меню в WordPress

После того, как создано меню, вы можете добавлять в него разделы.

Произвольные ссылки

Чтобы добавить в меню WordPress ссылку на какую-нибудь страницу вашего сайта или какого-нибудь другого, введите ее URL и название, под которым она будет отображаться. Сюда можно добавить, например, ссылку на какой-нибудь отдельный пост.

Как сделать меню в WordPress

Кстати, если хотите вывести неактивный пункт меню, прочитайте эту статью.

Страницы

Чтобы добавить в меню WordPress страницы вашего сайта, выберите их и нажмите кнопку «Добавить в меню».

Как сделать меню в WordPress

Категории

То же самое мы делаем и с категориями, чтобы их добавить в меню WordPress.

Как сделать меню в WordPress

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

Как сделать меню в WordPress

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

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

Как сделать меню в WordPress

Для того, чтобы вывести созданное вами меню в сайдбаре, имеется встроенный виджет меню для WordPress «Произвольное меню».  Откройте раздел "Внешний вид → Виджеты", выберите нужный виджет из списка и перетащите его в область боковой колонки. После этого откроются настройки виджета, там вы и выбираете нужное вам созданное ранее меню, которое будет отображаться на вашем сайте.

Как сделать меню в WordPress

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

Верхнее меню WordPress

Многие темы автоматически формируют верхнее меню WordPress. Обычно там располагаются страницы с общей информацией, такие как «О сайте», «Обратная связь», «Карта сайта» и другие. Для вывода этого меню в файле header.php размещается такой код:

<ul>
      <?php wp_list_pages('title_li=' ); ?>
</ul>

В некоторых темах WordPress верхнее меню отображается и в футере, то есть такой же код прописан и в файле footer.php.

Автоматическое  добавление страниц в меню очень неудобно по двум причинам:

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

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

<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;
  • jQuery Slick Menu Widget — довольно необычное меню, которое можно разместить на одном из шести предложенных мест на периметре экрана, которое подойдет для вывода подписки на RSS, регистрационной формы, соцкнопок или поиска по сайту;
  • jQuery Vertical Mega Menu Widget — с помощью этого плагина вы можете создать вертикальное красивое меню для WordPress, которое будет использовать jQuery эффекты;
  • jQuery Mega Menu Widget — плагин WordPress меню, который похож на предыдущий, но создает меню не в боковой колонке, а в горизонтальном виде;
  • jQuery Accordion Menu Widget — еще один плагин для меню WordPress, который использует jQuery и с помощью которого можно создать красивое аккордеон-меню (если вы не знаете, что это такое, — попробуйте этот плагин, вам должно понравиться).

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

 

Комментарии к записи “Как сделать меню в WordPress” (27)

  1. Спасибо автору за статью,очень всё понятно и доходчиво,осталось только практика и ещё раз практика.

  2. Очень рада, что ввела-таки запрос, который привел меня на Вашу статью. Похоже, проблему свою решу с помощью плагина jQuery Vertical Mega Menu Widget. Ваш спокойный тон вернул потерянное равновесие. Спасибо!

      • Это Вам спасибо! Даже ссылку на Ваш блог дала своему хорошему другу. Анатолий, не очень ожидала ответа, но раз диалог завязался, разрешите задать вопрос: у меня какой-то лимит на пункты меню. Дело не в плагине. И до этого меню слетало, когда использовала верхнее встроенное в шаблон. Никак нельзя устранить такой недостаток? Понимаю, что на пальцах — это не объяснение. Пересмотрела вчера вебвизор и даже расстроилась. Люди не идут на карту сайта. Зачем, если есть меню? А оно не вместило и половины страниц. После определенного количества перестает сохранить новую добавленную.

        • Спасибо ещё раз 🙂

          Возможно, есть лимит не на пункты меню, а на место для них в шаблоне (я имею в виду ширину или высоту области, предназначенную для размещения навигации). Я бы попробовал реализовать большое количество пунктов меню при помощи выпадающего или разместил бы его в верхней части сайдбара. Как вы думаете?

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

          • Вот потому и установила аккордеон в сайдбаре. А подскажете, где в шаблоне задаются параметры областей меню? Попробую увеличить вручную. У меня есть полигон, где можно попрактиковаться, с таким же шаблоном. Буду признательна очень!

              • Если бы я еще знала, как это посмотреть. 🙁 Анатолий, а если я Вам этот файл скопирую, нельзя заказать Вам отредактировать высоту? И файлов у меня 2 — style.css и rtl.css. Первый вообще из пяти строк. Простите за язык. Если Вас мой уровень нервирует, скажите прямо. Пойду к Сергею Стеклову в ножки падать. 🙂 После установки плагина посетителям еще неудобнее стало. На карту они теперь не переходят, раз каталог есть, а в каталоге и половины товаров нет.

                • Надежда, меня ничего не нервирует 😀

                  Вам лучше сразу к Сергею идти, я себе в таких вещах не особо доверяю 🙂

                  • Спасибо! Он уже проникся и, похоже, при наличии свободного времени попробует сделать что-нибудь.

  3. Спасибо. А подскажите, что делать, если меню в шаблоне не предполагает наличие ссылок, а направляет только на страницы сайта? Как всё-таки его заставить направлять на внешние ссылки?

  4. а как сделать добавление менб из адмиинки вашим способом но структура меню вот такая ul li span , по умолчанию выходит ul li и больше ничего сделать нельзя только писать код в heder.php ????? если это так то на joomla любое меню хоть такое h3 ul li span i

  5. Статья полезная, поставил себе jQuery Accordion Menu Widget, уже настроил его. Но у меня проблема, может автор подскажет или поможет удаленно как то, сайт нам делали на заказ и его пришлось переработать полностью. Единственная проблема которая была и осталась — не показывает активную кнопку страницы в меню на которой я нахожусь. Перерыл много статей и безтолку...и файл css переделывал и так далее... Ну и с самим плагином бы (jQuery Accordion Menu Widget) тоже было неплохо что бы он показывал активную кнопку в меню. ПОМОГИТЕ ПОЖАЛУЙСТА!

    • Здравствуйте, Антон. К сожалению, я, наверное, не смогу помочь вам в этом вопросе. Быть может, кто-то из комментировавших ранее эту статью поможет разобраться с этим?

  6. Здравствуйте.

    Подскажите пожалуйста, как мне сделать сайт объявлений на вордпресс. Нужно чтобы можно было настроить поддомены для регионов. (чтобы присвоить в яндексе регион). Вот нашел одну доску объявлений moskva.biglus.com с регионами, подскажите какой шаблон или плагин тут используется, нужно именно, чтобы поддомены работали как в указанном сайте. Я находил плагин для создания поддоменов, но там только для категорий, тоесть из категорий создаются поддомены, а мне так не нужно.

    • Здравствуйте. Поддомены создаются на хостинге, а настройка регионов, насколько я знаю, делается через htaccess + DNS + иметь небольшие знания в PHP. Более подробно я не смогу вам помочь в данный момент.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *