Сайт о телевидении

Сайт о телевидении

» » Хлебные крошки WordPress — настройка плагина Breadcrumb NavXT. Хлебные крошки в WordPress средствами плагина Breadcrumb NavXT (усиливаем перелинковку)

Хлебные крошки WordPress — настройка плагина Breadcrumb NavXT. Хлебные крошки в WordPress средствами плагина Breadcrumb NavXT (усиливаем перелинковку)

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

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

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

Обычно навигация Хлебные крошки (по-английски Breadcrumbs) представляет из себя полосу в верхней части страницы, которая имеет примерно такой вид:

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

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

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

Плагин Breadcrumb NavXT

Для установки плагина Breadcrumb NavXT нужно войти в «Админ-панель WordPress» => «Плагины» => «Добавить новый». В поле «Поиск» нужно ввести выражение «Breadcrumb NavXT», а после этого нужно нажать на кнопку «Поиск плагинов».
В окне «Установить плагин» под названием плагина «Breadcrumb NavXT» следует нажать на ссылку «Установить».

В открывшемся окне «Установка плагина: Breadcrumb NavXT» необходимо нажать на ссылку «Активировать плагин». После этого в боковой панели «Админ-панели WordPress» появился новый пункт «Breadcrumb NavXT». Если нажать на этот пункт, то тогда можно будет войти в настройки плагина хлебных крошек.

В окне «Настройки Breadcrumb NavXT» расположено довольно много настроек этого плагина. Настройки Breadcrumb NavXT можно оставить сделанными по умолчанию. Во вкладке «Основные» можно, если вы хотите, изменить пункт «Ссылка на главную».

Теперь нужно вставить в файлы вашей темы, в те места, где должны будут отображаться хлебные крошки, следующий код:

Этот код желательно вставить в такие файлы вашей темы: «Одна запись (single.php)», «Шаблон страницы (page.php)», «Архивы (arhvie.php)», «Результаты поиска (search.php)».

Для того, чтобы вставить этот код нужно войти в «Админ-панель WordPress» => «Внешний вид» => «Редактор» => «Шаблоны».

В шаблон «Одна запись (single.php)», который отвечает за страницы со статьями, код вставляется так, как показано на этом изображении.

После вставки кода, нажимаете на кнопку «Обновить файл».

Код вставлен, затем нужно нажать на кнопку «Обновить файл».

В файл «Архивы (arhvie.php)», который отвечает за рубрики, также нужно будет вставить этот код.

После того, как код вставлен, нажимаете на кнопку «Обновить файл».

И в завершении установки кода в файлы темы WordPress, код вставляется в файл «Результаты поиска (search.php)», который отвечает за поиск по сайту. Вставляете код в то место, как это показано на изображении.

На этом изображении видно как выглядит навигация хлебные крошки. Имя главной страницы не было изменено на название сайта.

Можно также вставить в файл «Таблица стилей (style.ccs)» такой код (это делать необязательно):

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

В этом коде можно менять размер и шрифт (font:bolder 12px «Trebuchet MS», Verdana, Arial), отступы (padding-bottom: 10px), а также цвет ссылок хлебных крошек в статическом состоянии и при наведении на них курсора мыши (можно менять цифровые значения).

Показания в этом коде можно менять по своему усмотрению, или найти другой подобный код в Интернете. Также можно вообще обойтись и без установки этого кода в файл «Таблица стилей (style.ccs)». В установленной у меня теме, после установки кода, немного изменился шрифт.

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

Выводы статьи

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

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

Функции

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

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

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

Стоит ли добавлять вспомогательную навигацию на сайт

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

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

Breadcrumb NavXT

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

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

При необходимости можно включить функцию генерирования кода в соответствии с принятым Google стандартом RDFa. Подобная разметка панели вспомогательного меню не будет гарантией того, что система применит «хлебные крошки» при создании поискового сниппета, однако шансы на это существенно возрастут. Ссылки отображаются только в виджете. Добавить вспомогательное меню в начало страницы не удастся. Стоит учитывать, что «хлебные крошки» не поддерживаются поисковой системой «Яндекс».

Yoast Wordpress SEO

Создание вспомогательного меню - это одна из функций данного программного продукта. Большое количество инструментов позволяет выполнять расширенную SEO-оптимизацию. Этот плагин используют люди, настроенные на качественное продвижение блога. Редактирование блока со ссылками у некоторых владельцев сайтов может вызвать затруднения. Чтобы выполнить эту задачу, нужно открыть административную панель Wordpress, перейти в раздел «SEO» и выбрать строку «дополнительно».

