Вы здесь:   Главная » Вебмастеру    »    «Хлебные крошки» для записей на WordPress

«Хлебные крошки» для записей на WordPress

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

Функция "Хлебных крошек" для записей на WordPress

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

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

Функция "Хлебных крошек" для WordPress без плагина

Самая простая функция «Хлебных крошек»

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

Нижеприведённый код размещаем после строки:

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

но до мета-данных публикации. Функция готова к работе, но вы можете внести собственные изменения.

<div id="crumbs">
Вы здесь: 
<a href="<?php echo get_option('home'); ?>">Главная</a> »
<?php foreach((get_the_category()) as $cat) {
$cat=$cat->cat_ID;
echo(get_category_parents($cat, TRUE, ' » ')); } the_title(); ?>
</div>

Примечание! Перед внесением любых изменений в исходный код шаблона WordPress, рекомендуем делать резервную копию. В данном случае, можно скопировать оригинальный файл «single.php» через FTP доступ к сайту.

Теперь остаётся лишь добавить стили для «хлебных» ссылок. А для этого в коде отвечает идентификатор (id) — “”. Предлагаем свои параметры CSS, которые можно будет отредактировать в соответствии с вашей темой оформления WP.

#crumbs {
width: 100%;
float: left;
margin-bottom: 25px;
color: #999;
font-size: 11px;
}
#crumbs a{
color: #666;
font-size: 11px;
}

После редактирования файлов «single.php» и «style.css» не забываем сохранить изменения. А если у вас появились вопросы в ходе реализации «хлебных крошек», то пишите о них в комментариях. Также будем признательны за собственные наработки.

поделиться с друзьями:

обновлено: 25.10.2017

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

Подписаться на почтовую рассылку*
*политика конфиденциальности Google
Комментарии
  1. Влад
    • Admin

Оставить комментарий

Авторизоваться через: 

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

Ознакомиться с пользовательским соглашением

Сообщить об опечатке

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