Зачем и как добавлять хлебные крошки Elementor для улучшения навигации по сайту

Опубликовано: 2021-10-26

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

Хлебные крошки работают как функция навигации для вашего веб-сайта и могут оказать большое влияние на SEO вашего веб-сайта.

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

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

Если у вас есть веб-сайт на базе Elementor и вы ищете окончательное решение для добавления хлебных крошек, то вы попали по адресу.

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

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

Зачем добавлять хлебные крошки на ваш сайт Elementor

Importance of Adding Breadcrumbs To Your Elementor Website

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

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

На самом деле, большинство поисковых систем уделяют особое внимание тем типам веб-сайтов, на которых есть «хлебные крошки».

Панировочные сухари бывают трех видов

  • Хлебные крошки на основе иерархии: это показывает пользователю, где он находится на сайте. Например: Главная > Блог > Руководство по WordPress .
Hierarchy-Based Breadcrumbs
  • Хлебные крошки на основе атрибутов: в основном используются на сайтах электронной коммерции, чтобы показать, какие атрибуты выбрал пользователь. Например: Главная > Обувь > Мужчина
Attribute-Based Breadcrumbs
  • Хлебные крошки на основе истории: покажите пользователям, какие другие страницы сайта они посетили. Например: Главная > Элементор, статья 1 > Элементор , статья 2 > Текущая страница .
History-Based Breadcrumbs

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

  • Улучшить пользовательский опыт
  • Улучшить рейтинг сайта
  • Добавьте преимущества SEO
  • Уменьшить показатель отказов
  • Обеспечьте правильную навигацию.

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

2 способа добавить хлебные крошки Elementor на ваш сайт

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

1. Как использовать виджет Elementor Breadcrumbs для Yoast SEO

2. Альтернативные способы добавления хлебных крошек Elementor (для других плагинов SEO)

Как использовать виджет Elementor Breadcrumbs для Yoast SEO

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

  • Элементор (бесплатно)
  • Элементор (Про)
  • Йост SEO

Убедитесь, что вы установили и активировали версию Elementor Free & Premium .

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

Давайте начнем:

Шаг 1: Установите и настройте плагин Yoast SEO

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

Перейдите в Плагин -> Добавить новый. Затем введите Yoast SEO в строке поиска. Найдя плагин, нажмите кнопку « Установить ». Наконец, нажмите кнопку « Активно », чтобы завершить процесс активации плагина.

Add & Activate Yoast SEO Plugin

Теперь мы собираемся включить опцию хлебных крошек. Для этого вам нужно посетить SEO->Seach Appearance . Затем перейдите на вкладку « Хлебные крошки ». Здесь вы получите все необходимые параметры для настройки хлебных крошек.

Yoast Breadcrumbs Settings

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

Шаг 2: Создайте шаблон Elementor

Пришло время создать шаблон страницы для добавления хлебных крошек. Для этого вам нужно перейти в Template->Theme Builder . Затем откройте вкладку « Одна страница » и нажмите кнопку « Добавить новую отдельную страницу ».

Theme Builder Single Page Template

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

Add Single Page Template

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

Install Single Page Tempalte

Шаг 3: Добавьте Элементор Виджет хлебных крошек

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

Add Elementor Breadcrumbs Widget

Шаг 4: Настройте свой Панировочные сухари

Вы можете настроить панировочные сухари по-своему. Область «Содержимое» позволяет вам установить содержимое «хлебных крошек». Здесь вы можете определить Alignment и HTML-тег . Это теги HTML, которые вы устанавливаете в навигационную цепочку.

  • По умолчанию
  • п
  • див
  • навигация
  • охватывать
Set Elementor Breadcrumbs Content

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

Style Breadcrumbs

Если вы хотите изменить цвет при наведении, вы можете следовать изображению ниже.

Add Hover Color

Альтернативные способы добавления хлебных крошек Elementor (для других плагинов SEO)

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

Элементор Бесплатная версия

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

  • Создайте раздел, в котором вы хотите отобразить хлебные крошки
  • Добавить виджет Elementor Shortcode в раздел
  • Вставьте следующий шорткод Yoast SEO Breadcrumb
 [wpseo_breadcrumb]
Add Manual Yoast Breadcrumbs Shortcode

Теперь вы можете отображать хлебные крошки на своем сайте.

Ранг Математика SEO

Вы также можете использовать плагин Rank Math SEO для отображения хлебных крошек. если вы являетесь профессиональным пользователем Rank Math, вы можете легко добавить хлебные крошки с помощью виджета.

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

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

 [rank_math_breadcrumb]
Add Manual Rant Math Breadcrumbs Shortcode

Вот и все.

Часто задаваемые вопросы о панировочных сухарях Elementor

Давайте рассмотрим приведенные ниже часто задаваемые вопросы о панировочных сухарях Elementor.

Что такое хлебные крошки в Elementor?

Использование «хлебных крошек» — это разумный способ навигации по вашему сайту. Виджет Elementor Breadcrumbs позволяет добавлять хлебные крошки на страницы или сообщения вашего сайта. Чтобы использовать виджет, вам необходимо установить бесплатную и профессиональную версию Elementor. У вас также должен быть SEO-плагин на вашем сайте для работы с этим виджетом.

Должен ли я использовать хлебные крошки на моем сайте?

Да, ты должен. Это помогает поисковым системам, таким как Google, понять структуру вашего сайта. Вы даже получаете некоторые преимущества SEO.

Кликабельны ли хлебные крошки?

Да, панировочные сухари кликабельны.

Включают ли хлебные крошки текущую страницу?

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

Как добавить хлебные крошки в WordPress без плагинов?

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

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

Вы можете легко удалить «хлебные крошки» со своего сайта, добавив CSS (display: none;).

Бонус: используйте виджет хлебных крошек Happy Addons, чтобы добавить потрясающие хлебные крошки на свой веб-сайт Elementor!

Happy Addons Breadcrubs Widgets

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

Ключевая особенность.

  • Легко использовать.
  • Предлагает красивые готовые схемы хлебных крошек, которые помогут вам легко спроектировать хлебные крошки. Вы можете найти их на демо-странице.
HappyAddons Breadcrumb Demo
Демонстрационные проекты хлебных крошек
  • Полностью настраиваемый.
  • Получите дополнительные настройки.
  • Возможность добавить значок «Домой», который придаст вашим панировочным сухарям больше доверия.
Happy Addons Breadcrumbs
Иконка Главная

Ознакомьтесь с документацией хлебных крошек Happy Addons и узнайте, как ее использовать.

Попробуйте HappyAddons для создания потрясающего веб-сайта!

Улучшите пользовательский опыт вашего веб-сайта с помощью «хлебных крошек»

Добавление «хлебных крошек» дает вам дополнительное преимущество SEO на вашем веб-сайте Elementor.

В этом руководстве мы рассмотрели все возможные способы добавления этого веб-элемента. Мы обсудили его важность. Кроме того, дано краткое введение в виджет «Хлебные крошки» Happy Addons.

Если у вас возникнут какие-либо вопросы относительно этого блога, вы можете прокомментировать нас.

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

Подписывайтесь на нашу новостную рассылку

Получайте последние новости и обновления на Elementor