Как сделать хлебные крошки в WordPress

Июн 28, 2022 | WordPress | Нет комментариев

5
(3)

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

Плагин хлебные крошки WordPress

Хлебные крошки, как и все остальные задачи в условиях WordPress, устанавливаются с помощью плагина. Для реализации этого элемента есть много достаточно качественных плагинов. Рассмотрим один из них — Flexy Breadcrumb. Его достоинства в простоте настройки, приятном интерфейсе, совместимости со всеми актуальными продуктами WordPress, разработчики продолжают поддерживать и обновлять этот плагин. А также он совершенно бесплатный, без скрытых функций, которые доступны в премиум-версии. Всё доступно сразу после установки и активации плагина. Недостаток только в отсутствии русского языка в интерфейсе. Но его поможет нивелировать наша инструкция.

Перед тем, как сделать хлебные крошки в WordPress, установите на сайт и активируйте плагин Flexy Breadcrumb. После этого в консоли появится новый раздел, который так и называется «Flexy Breadcrumb», в нём находятся все настройки. Рассмотрим опции вкладки «General»:

  • Home Text. Текст в хлебных крошках, который будет анкором для ссылки, переводящих на главную страницу. По умолчанию написано по-английски «Home», поэтому напишите там по-русски «Главная» или «Домашняя страница».
  • Home Text URL. Это ссылка, которая переводит на главную страницу в хлебных крошках. По умолчанию здесь указанно доменное имя. Менять не надо.
  • Home Icon. Иконка около ссылки на главную страницу в хлебных крошках. По умолчанию установлена иконка в виде домика. Нажав на саму иконку, можно выбрать другую в списке. Но в данном случае домик подходит лучше всего.
  • Breadcrumb Separator. Это разделитель между элементами хлебных крошек. По умолчанию указывается символ слеша / В данном случае он традиционный и подходит лучше всего.
  • Set Title Limit In Words/Character. Указывается максимальная длина слов (words) или символов (character) у названий в хлебных крошках. Рекомендуется оставить по умолчанию и посмотреть, как будет выглядеть. Потом исправить, если понадобится.
  • Ending Character. Это символ, который появляется, если к заголовкам было принято сокращение, согласно предыдущей опции. По умолчанию здесь установлено многоточие … Оно тут хорошо подходит.
  • Post Types Hierarchy. Опция определяет иерархию, которая отображается в хлебных крошках. По умолчанию отображается иерархия по категориям. Но есть возможность выбрать по дате и по тегу. Однако вариант по умолчанию самый ожидаемый и традиционный.
General

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

Typography

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

[flexy_breadcrumb]

либо PHP-код:

 <?php echo do_shortcode( '[flexy_breadcrumb]'); ?> 

Следующий вопрос — как и куда добавить эти коды. Хлебные крошки отображаются в начале каждой записи, под её названием. Добавлять код вручную в каждую запись не правильно и не рационально, поэтому нужно добавить его так, чтобы он автоматически отображался на каждой записи в нужном месте. Если тема вашего сайта поддерживает область виджетов в начале записи, то добавьте код туда, используя виджет «Шорткод» (раздел «Внешний вид», подраздел «Виджеты»). Если нет, то используйте плагин Head, Footer and Post Injections, который позволяет добавить код в любое место сайта. Более сложный вариант — добавить в файл single.php, но это рационально только при использовании дочерней темы. В этом случае используйте PHP-код.

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

Хлебные крошки

Зачем нужны хлебные крошки

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

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

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

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 3

Оценок пока нет. Поставьте оценку первым.

Наш телефон:

+7 (499) 70-30-435

Книга в подарок

Вопросы пишите в саппорт: https://wpkurs.ru/cms/system/contact
Контакты службы работы с клиентами: +7 (499)-70-30-435
Адрес: г. Уфа, ул. Ленина, дом 28, а/я 25

© ТЦ «Интернет-Прорыв» 2012-2020 | ИП Гадельшин Адель Раисович. ОГРН: 314028000006317. ИНН: 026824242756