Основное руководство по добавлению хлебных крошек WordPress

Опубликовано: 2021-11-26
Хлебные крошки WordPress

Хотите снизить показатель отказов, улучшить навигацию по веб-сайту, улучшить SEO и предложить потрясающий пользовательский опыт? Конечно, вы делаете!

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

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

Источник: dedoles.se

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

Что такое панировочные сухари?

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

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

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

Понимание того, как работают различные хлебные крошки

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

Хлебные крошки на основе иерархии

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

Хлебные крошки на основе атрибутов

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

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

хлебные крошки на основе атрибутов

Источник изображения

Хлебные крошки на основе истории

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

Преимущества панировочных сухарей

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

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

Более простая навигация по сайту для посетителей, что означает более низкий показатель отказов.

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

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

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

Сканеры сайта легче ранжируют нужные страницы

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

Например, если вы ищете «что такое панировочные сухари?» в Google в результатах поиска перечислены URL-адрес каждого веб-сайта, хлебные крошки и заголовок.

хлебные крошки и SEO

Три метода добавления хлебных крошек на ваш сайт WordPress

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

Выберите тему WordPress, в которой уже есть хлебные крошки.

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

Внедрение хлебных крошек с помощью пользовательского кода

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

Вот что вам нужно сделать:

  1. Подключите WordPress к вашему серверу с помощью FTP-сайта, такого как FileZilla FTP .
  2. Щелкните папку public_html в клиенте FileZilla (включая файлы вашего веб-сайта). выберите папку public_html в клиенте FileZilla
  3. Щелкните папку wp-content.
  4. Щелкните каталог тем и выберите папку с текущей темой.
  5. Нажмите на папку functions.php, затем выберите просмотр/редактирование.
  6. Вставьте код ниже, чтобы зарегистрировать функцию хлебных крошек на своем сайте. Код хлебной крошки WordPress
  7. Сохраните изменения и загрузите обновленный файл при появлении запроса.

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

Третий и последний способ добавить хлебные крошки на ваш сайт WordPress — использовать плагин. Для этого вам понадобится специальный инструмент, такой как Yoast SEO, Breadcrumb NavXT или плагин WooCommerce Breadcrumbs.

Использование плагина Yoast SEO

Yoast — один из самых известных SEO-плагинов для WordPress , который можно использовать для включения хлебных крошек на вашем сайте. Если вы уже используете Yoast для SEO, то это ваш лучший выбор, хотя есть и другие доступные варианты (которые мы обсудим чуть позже).

Чтобы добавить панировочные сухари с помощью Yoast, выполните следующие действия:

  1. Установите плагин Yoast SEO с панели инструментов WordPress, т. е. плагины > добавьте новый > введите «Yoast» в строку поиска > установите.
  2. В плагине Yoast перейдите к внешнему виду.
  3. Нажмите на редактор темы.
  4. Выберите шаблон с именем header.php.
  5. Вставьте фрагмент кода ниже. Фрагмент кода хлебных крошек Yoast
  6. Сохраните изменения, нажав «Обновить файл».

Использование плагина Breadcrumb NavXT

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

  1. В плагине NavXT перейдите к настройкам.
  2. Нажмите на навигационную цепочку NavXT. Плагин хлебных крошек WordPress
  3. Выберите один из четырех вариантов навигации.
  4. Настройте плагин и сохраните изменения.
  5. Перейдите к внешнему виду.
  6. Нажмите на редактор темы.
  7. Выберите файл header.php.
  8. Вставьте код ниже. навигационный код
  9. Щелкните файл обновления.

Использование плагина Woocommerce Breadcrumbs

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

Вот что вам нужно сделать:

  1. Установите плагин Woocommerce Breadcrumbs на свой сайт WordPress.
  2. Перейдите к настройкам.
  3. Щелкните навигационные крошки WC.
  4. Установите флажок рядом, чтобы включить хлебные крошки.
  5. Нажмите сохранить изменения .

панировочные сухари woocommerce

Источник: fixrunner.com

Настройте хлебные крошки WordPress с помощью CSS

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

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

Два способа удалить хлебные крошки с вашего сайта

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

Переключите переключатель отключения

Первый способ удалить «хлебные крошки» — просто переключить переключатель в вашем плагине, чтобы отключить «хлебные крошки» или полностью деактивировать плагин.

Удалить введенный вручную код

Другой вариант — удалить введенный вручную код. Просто вернитесь в папку header.php вашего сайта и удалите строку кода, которая добавляет на ваш сайт хлебные крошки.

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

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

Более того, включить хлебные крошки на свой сайт довольно просто. В некоторые шаблоны WordPress даже включены хлебные крошки.

Если вы еще не занимаетесь панировочными сухарями, чего же вы ждете?