Как добавить меню навигации в WordPress

Как добавить меню навигации в WordPress

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

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

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

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

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

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

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

Что Вы можете добавить в меню WordPress?

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

Сколько может быть меню и пунктов меню?

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

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

Как создать первое меню WordPress

Чтобы войти в редактор меню в WordPress, перейдите к Внешний вид (Appearance) -> Меню (Menus).

Если это новая инсталляция сайта, то можно ожидать, что страница будет разделена на два сегмента. На левой стороне несколько вкладок содержат все доступные элементы, которые можно добавить в меню. Справа Вы создаете новые списки и корректируете их структуру и настройки. Прежде чем Вы сможете увидеть настройки, нужно создать новое меню:

Придумайте узнаваемое название и запишите его

Создание меню WordPress 1

 

Нажмите на кнопку «Создать меню (Create Menu)» справа

Создание меню WordPress 2

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

Добавить элементы меню

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

Откройте любую вкладку

Добавление элементов меню 1

 

Выберите страницы, записи, рубрики или добавьте произвольные ссылки

Добавление элементов меню 2

 

Нажимайте кнопку «Добавить в меню (Add to Menu)» на каждой вкладке, прежде чем переключиться на следующую

Добавление элементов меню 3

Добавление записей, страниц и рубрик — простой процесс, так как Вам нужно только выбрать их из списка. Но если Вы добавляете произвольную ссылку, должен быть полный URL-адрес страницы (например: http://www.google.com). Также добавьте текст ссылки (метку), который будет виден по этой ссылке (например: Google).

Упорядочить пункты меню (перетаскивание)

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

Упорядочить элементы меню 1

Упорядочить элементы меню 2

Упорядочить элементы меню 3

Упорядочить элементы меню 4

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

Вы также можете легко удалить элемент из меню, нажав на красную ссылку «Удалить (Delete)», расположенную в нижней части вкладки дополнительных настроек. Не волнуйтесь; это действие не удалит выбранную страницу, запись или рубрику, а удалит их только из меню, которое Вы редактируете. До удаления произвольной ссылки запомните её URL-адрес, если Вы снова захотите добавить ту же произвольную ссылку.

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

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

Создание подменю WordPress 1

Создание подменю WordPress 2

Создание подменю WordPress 3

Создание подменю WordPress 4

Если Вам просто не нравится перетаскивать элементы, WordPress позволяет управлять элементами через простые ссылки:

  1. Добавьте в меню и родительский и дочерний элементы
  2. Нажмите маленькую стрелку на пункте меню, который вы хотите сделать дочерним (с отступом)
  3. Нажмите ссылку «Под имя родительского элемента», где «имя родительского элементу» это ярлык элемента чуть выше

 

Если Вы решите удалить элемент подменю, можно немного переместить его влево. Альтернативно щелкните маленькую стрелку на элементе и выберите «Из-под имя родительского элемента», где «имя родительского элементу» это снова ярлык элемента чуть выше.

Настройки меню

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

  1. Автоматически добавлять страницы (Auto add pages) — всякий раз, когда создается новая страница верхнего уровня (главная, у которой нет родительской), она будет автоматически добавлена ​​в это меню
  2. Область отображения (Display location) — если тема позволяет использовать несколько меню, выберите его местоположение из списка

 

Настройки меню WordPress

Когда Вы довольны структурой, не забудьте нажать кнопку «Сохранить меню (Save menu)», которая может быть найдена как справа сверху, так и внизу редактора.

Настройки экрана

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

  • Блоки (Boxes) — в дополнение к стандартным элементам могут отображаться Метки и Форматы, которые затем можно добавить в меню
  • Показывать расширенные свойства меню (Advanced menu properties) — добавить Цель ссылки (Link Target), Атрибут title (Target Attribute), Классы CSS (CSS Classes), Отношение к ссылке (XFN) (Link Relationship (XFN)) и Описание (Description)

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

  1. Перейти к Внешний вид (Appearance) -> Виджеты (Widgets)
  2. Найдите виджет «Меню навигации (Custom Menu)» с левой стороны
  3. Перетащите его на правую сторону в любую область, которая может содержать виджеты (например, в боковую панель)
  4. Выберите заголовок
  5. Выберите меню, созданное ранее.
  6. Нажмите кнопку «Сохранить (Save)»

Меню в боковой панели WordPress

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

Заключение

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

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

Оставьте комментарий