Как и обещал в прошлой статье, сегодня мы поговорим о способах улучшения внутренней перелинковки страниц на сайте. В частности рассмотрим вариант дополнительной навигации на блоге, который называется breadcrumbs или «хлебные крошки». Что из себя представляет эта «штуковина», вы можете видеть, например над заголовком этой статьи. Это ссылки в формате:
Главная » Раздел или категория » Название статьи или страницы
Как организовать такую навигацию на своём блоге без плагинов мы подробно разберём в этой заметке.
На своём блоге я применяю функцию seorubl_breadcrumbs(), написана она мною пару минут назад. В основу легла известная в Интернете функция dimox_breadcrumbs(), но я её немного переработал и переименовал соответственно.Что изменено? Убрал некоторые громоздкие, но редко используемые конструкции в самой функции. Также изменил способ и стиль вызова и задания аргументов и настроек. Теперь функция написана в стиле стандартных функций WordPress. Она стала более гибкая в плане настроек внешнего вида, может применяться в разных блоках на блоге, также возможен одновременный бесконфликтный вызов нескольких функций на одной странице.
Как заставить работать функцию seorubl_breadcrumbs() на своём блоге?
Довольно просто и стандартно. Добавляем код функции в файл functions.php вашего шаблона.
function seorubl_breadcrumbs($args_crumbs = array()) { // Для вывода хлебных крошек в нужном месте вызовите функцию: // $args_crumbs = array('id_block' => 'breadcrumbs', 'home' => 'Главная', 'delimiter' => '»', 'before' => '<span>', 'after' =>'</span>'); // seorubl_breadcrumbs($args_crumbs); // $home = 'Главная'; // анкор ссылки «Главная» // $delimiter = '»'; // разделитель между ссылками // $before = '<span>'; // теги до и после // $after = '</span>'; // названия текущей страницы // для настройки стиля всего контейнера: #breadcrumbs $defaults = array( 'home' => 'Главная', 'id_block' => 'breadcrumbs', 'delimiter' => '»', 'before' => '<span>', 'after' => '</span>' ); $args = wp_parse_args( $args_crumbs, $defaults ); extract( $args, EXTR_SKIP ); echo '<!-- start seorubl_breadcrumbs() -->'; if ( !is_home() && !is_front_page() || is_paged() ) { echo '<div id="'.$id_block.'">'; global $post; $home_link = get_option('home'); echo '<a href="'.$home_link.'" title="'.$home.'">'.$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 get_the_time('F'); } elseif (is_year()) { echo $before.get_the_time('Y').$after; } elseif (is_single() && !is_attachment()) { $cat = get_the_category(); $cat = $cat[0]; echo get_category_parents($cat, TRUE, ' '.$delimiter.' '); echo $before.get_the_title().$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.' '; echo $before.get_the_title().$after; } elseif (is_page()) { 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()) { echo $before.'Статьи автора'. $after; } elseif (is_404()) { echo $before.'Error 404'.$after; } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) echo "Архивы блога"; } echo '</div>'; echo '<!-- end seorubl_breadcrumbs() -->'; } // end seorubl_breadcrumbs()
Теперь, чтобы вывести на блоге навигацию по типу «хлебные крошки», вам нужно в файлы шаблона, которые отвечает за вывод контента, вставить следующий код:
<?php if (function_exists('seorubl_breadcrumbs')) : seorubl_breadcrumbs(); endif; ?>
Этот код выведет «хлебные крошки» со стандартными настройками:
- Анкор ссылки на домашнюю страницу — «Главная»
- Разделитель между ссылками — «»»
- Тег до названия текущей страницы — «<span>» и после — «</span>»
- id главного контейнера <div> — «breadcrumbs», соответственно для настроек стилей можно использовать селектор «#breadcrumbs»
Пример настройки стилей отображения «хлебных крошек» в файле styles.css:
/* breadcrumbs */ #breadcrumbs { font-size:12px; border-top: 1px solid black; border-bottom: 1px solid black; } #breadcrumbs a { text-decoration:none; color: rgb(25, 130, 209); } #breadcrumbs a:hover { color: rgb(0, 0, 0); } #breadcrumbs span { font-weight:bold; }
Если вы хотите задать свои параметры в seorubl_breadcrumbs(), то воспользуйтесь следующим кодом вызова функции:
<?php if (function_exists('seorubl_breadcrumbs')) : $args_crumbs = array( 'id_block' => 'breadcrumbs', 'home' => 'Главная', 'delimiter' => '»', 'before' => '<span>', 'after' =>'</span>'); seorubl_breadcrumbs($args_crumbs); endif; ?>
Значения элементов в массиве можно задавать на своё усмотрение. Часть элементов можно пропустить, тогда они примут стандартные значения, которые описаны выше.
В какие файлы вставлять код вызова функции отображения «хлебных крошек»? Это зависит от шаблона WordPress, установленного на вашем блоге. У меня в теме за вывод отдельных постов отвечает файл content-single.php, я как раз в него вставил код перед выводом заголовка статьи. Также будет полезным вставить подобный код на страницы: category.php, search.php, author.php, archive.php, single.php и т.п.
В любом случае навигация по типу «хлебные крошки» полезна как для поисковиков, так и пользователей, поэтому не стоит ею пренебрегать. «Хлебные крошки» выполняют на блоге следующие функции:
- Дополнительная навигация — положительно сказывается на общем юзабилити сайта и поведенческих факторах пользователей.
- Внутренняя перелинковка — способствует распределению трастового «веса» между страницами блога, повышает качество индексации сайта.
Кроме «хлебных крошек» полезным будет настроить на блоге вывод виджетов: «Последние статьи», «Популярные статьи», «Похожие статьи» и т.п.
Если у вас есть вопросы по теме статьи, то их можно задать в комментариях. Следите за обновлениями. А в следующей статье мы обсудим добавление на блог кнопок-ссылок на социальные профили автора сайта.
Мне кажется, с плагином Breadcrumb NavXT менее хлопотно. Во всяком случае для неопытных пользователей, дабы не на(б)редить в файле functions.php:)
Кому как удобно. Я не люблю ставить лишние плагины. Также с помощью своей функции я могу задать более гибкие настройки. С functions.php, конечно, надо быть аккуратным и держать рабочий файл в запасе, чтобы отменить неаккуратно сделанные изменения.