Будет загружена страница с дополнительными настройками плагина. Здесь необходимо перейти на вкладку «навигационная цепочка». Пункт «включить» следует отметить галочкой. Для появления вспомогательного меню на сайте требуется добавить в код блога PHP-функцию, отвечающую за вывод. В поле «разделитель» можно ввести любой символ, который поддерживается HTML5.

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

Breadcrumb Trail

С помощью плагина от Джастина Тэдлока можно быстро создавать в Wordpress «хлебные крошки». Начинавшееся с небольшого скрипта, это программное обеспечение переросло в продвинутую систему.

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

Yummi «хлебные крошки»

Этот программный продукт можно установить прямо из панели администратора в Wordpress. Для этого следует перейти на страницу «плагины». Затем нужно кликнуть по кнопке «добавить новый», ввести название в строку поиска, нажать Enter и установить ПО. После активации необходимо настроить плагин. С этой задачей справится даже начинающий пользователь.

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

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

Really Simple Breadcrumb

Этот программный продукт - еще одно простое решение для Wordpress. Плагин работает корректно и без ошибок, отображается согласно коду используемой темы. Установить программное обеспечение можно через панель администратора. Для того чтобы «хлебные крошки» отображались на статических страницах, необходимо прописать над строкой вывода заголовка соответствующий код. Если пользователю нужно изменить тип разделителя, то он может редактировать 17 строчку файла breadcrumb.php.

В этом варианте добавления вспомогательного меню отсутствует микроразметка. С нею «хлебные крошки» будут отображаться в сниппете поисковой выдачи Google вместо URL. Это повысит кликабельность. Поэтому пользователю необходимо добавить микроразметку или использовать другой вариант.

DP RDFa Breadcrumb Generator

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

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

Flector 5

Breadcrumb NavXT это самый продвинутый и популярный плагин "хлебных крошек " для блога на WordPress . У него всего один недостаток – нет никаких встроенных стилей оформления. Этот недостаток плагина вы можете исправить, взяв готовые к использованию стили из этой статьи. В плагине достаточно много тонких настроек, так что я перевел его на русский язык, чтобы в настройках могли разобраться даже новички. Также читайте как оформить панель "хлебных крошек " в разметке RDFa , которая поможет поисковикам найти и использовать эту панель при формировании сниппета.

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

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

Как это сделать? Первым делом, поменяйте код вызова панели на:

Главная

< span typeof= "v:Breadcrumb" > < a href= "%link%" rel= "v:url" property= "v:title" >% htitle%

%htitle%

И так для каждой ссылки в панели навигации. Я не буду заставлять вас вручную менять каждую ссылку в настройках плагина - вот вам готовый настроек (правая кнопка мышки и "Сохранить объект как "). Нажмите "Помощь ", затем кликните на "Импорт/Экспорт/Сброс " и выберите скаченный файл для загрузки и импорта. В данном файле экспорта использованы настройки плагина по умолчанию плюс RDFa разметка и ничего больше. При желании вы можете настроить плагин под себя, но не трогайте в настройках все, что относится к RDFa .

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

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

Кстати, формально плагин поддерживает разметку для "хлебных крошек ". Но почему-то только в виджете и только разметку "schema.org ". Однако поддерживает он ее криво - валидацию у гугла такая разметка не проходит:

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

К сожалению, на данный момент "хлебные крошки " не поддерживаются яндексом . Причем ни в каком виде – что в размеченном, что нет. Жаль, конечно, но тут ничего не поделаешь.Скачать плагин версии 6.2.1 (всего скачено 6 988 695 раз)

Понравился пост? Подпишись на обновления по или

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

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

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

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

На своем блоге я уже описывал установку хлебных крошек с помощью плагина .

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

Внимание! Перед установкой кода сделайте резервные копии файлов, в которые вы будете вставлять коды, чтобы в случае неполадок восстановить работоспособность вашей темы WordPress.

Для установки хлебных крошек вам необходимо будет вставить несколько кодов в соответствующие файлы вашей темы.

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

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

Установка хлебных крошек на сайт

Два варианта кода потребуется вставить в следующие файлы темы: «Функции темы (functions.php)», «Одна запись (single.php)», «Шаблон страницы (page.php)», «Архивы (arhvie.php)», «Результаты поиска (search.php)».

Первый код нужно будет вставить в файл «Функции темы (functions.php)», установленной на вашем блоге темы WordPress.

// хлебные крошки function dimox_breadcrumbs() { $showOnHome = 0; // 1 - показывать "хлебные крошки" на главной странице, 0 - не показывать $delimiter = "»"; // разделить между "крошками" $home = "Главная"; // текст ссылка "Главная" $showCurrent = 1; // 1 - показывать название текущей статьи/страницы, 0 - не показывать $before = ""; // тег перед текущей "крошкой" $after = " "; // тег после текущей "крошки" global $post; $homeLink = get_bloginfo("url"); if (is_home() || is_front_page()) { if ($showOnHome == 1) echo "

" . $home . "
"; } else { echo "
" . $home . " " . $delimiter . " "; if (is_category()) { global $wp_query; $cat_obj = $wp_query->get_queried_object(); $thisCat = $cat_obj->term_id; $thisCat = get_category($thisCat); $parentCat = get_category($thisCat->parent); if ($thisCat->parent != 0) echo(get_category_parents($parentCat, TRUE, " " . $delimiter . " ")); echo $before . single_cat_title("", false). $after; } elseif (is_day()) { echo "" . get_the_time("Y") . " " . $delimiter . " "; echo "" . get_the_time("F") . " " . $delimiter . " "; echo $before . get_the_time("d") . $after; } elseif (is_month()) { echo "" . get_the_time("Y") . " " . $delimiter . " "; echo $before . get_the_time("F") . $after; } elseif (is_year()) { echo $before . get_the_time("Y") . $after; } elseif (is_single() && !is_attachment()) { if (get_post_type() != "post") { $post_type = get_post_type_object(get_post_type()); $slug = $post_type->rewrite; echo "" . $post_type->labels->singular_name . " " . $delimiter . " "; if ($showCurrent == 1) echo $before . get_the_title() . $after; } else { $cat = get_the_category(); $cat = $cat; echo get_category_parents($cat, TRUE, " " . $delimiter . " "); if ($showCurrent == 1) echo $before . get_the_title() . $after; } } elseif (!is_single() && !is_page() && get_post_type() != "post" && !is_404()) { $post_type = get_post_type_object(get_post_type()); echo $before . $post_type->labels->singular_name . $after; } elseif (is_attachment()) { $parent = get_post($post->post_parent); $cat = get_the_category($parent->ID); $cat = $cat; echo get_category_parents($cat, TRUE, " " . $delimiter . " "); echo "" . $parent->post_title . " " . $delimiter . " "; if ($showCurrent == 1) echo $before . get_the_title() . $after; } elseif (is_page() && !$post->post_parent) { if ($showCurrent == 1) echo $before . get_the_title() . $after; } elseif (is_page() && $post->post_parent) { $parent_id = $post->post_parent; $breadcrumbs = array(); while ($parent_id) { $page = get_page($parent_id); $breadcrumbs = "ID) . "">" . get_the_title($page->ID) . ""; $parent_id = $page->post_parent; } $breadcrumbs = array_reverse($breadcrumbs); foreach ($breadcrumbs as $crumb) echo $crumb . " " . $delimiter . " "; if ($showCurrent == 1) echo $before . get_the_title() . $after; } elseif (is_search()) { echo $before . "Результаты поиска по запросу "" . get_search_query() . """ . $after; } elseif (is_tag()) { echo $before . "Записи с тегом "" . single_tag_title("", false) . """ . $after; } elseif (is_author()) { global $author; $userdata = get_userdata($author); echo $before . "Статьи автора " . $userdata->display_name . $after; } elseif (is_404()) { echo $before . "Error 404" . $after; } if (get_query_var("paged")) { if (is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author()) echo " ("; echo __("Page") . " " . get_query_var("paged"); if (is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author()) echo ")"; } echo "
"; } } // end dimox_breadcrumbs()

Для вставки этого кода в файл установленной на вашем сайте темы, нужно войти в «Админ-панель WordPress» => «Внешний вид» => «Редактор => «Шаблоны», и там нажать на пункт «Функции темы (functions.php)».

