Навигационная цепочка

Добавьте цепочку хлебных крошек на страницы, управляйте местом вывода и поддерживайте соответствие видимого пути и schema хлебных крошек.

Обзор

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

Вы настраиваете модуль в Airygen SEO -> Настройки -> Навигационная цепочка.

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

Способы вывода

Навигационная цепочка поддерживает как ручное размещение, так и автоматическую вставку в контент.

Ручной вывод

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

  • Используйте Функция шаблона, когда хотите выводить хлебные крошки внутри шаблона темы.
  • Используйте Шорткод, когда хотите разместить хлебные крошки внутри контента, блока шорткода или другой области, поддерживающей шорткоды.
  • Используйте Блок, когда хотите разместить хлебные крошки визуально в блочном редакторе.

Функция шаблона:

<?php if ( function_exists( 'airygen_the_breadcrumbs' ) ) { airygen_the_breadcrumbs(); } ?>

Шорткод:

[airygen_breadcrumbs]

Block:

<!-- wp:airygen/breadcrumb /-->

Автоматическая вставка

Включите Включить автоматическое встраивание навигационной цепочки, если хотите, чтобы Airygen SEO сам вставлял цепочку в основную область контента.

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

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

Настройки

Страница организована в Настройки, Макет и Предпросмотр.

Вкладка Настройки

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

Управление выводом

  • Включить ручной вывод навигационной цепочки открывает сниппеты Функция шаблона, Шорткод и Блок для вывода хлебных крошек.
  • Включить автоматическое встраивание навигационной цепочки вставляет хлебные крошки в контент записи на основе выбранного места.
  • Позиция вставки управляет тем, появится ли автоматический вывод Перед контентом или После контента.

Иерархия

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

  • Показать ссылку главной начинает цепочку с метки и URL главной страницы.
  • Показать ссылку блога в архивах вставляет страницу записей перед архивными элементами, если на сайте используется отдельная страница записей.
  • Показать родительские страницы добавляет родительские страницы для иерархических типов контента, таких как страницы и иерархические пользовательские типы записей.
  • Скрыть родителей таксономии убирает родительские термины из цепочек категорий и таксономий, когда вам нужен более короткий путь.
  • Показать текущую страницу включает текущую страницу как последний элемент хлебных крошек и также влияет на список JSON-LD.
  • Показать пагинацию добавляет текущий номер страницы на постраничных архивах.
  • Разделитель задает символ между элементами цепочки.
  • Префикс добавляет текст перед цепочкой, например короткую метку в стиле «Вы здесь».

Метки

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

  • Метка главной меняет текст для элемента главной страницы.
  • Метка архива меняет метку, используемую в видах архивов.
  • Метка результатов поиска меняет метку, показываемую на страницах результатов поиска.
  • 404 label меняет текст, показываемый на страницах not found.

Вкладка Макет

Используйте эту вкладку, чтобы настроить внешний вид контейнера и текста хлебных крошек.

Стиль контейнера

  • Ширина рамки меняет толщину границы контейнера хлебных крошек.
  • Цвет рамки меняет цвет границы.
  • Внутренний отступ меняет внутренние отступы вокруг цепочки.
  • Цвет фона контейнера меняет фон за хлебными крошками.

Стиль цепочки

  • Размер шрифта меняет размер текста хлебных крошек.
  • Цвет текста меняет цвет текста без ссылок.
  • Цвет ссылки меняет цвет ссылок в цепочке.
  • Подчеркивать ссылки включает или отключает подчеркивание ссылок.

Как использовать

  1. Откройте Airygen SEO -> Настройки -> Навигационная цепочка.
  2. На вкладке Настройки решите, хотите ли вы использовать Включить ручной вывод навигационной цепочки, Включить автоматическое встраивание навигационной цепочки или только один основной способ.
  3. Если нужен вывод на уровне темы, включите Включить ручной вывод навигационной цепочки и вставьте сниппет Функция шаблона в область шаблона, где должна появляться цепочка.
  4. Если нужен вывод на уровне редактора, оставьте Включить ручной вывод навигационной цепочки включенным и вставьте в область контента либо Шорткод, либо Блок.
  5. Если нужен автоматический вывод, включите Включить автоматическое встраивание навигационной цепочки и выберите Позиция вставки, который лучше всего подходит макету вашего контента.
  6. В Иерархия решите, должна ли цепочка показывать ссылку на главную, ссылку на блог в архивах, родительские страницы, текущую страницу и пагинацию.
  7. Задайте читаемый Разделитель и при необходимости Префикс, чтобы цепочка соответствовала тону сайта.
  8. В Метки настройте формулировки для главной, архива, поиска и страниц 404.
  9. Откройте Макет и настройте границы контейнера, отступы, цвета и стиль текста так, чтобы цепочка подходила вашей теме.
  10. Откройте Предпросмотр, переключайтесь между Ноутбук, Планшет и Мобильный телефон и проверьте пример цепочки перед сохранением.
  11. Сохраните настройки и протестируйте живой фронтенд на записи, архивной странице, странице поиска и странице 404.

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

  • Цепочка хлебных крошек появляется в каждом месте только один раз.
  • Видимая цепочка соответствует той иерархии страниц, по которой вы хотите вести пользователей.
  • Текущая страница появляется в цепочке только тогда, когда включен Показать текущую страницу.
  • Живой стиль по-прежнему выглядит правильно после загрузки CSS вашей темы.

Предпросмотр и реальный вывод

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

  • Предпросмотр включает переключатель устройств Ноутбук, Планшет и Мобильный телефон.
  • Предпросмотр отражает текущие настройки границ, отступов, цветов и текста.
  • Экран также показывает примеры HTML и CSS, чтобы вы могли проверить пример структуры.

Живой сайт все равно может выглядеть иначе, чем предпросмотр.

  • Реальная цепочка хлебных крошек зависит от фактического типа страницы, структуры родителей, пути таксономии и контекста поиска или 404.
  • На итоговый внешний вид все еще могут влиять активная тема, ваш CSS и окружающий layout страницы.
  • Если использовать ручное размещение и автоматическую вставку одновременно, на живой странице могут появиться дублирующиеся цепочки, даже если предпросмотр выглядит чисто.

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

Преимущества SEO

Хлебные крошки упрощают понимание иерархии страниц для поисковых систем и помогают посетителям переходить от глубокого контента к более широким разделам без использования кнопки «Назад» в браузере.

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

Сценарии использования

Контентные сайты со сложной тематической структурой

До: У издателя есть категории, подкатегории и длинные серии статей, но у читателей нет понятного пути назад к более общим тематическим страницам.

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

WooCommerce или каталожные сайты с глубокими подборками

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

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

Агентства, стандартизирующие структуру сайта на клиентских проектах

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

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

Часто задаваемые вопросы

Что лучше использовать: ручной вывод или автоматическую вставку?

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

Что делать, если хлебные крошки показываются дважды?

Проверьте, включен ли Включить автоматическое встраивание навигационной цепочки и не добавили ли вы на ту же страницу Шорткод, Блок или Функция шаблона. Оставьте только тот способ вывода, который действительно нужен в этом месте.

Почему предпросмотр не совпадает с живой страницей полностью?

Предпросмотр — это упрощенное представление ваших настроек стиля. Реальный вывод все равно зависит от фактической иерархии страницы, текущего запроса и CSS вашей темы.