Home / Сайтостроение / Делаем хлебные крошки на сайте!

Делаем хлебные крошки на сайте!

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

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

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

Хлебные крошки или навигационная цепочка (от англ. — breadcrumbs) – это цепочка навигации по сайту, от главной страницы, до текущей, на которой находиться пользователь.

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

На сайте хлебные крошки выглядят примерно так:

Главная >> Раздел >> Подраздел >> Текущая страница

Конечно в зависимости от уровня вложенности страниц, эта навигационная цепочка может отличаться.

Хлебные крошки незначительно, но все же влияют на поисковое ранжирование. Вот что говорят о хлебных крошках Google и Яндекс:

Яндекс о хлебных крошках

google о хлебных крошках

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

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

Для начала будем устанавливать навигационную цепочку при помощи кода. Это способ мне нравиться больше.

Итак.

1) Сделайте бекап блога! На всякий случай, ведь придеться работать с кодом, который влияет на функционирование вашего шаблона.

2) Скопируйте вот этот код и вставьте в файл functions.php перед знаком ?> (Этот код создает навигационную цепочку)

function the_breadcrumb() {
 echo '';
 if (!is_front_page()) {
 echo '<a href="'; echo get_option('home'); echo '">Ваш сайт';
 echo "</a> » ";
 if (is_category() || is_single()) {
 the_category(' ');
 if (is_single()) {
 echo " » ";
 the_title();
 }
 } elseif (is_page()) {
 echo the_title();
 }
 }
 else {
 echo 'Home';
 }
}
Только не забудьте вместо надписи «Ваш сайт» вписать свое доменное имя или просто — «Главная».

3) Скопируйте код и вставьте в файлы single.php (для вывода хлебных крошек в записях) и page.php (для вывода хлебных крошек в страницах) перед кодом, выводящим контент, обычно он выглядит примерно так:

<?php while ( have_posts() ) : the_post(); ?>

Код для вставки:

<div class="kroshki">
<?php
 the_breadcrumb();
?>
</div>

Можете просто вставить после кода:

Возможно вас заинтересует:  Как сделать поддомен для сайта

<?php get_header(); ?>

Кроме этого по желанию, можете вставить этот код в файлы — search.php (страница поиска информации по блогу и archive.php (страница архива блога)

4) Скопируйте код и вставьте его в самый низ файла style.css (этот код выравнивает расположение хлебных крошек — делает отступ от остальных блоков)

.kroshki {
 margin:5px 0px 0px 10px;
}

Вот и все. Не пугайтесь, что так много кода, это намного проще чем кажеться 🙂

Установка хлебных крошек при помощи плагина Breadcrumb NavXT

Здесь все так же просто. Нужно скачать и активировать плагин Breadcrumb NavXT на блог. Думаю у вас не возникнет вопросов, как скачивать и устанавливать плагин. Все делается стандартным образом.

А вот и сам код:

<div class="breadcrumb">
<?php
if(function_exists('bcn_display'))
{
 bcn_display();
}
?>
</div>

Как видите все очень просто, справиться даже новичок. При желании, можно подредактировать стили, чтобы хлебные крошки выводились как-то оригинально. Например, вставив вот этот код в файл style.css

.breadcrumb {
font:bolder 12px "Trebuchet MS", Verdana, Arial;
padding-bottom: 10px;
}
 
.breadcrumb a{
 
color: #1B7499;
}
.breadcrumb a:hover {
color: #EF0E0E;
}

У меня при помощи плагина получилось как-то так:

пример хлебных крошек на wordpress

А вы выводите хлебные крошки у себя на блоге?

13 комментариев

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

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

    Ответить
  3. Нужно попробовать реализовать себе на сайте!

    Ответить
  4. Сейчас буду ставить при помощи скрипта. Посмотрим что получится.

    Ответить
  5. Получиться-то получилось. Но потом не смог зайти на другие страницы сайта. Пришлось восстановить старые файлы. Обидно…

    Ответить
    • Что-то странно, Ильдар. Скрипт вполне рабочий. Сам им пользуюсь. Может он у вас с каким-либо плагином конфликтует?

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

      • Как получиться настроить дайте знать, буду тогда и себе пробовать!

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

    Ответить
    • Александр, тут сложно сказать. С одной стороны ты прав, но с другой, если следовать твоей логике, то и комментарии стоит вообще отключить, ведь из-за них тоже получается уменьшается релевантность статьи?
      Я думаю, если сделать грамотную микроразметку, то вообще нет в этом проблемы.
      Поисковики тоже зря не будут советовать делать хлебные крошки. Думаю они прекрасно разберуться где хлебные крошки, а где сам контент.

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

    Ответить
    • Переспама не будет в этом. Взять к примеру мой блог. Если помнишь, я запускал SEO марафон. Так вот было несколько статей с одинаковым словосочеианием — первый отчет SEO марафона, второй отчет SEO марафона и т. д.
      В итоге, долгое время по запросу «SEO марафон» мой блог был первой десятке выдаче в Яндексе и в двадцатке гугла.

      Ответить

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *