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

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

Кроме названия поста (страница, где находится посетитель) все ссылки хлебных крошек wordpress активны, по ним можно переходить.

хлебные крошки на сайте что это

Особенно актуальны хлебные крошки для интернет магазинов, для сайтов со сложной многоуровневой структурой (множеством категорий и подкатегорий).

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

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

1. роботам - быстрее понять структуру сайта, проиндексировать страницы;

2. посетителям – проще ходить, перемещаться по разделам.

Их установка значительно улучшает поведенческие факторы.

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

К тому же я не люблю плагины, слишком уж они нагружают блог.

Как сделать хлебные крошки на сайте wordpress без плагина

Один из блогеров – dimox, очень удачно извлек код из плагина Breadcrumb Nav XT и показал нам места в редакторе для вставки кода.

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

Шаг первый. Сделайте бекап сайта, потому что работать будем с редактором Вордпресс, мало ли что пойдет неправильно;

Шаг второй. В файл (functions.php) Функции темы после первого <?php вставьте код

// хлебные крошки
function dimox_breadcrumbs() {

$showOnHome = 0; // 1 - показывать "хлебные крошки" на главной странице, 0 - не показывать
$delimiter = '&raquo;'; // разделить между "крошками"
$home = 'Главная'; // текст ссылка "Главная"
$showCurrent = 1; // 1 - показывать название текущей статьи/страницы, 0 - не показывать
$before = '<span class="current">'; // тег перед текущей "крошкой"
$after = '</span>'; // тег после текущей "крошки"

global $post;
$homeLink = get_bloginfo('url');

if (is_home() || is_front_page()) {

if ($showOnHome == 1) echo '<div id="crumbs"><a href="' . $homeLink . '">' . $home . '</a></div>';

} else {

echo '<div id="crumbs"><a href="' . $homeLink . '">' . $home . '</a> ' . $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 '<a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a> ' . $delimiter . ' ';
echo '<a href="' . get_month_link(get_the_time('Y'),get_the_time('m')) . '">' . get_the_time('F') . '</a> ' . $delimiter . ' ';
echo $before . get_the_time('d') . $after;

} elseif ( is_month() ) {
echo '<a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a> ' . $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 '<a href="' . $homeLink . '/' . $slug['slug'] . '/">' . $post_type->labels->singular_name . '</a> ' . $delimiter . ' ';
if ($showCurrent == 1) echo $before . get_the_title() . $after;
} else {
$cat = get_the_category(); $cat = $cat[0];
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[0];
echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');
echo '<a href="' . get_permalink($parent) . '">' . $parent->post_title . '</a> ' . $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[] = '<a href="' . get_permalink($page->ID) . '">' . get_the_title($page->ID) . '</a>';
$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 '</div>';

}
} // end dimox_breadcrumbs()

Посмотрите на скриншоте

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

 

 

 

 

Хлебные крошки могут быть полезны для Seo оптимизации. Для этого слово «Главная» страница нужно заменить названием блога.

Чтобы в навигации страниц не отображался заголовок поста, поменяйте в строке

showCurrent = 1; // 1 - показывать название текущей статьи/страницы, 0 - не показывать

цифру 1 на 0.

Я у себя оставила 1, поэтому название поста как бы дублируется, вы можете сами посмотреть в сервисе MegaIndex.ru.

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

Не забудьте сохранить изменения в коде и файле functions.php.

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

Шаг третий. Необходимо добавить код после фразы <div id="content"> во все файлы, где требуется улучшить навигацию:

(page.php) Шаблон страницы,

(single.php) Одна запись,

(search.php) Результаты поиска,

(arhvie.php) Архивы

Вот этот код

<?php if (function_exists('dimox_breadcrumbs')) dimox_breadcrumbs(); ?>

как на скриншоте

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

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

Хлебные крошки посредством php

Если вы не хотите раздувать файл functions.php, код хлебных крошек можно вставить напрямую в шаблон.

Создайте на рабочем столе компьютера пустой текстовый файл, назовите его breadcrumbs.php. Вставьте в него этот код

<?php if ( have_posts() ) ...
<div id="breadcrumbs">
  <?php if (is_home()) { ?>  

 <?php } elseif (is_single()) { ?>
     <a href="<?php echo get_option('home'); ?>">Главная</a> &laquo;            
     <?php foreach((get_the_category()) as $cat) { 
     $cat=$cat->cat_ID; 
     echo(get_category_parents($cat, TRUE, ' &laquo; ')); } ?>Пост "<?php the_title(); ?>"

 <?php } elseif (is_page()) { ?>
     <a href="<?php echo get_option('home'); ?>">Главная</a> &laquo; Страница "<?php the_title(); ?>"    

 <?php 
     } elseif (is_category() and get_category($cat)->parent) { ?>
     <a href="<?php echo get_option('home'); ?>">Главная</a> &laquo;            
     Рубрика <?php foreach((get_the_category()) as $cat) { 
                    $cat=$cat->cat_ID; 
     echo(get_category_parents($cat, TRUE, ' &laquo; ')); } ?>

 <?php 
     } elseif (is_category()) { ?>
     <a href="<?php echo get_option('home'); ?>">Главная</a> &laquo;            
     Рубрика "<?php {echo single_cat_title();} ?>"

 <?php } elseif (is_tag()) { ?><a href="<?php echo get_option('home'); ?>">Главная</a> &laquo; Архив тега     

 <?php } elseif (is_day()) { ?><a href="<?php echo get_option('home'); ?>">Главная</a> &laquo;  Архив записей

 <?php } elseif (is_month()) { ?><a href="<?php echo get_option('home'); ?>">Главная</a> &laquo; Архив записей

 <?php } elseif (is_year()) { ?><a href="<?php echo get_option('home'); ?>">Главная</a> &laquo;  Архив записей

 <?php } elseif (is_author()) { ?>
       <a href="<?php echo get_option('home'); ?>">Главная</a> &laquo; Страница автора 

 <?php } elseif (is_search ()) { ?>
       <a href="<?php echo get_option('home'); ?>">Главная</a> &laquo; Результаты поиска

 <?php } elseif (is_404()) { ?>
       <a href="<?php echo get_option('home'); ?>">Главная</a> &laquo; Ошибка 404 

 <?php } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) { ?><h3>Архивы</h3>
    <?php } ?>
</div>

Залейте файл breadcrumbs.php в шаблон вашей темы с помощью ftp клиента filezilla. Подробно о загрузке через ftp клиент написано здесь.

После того как файл отобразится в редакторе вашей темы, откройте файл single.php, найдите в нем строчку

<?php if ( have_posts() )

Это начало цикла вордпресс, перед ним и надо вставить код, который присоединит созданный нами файл breadcrumbs.php к файлам темы.

<?php include (TEMPLATEPATH. '/breadcrumbs.php'); ?>

За дизайн крошек отвечает элемент DIV с оформлением id="breadcrumbs".

В файл css вставьте такие строки

/*breadcrumbs - start*/

/* цвет шрифта и его размер, отступы, ширина */ 
#breadcrumbs {margin:10px 10px 10px 10px;width:auto;font-size:12px;color:#232323;text-align:left;overflow:hidden;}

/* цвет ссылок */
#breadcrumbs a, #breadcrumbs a:visited {color:#232323;text-decoration:none;outline:none;} 

/* цвет ссылок при подведении к ним курсора */
#breadcrumbs a:hover, #breadcrumbs a:active {color:#50988f;text-decoration:none;outline:none;}

/*breadcrumbs - end*/

Отредактируйте стили в соответствии со стилями своего блога.