В окне «Редактировать темы», в файл «Функции темы ((functions.php)» потребуется вставить первый код в самом верху файла, после

Название записи домашней страницы - «Главная», можно изменить по вашему желанию на название вашего сайта. Для этого в соответствующей строке кода нужно заменить слово «Главная» на название вашего сайта.

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

После вставки кода и сделанных в нем по вашему желанию изменений, нажимаете на кнопку «Обновить файл».

Следующий код нужно будет вставить в несколько файлов установленной у вас темы: «Одна запись (single.php)», «Шаблон страницы (page.php)», «Архивы (arhvie.php)», «Результаты поиска (search.php)».

В файл «Одна запись (single.php)», отвечающий за страницам со статьями, код вставляется в место, показанное на изображении.

После вставки этого кода нужно нажать на кнопку «Обновить файл».

В файл «Архивы (arhvie.php)», вставляете этот код, в место, которое выделено в рамке на изображении.

Потом нажимаете на кнопку «Обновить файл».

В файл «Результаты поиска (search.php)», отвечающий за поиск по сайту, вставляете код в место, указанное на изображении.

После того, как вы вставили код, нажимаете на кнопку «Обновить файл».

В файл «Шаблон страницы (page.php)», отвечающий за статические страницы, вставляете код, как это показано на изображении.

После установки кода нажимаете на кнопку «Обновить файл».

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

Можно еще добавить такой код в файл «Таблица стилей (style.ccs)»:

/* Хлебные крошки */ #crumbs { padding:10px 10px 0 15px; max-height:20px; overflow:hidden; line-height: 180%; border-radius:0 0 8px 8px; -moz- border-radius:0 0 8px 8px; -webkit- border-radius:0 0 8px 8px;}

Этот код вставляется в самом конце файла «Таблица стилей (style.ccs)» для изменения внешнего вида установленной навигации хлебные крошки. Код для вставки в файл «Таблица стилей (style.php)» может иметь и другие характеристики (размеры, отступы и т. д.). Вставлять такой или подобный код на свой блог совсем не обязательно.

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

Выводы статьи

Теперь на вашем блоге установлены Хлебные крошки без использования плагина. Создателем этой функции является известный блогер Dimox (Дмитрий).

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

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

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

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

Breadcrumb полезны в таких случаях:

  • когда они отлично смотрятся с дизайном площадки (в этом случае меню используется не для оптимизации, а только для пользы и удобства посетителей);
  • когда площадка имеет действительно сложную структуру (например, корпоративный ресурс со сложной и запутанной структурой).

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

  1. Location. Данный тип определяет путь, и он является постоянным, т.е. он не будет меняться по мере передвижения пользователя по ресурсу;
  2. Path. Этот тип показывает посетителю тот путь, который он уже прошел. Главным минусом таких крошек является то, что если пользователь придет из поисковой машины, то крошки не будут показываться;
  3. Attribute. Такие крошки показываются в виде меток на конкретных страницах и позволяют определить рубрику на сайте. Данный вариант наиболее удобен и работает практически на всех ресурсах.

Раскрутка сайтов по НЧ запросам имеет ряд достоинств, что особенно важно для коммерческих проектов; крошки иногда отбивают необходимость во вложении средств, необходимых для приобретения внешних ссылок. То есть вести раскрутку по НЧ запросам можно только при помощи одной лишь оптимизации за счет создания корректной перелинковки (иногда это действительно работает, но не стоит ожидать слишком многого от такого решения). Главное тут то, что посетители, которые пришли с поисковиков по таким запросам, очень часто конвертируются в деньги, а не просто в минутных гостей (со средне- и высокочастотными запросами такой номер не проходит).

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

Вариант без установки плагина

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

Способ состоит из пары шагов:

  • вписывание кода в файл functions.php;
  • вписывание кода крошек в нужное место.

Итак, берем первый код и вставляем его в файл functions.php вашего активного шаблона:

function the_breadcrumb() {
if (!is_front_page()) {
echo "Главная";
echo " » ";
if (is_category() || is_single()) {
the_category(" ");
if (is_single()) {
echo " » ";
the_title();
}
} elseif (is_page()) {
echo the_title();
}
}
else {
echo "Home";
}
}

Его можно разместить в самом конце документа перед символами «?>» (без кавычек). Если в конце тега нет, то код можно закинуть в самое начало перед открывающимся тегом. При размещении кода смотрите, чтобы кодировка была UTF-8, или в противном случае некоторые русские буквы и слова будут отображаться неправильно. Задать кодировку можно при помощи редактора Notepad при помощи пункта «Кодировка – Кодировать в UTF-8 (без ВОМ).

Теперь используем другой код и прописываем его там, где и требуется вывести хлебные крошки:

the_breadcrumb ();
?>

Считается, что крошки должны размещаться везде, кроме главной страницы. То есть необходимо разместить этот код в файлах single.php, archive.php, page.php и category.php. Где конкретно размещать его – дело ваше, но по дефолту он вставляется перед выводом основного контента. Если есть возможность размещать код в главном блоке, то сделайте это, ведь потом не придется играться со стилями, чтобы крошки отображались как полагается.

Как видите, нужно лишь немного покопаться в файлах темы. Да и к тому же, способ работает без вспомогательных модулей. Ну а кому хочется получить возможность менять крошки на свое усмотрение, то придется ставить сторонние плагины. Отлично работает SEO by Yoast и Breadcrumb NavXT. Давайте рассмотрим первый из них.

Плагин SEO by Yoast

В качестве альтернативы вышеописанному способу можно использовать плагин SEO by Yaost, который способен создавать очень привлекательные крошки. Его основные достоинства:

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

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

Начнем с загрузки и инсталляции. Получить плагин можно по ссылке : https://wordpress.org/plugins/wordpress-seo/. Установка стандартна – заливаем содержимое в папку wp-content/plugins и активируем его в админке. Теперь можно переходить и к настройке:

  1. В админ панели переходим в раздел «SEO – Дополнительно»;
  2. Произойдет загрузка дополнительных настроек плагина (он создан не только для отображения крошек), но конкретно нас интересует раздел «Навигационная цепочка»;
  3. Активируем крошки, но для их появления на площадке необходимо будет разместить специальный код (найти его сможете в конце этого списка);
  4. Выбираем один из разделителей, который поддерживается HTML5;
  5. Далее выбираем текст главной страницы сайта (например, «Главная», «Домой» и т.д.);
  6. Префикс – это символ или слово, которое будет отображаться перед всеми крошками на ресурсе (обычно ставят стрелочку);
  7. Далее можно выбрать префиксы конкретно для архивов, страниц результатов поиска, страницы 404;
  8. Выделять последний пункт жирным может и кому-то покажется полезным, но последняя страница часто идентична заголовку, поэтому тут решайте сами, как поступить;
  9. Последний пункт настроек – таксономия (можно выбрать между рубриками, форматами, метками);
  10. Сохраняем внесенные изменения.

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

{yoast_breadcrumb("");} ?>

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

Плагин Breadcrumb NavXT

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

Загрузить плагин можно на странице : http://wordpress.org/extend/plugins/breadcrumb-navxt/ ( не ниже 3.0 и PHP 5). После скачивания заливаем плагин в папку wp-content/plugins и активируем его в админ панели. Заметим, что если у вас уже стояла старая версия модуля, то ее необходимо отключить, или же плагин может немного глючить (не сохраняются настройки). Если выключить все же забыли и ничего не работает, то после установки выключаем его и ставим по-новому. Теперь все будет корректно запускаться.

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

Итак, заходим админку ресурса, смотрим на левую панель и выбираем там пункт «Breadcrumb NavXT». Тут будет показано несколько вкладок по типу «Общие», «Текущая позиция» и т.п. На главной вкладке «Общие» расположены параметры, которые будут затрагивать все страницы сайта. Поле «Разделитель» позволяет указать символ, который будет как разделитель хлебных крошек (на наш взгляд, наиболее удачный символ – «>» – простой и понятный каждому).

Поле «Максимальная длинна» указывает длину анкора в символах. Мы рекомендуем указать ограничение в 60 символов, что полезно в плане оптимизации. Выше мы уже упоминали о пользе крошек для SEO; то есть крошки будут индексироваться поисковыми машинами, и использоваться они будут не только для передачи пустого веса. Оговоримся, что поисковые машины могут непредсказуемо относиться к ссылкам с идентичными анкорами, поэтому рекомендуем их укорачивать (это необязательно, но все же можно немного потратить времени на это).

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

Стоит взять во внимание: этот текст может учитываться поисковыми системами, как анкор. То есть, стоит указать ключевики, которые касаются вашей главной страницы. После этого сохраняем все внесённые изменения при помощи соответствующей кнопки.

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

Следующее поле «Текст текущей позиции» можно не трогать, просто потому, что оно хорошо показывает смысл перехода (этот текст будет видеть посетитель, когда наведет курсор мыши на ссылку). Вкладка «Записи/Страницы» позволяет настроить показ ссылок на страницы со контентом и статические страницы площадки (для статей можно задать надпись «Текущая статья»).

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