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

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

Зачем настраивать и добавлять страницу в меню WordPress?

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

Когда посетители попадают на ваш сайт, они сначала видят заголовок. Например, давайте взглянем на шапку нашего сайта.

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

Как владелец бизнеса, у вас могут быть важные страницы на вашем сайте, такие как « О нас », « Свяжитесь с нами », «Политика конфиденциальности» и «Реклама» . Если это страницы, которые вы хотите выделить или которые пользователи часто посещают, вы можете добавить их в основное меню. Таким образом, эти важные страницы получат максимальную видимость, и к ним будет легко добраться.

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

1) Как добавить страницу в меню WordPress

Есть два способа добавить страницу в меню WordPress:

1. С меню WordPress
2. Из настройщика WordPress

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

1.1) С меню WordPress

На панели инструментов WordPress вы можете увидеть все созданные вами меню в разделе « Внешний вид» > «Меню» .

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

Теперь у вас есть меню. Он пуст, поэтому вы можете добавлять в него страницы для отображения некоторого контента. Чтобы проверить доступные страницы, щелкните раскрывающийся список слева.

Вы можете добавить все страницы в свое меню или выбрать определенные и добавить их вручную. В нашем случае мы добавим все наши страницы.

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

На нашем тестовом веб-сайте мы используем тему Astra WordPress с пятью пользовательскими меню.

• Основное меню
• Дополнительное меню
• Меню вне холста
• Меню входа в учетную запись
• Меню нижнего колонтитула

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

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

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

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

Таким образом, вы можете легко добавить страницу в меню WordPress без каких-либо дополнительных инструментов или плагинов.

1.2) Использование настройщика WordPress

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

Сначала на панели инструментов WordPress перейдите в раздел « Внешний вид» > «Настроить» , чтобы открыть « Настройщик ».

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

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

Теперь переходим в раздел Меню .

Затем создайте новое меню.

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

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

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

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

Если вы проверите свой веб-сайт с внешнего интерфейса, вы увидите обновленный заголовок.

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

2) Как переименовать элемент в меню

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

По умолчанию WordPress будет использовать заголовок вашей страницы в качестве имени меню. Например, название нашей демонстрационной страницы: Мы нанимаем! .

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

Несмотря на то, что это логичное решение, иногда вам может потребоваться присвоить своим меню собственное имя. Например, предположим, что вы написали подробное руководство о том, как начать вести блог, а название страницы — «Как запустить WordPress и управлять им как профессионал ».

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

Сначала перейдите в раздел « Меню » и откройте страницу, которую нужно настроить. Для этой демонстрации мы изменим We're Hire! Заголовок страницы.

Перейдите в раздел Navigation Label и измените название на Careers . Вы увидите, как изменится имя.

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

3) Как добавить категории в меню

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

• Из WordPress
• С плагинами

Давайте рассмотрим оба варианта.

3.1) Из WordPress

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

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

По умолчанию они будут добавлены прямо в меню.

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

В интерфейсе вы увидите все категории, перечисленные в разделе « Блог» .

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

Если вам нужна дополнительная информация об этом, ознакомьтесь с нашим руководством о том, как добавить категории продуктов WooCommerce в меню.

3.2) С плагинами

Еще один способ добавить страницы и категории в меню WordPress — использовать плагин. Существует несколько инструментов, но для этой демонстрации мы будем использовать QuadMenu. Это бесплатный инструмент с множеством функций для организации вашего сайта и создания мегаменю независимо от используемой вами темы. Бесплатная версия поставляется с базовыми функциями, а премиальные планы начинаются с 15 долларов США (единовременный платеж) и включают в себя более продвинутые функции.

Сначала установите QuadMenu на свой сайт. Перейдите в « Плагины» > «Добавить новый », найдите плагин и установите его.

После его активации вы будете перенаправлены на страницу настроек. В разделе « Меню » вы увидите новое место отображения под названием QuadMenu Dev. Включите его и сохраните свое меню.

После этого вы увидите некоторые дополнительные параметры в пунктах меню при наведении на них курсора.

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

На следующей странице вы увидите три основных параметра настройки.

• Дефолт
• Общий
• Значок

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

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

4) Как добавить теги, пользовательские типы сообщений и пользовательские ссылки в меню

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

4.1) Как добавить теги

Если вы используете теги для классификации контента на своем веб-сайте, вы можете добавить их в меню WordPress. Для этого перейдите в раздел « Теги » в разделе « Сообщения » на панели инструментов WordPress. Там вы увидите все теги, которые вы создали, и сможете создать новый.

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

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

Просто выберите те, которые вы хотите добавить, и нажмите « Добавить в меню ».

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

4.2) Как добавить пользовательские типы сообщений (CPT)

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

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

Затем вы увидите эти типы сообщений в своем меню. Если вы довольны заказом и организацией, нажмите « Сохранить меню » .

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

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

ПРИМЕЧАНИЕ. Если у вас нет зарегистрированных CPT, вы не увидите эту опцию. Однако, если вам нужно создать CPT для своего веб-сайта, воспользуйтесь бесплатным плагином Custom Post Type UI.

4.3) Как добавить пользовательские ссылки

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

На панели инструментов WordPress перейдите в раздел « Меню » и слева вы увидите параметр « Пользовательские ссылки ».

Открыв его, вы увидите возможность добавить свой URL-адрес и текст ссылки.

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

После сохранения изменений проверьте свой сайт в интерфейсе, и вы увидите новую ссылку на свою страницу Facebook в меню.

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

Бонус: как стилизовать определенные пункты меню

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

Сначала на панели управления WordPress перейдите в раздел « Внешний вид» > «Настроить» > «Меню » и выберите «Параметры экрана ». Там вам нужно включить свойство CSS Classes .

После этого, когда вы развернете элементы меню, вы увидите новое свойство CSS Classes .

В этом примере мы собираемся установить CSS-класс нашего меню как careers-cta и сохранить меню.

Помимо упоминания класса CSS, мы можем добавить код CSS, чтобы выделить этот конкретный пункт меню. Для этого перейдите в раздел « Настройщик WordPress» > «Дополнительные CSS » и добавьте свой код. С другой стороны, если вы используете такие темы, как Divi или Avada, есть настраиваемый раздел для включения дополнительного CSS.

Для этой демонстрации мы добавим код CSS через Customizer. Он включает предварительный просмотр в реальном времени, что упрощает процесс.

Здесь начинается самое интересное. Вставьте свой код CSS в раздел «Дополнительные CSS». Пример кода, который вы можете использовать:

 .careers-cta{
 цвет фона: розовый;
 радиус границы: 15px;
 }

После этого вы увидите изменения на экране предварительного просмотра в реальном времени.

Это всего лишь пример кода, поэтому мы рекомендуем вам поиграть с ним и адаптировать его к вашим потребностям.

Вывод

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

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

1. С меню WordPress
2. Из настройщика

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

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

Для получения дополнительной информации о том, как улучшить меню, ознакомьтесь со следующими руководствами:

• Как добавить иконки социальных сетей в меню WordPress
• Как настроить меню Divi с помощью CSS

Вы недавно меняли свое меню? Что вы изменили? Дайте нам знать в комментариях ниже.