Хлебные крошки — это способ навигации, который показывает ваше текущее расположение на сайте и путь, по которому к нему можно попасть, начиная с главной страницы.
В этом уроке расскажу, как сделать правильные хлебные крошки на сайте WordPress без плагинов.
Для того, чтобы добавить хлебные крошки на сайт на WordPress вам не нужен специальный плагин «хлебные крошки», не нужно самому долго и мучительно придумывать как «сделать» хлебные крошки на сайте, играясь с условными тегами WordPress, а достаточно скопировать и вставить эту строчку в то место в шаблоне, куда вам нужно.
true_breadcrumbs();
Понятно, что не спешите сохранять файл (особенно не на тестовом сайте), ведь этой функции у вас сейчас нет и вы столкнётесь с ошибкой 500.
Теперь распишем саму функцию, сразу говорю, готовьтесь, что будет много кода.
Дело в том, что я выкладываю полностью законченный и 100% рабочий вариант. Здесь учтены все типы страниц, которые только могут быть на WordPress: посты, страницы, вложенные страницы(поддерживается любое количество уровней вложенности), рубрики, подрубрики (неограниченное количество вложений), теги, архивы, страницы поиска, страницы с записями какого-либо одного автора.
Также отображается номер текущей страницы, что тоже довольно полезно.
Давайте сначала начнём с относительно несложного варианта хлебных крошек, и чуть ниже в этом же уроке я вам расскажу, как их модифицировать под какую-то свою определённую задачу. Для начала добавьте этот код functions.php
:
function true_breadcrumbs(){ // получаем номер текущей страницы $page_num = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1; $separator = ' / '; // разделяем обычным слэшем, но можете чем угодно другим // если главная страница сайта if( is_front_page() ){ if( $page_num > 1 ) { echo '<a href="' . site_url() . '">Главная</a>' . $separator . $page_num . '-я страница'; } else { echo 'Вы находитесь на главной странице'; } } else { // не главная echo '<a href="' . site_url() . '">Главная</a>' . $separator; if( is_single() ){ // записи the_category( ', ' ); echo $separator; the_title(); } elseif ( is_page() ){ // страницы WordPress the_title(); } elseif ( is_category() ) { single_cat_title(); } elseif( is_tag() ) { single_tag_title(); } elseif ( is_day() ) { // архивы (по дням) echo '<a href="' . get_year_link( get_the_time( 'Y' ) ) . '">' . get_the_time( 'Y' ) . '</a>' . $separator; echo '<a href="' . get_month_link( get_the_time( 'Y' ), get_the_time( 'm' ) ) . '">' . get_the_time( 'F' ) . '</a>' . $separator; echo get_the_time('d'); } elseif ( is_month() ) { // архивы (по месяцам) echo '<a href="' . get_year_link( get_the_time( 'Y' ) ) . '">' . get_the_time( 'Y' ) . '</a>' . $separator; echo get_the_time('F'); } elseif ( is_year() ) { // архивы (по годам) echo get_the_time( 'Y' ); } elseif ( is_author() ) { // архивы по авторам global $author; $userdata = get_userdata( $author ); echo 'Опубликовал(а) ' . $userdata->display_name; } elseif ( is_404() ) { // если страницы не существует echo 'Ошибка 404'; } if ( $page_num > 1 ) { // номер текущей страницы echo ' (' . $page_num . '-я страница)'; } } }
4
– при помощи get_query_var() мы определяем, находимся ли мы на странице постраничной навигации, знаю, что это можно сделать при помощи is_paged(), но нам же ведь ещё и номер страницы понадобится.6
– разделитесь между ссылками в хлебных я решил записать в переменную, вы можете использовать что угодно, например стрелки → →
, запись его в переменную позволит нам быстро его поменять, если захотим.9
– функция, а точнее условный тег is_front_page() возвращает true
, если мы находимся на главной странице, вне зависимости от того, какую роль она выполняет.12
, 19
– функция site_url() динамически возвращает ссылку на главную страницу сайта.25
– я использовал функцию the_category() для вывода списка рубрик для текущей записи через запятую. Обратите внимание, что эта функция не распределяет рубрики в зависимости от их иерархии. О том, как вывести их с соблюдением порядка иерархии, читайте ниже.25
, 29
– функция the_title() отлично подходит для того, чтобы вывести заголовок текущей записи, страницы или записи произвольного типа.Возможно вы заметили, что Страницы WordPress – это иерархичный тип записи, другими словами – Страница может иметь дочерние страницы, причем несколько штук и нескольких уровней.
Это можно хорошо наблюдать в метабоксе Атрибуты страницы:
Если вы планируете отображать в своих хлебных крошках родительские страницы тоже, то вам нужно немного модифицировать соответствующие строчки в коде выше:
global $post; // если у текущей страницы существует родительская if ( $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; } echo join( $separator, array_reverse( $breadcrumbs ) ) . $separator; }
То есть вставляете этот код на 27-й строчке ничего не удаляя из первоначального кода.
Тут ситуация похожа на ситуацию со страницами, но проще, так как существует функция get_category_parents().
$current_cat = get_queried_object(); // если родительская рубрика существует if( $current_cat->parent ) { echo get_category_parents( $current_cat->parent, true, $separator ) . $separator; }
Как я уже написал выше, наша функция the_category() не справляется с тем, чтобы вывести рубрики с учетом их иерархичности. Давайте попробуем разобраться, что с этим можно поделать.
Тут есть некоторые тонкости, но смотрите, есть очень классный способ, как можно это всё разрулить!
Прежде всего, обратите внимание, как вы добавляете пост в категории. Нам подходит:
Не подходит:
После этого можно спокойно использовать функцию get_category_parents():
$post_categories = get_the_category(); // это и будет наша единственная рубрика, присвоенная к посту if( ! empty( $post_categories[0]->cat_ID ) ) { echo get_category_parents( $post_categories[0]->cat_ID, true, $separator ) . $separator; } the_title();
На самом деле тут всё максимально похоже на код, который мы использовали для рубрик/меток и записей/страниц.
Если без иерархии:
if( is_tax( $taxonomy_name ) ) { single_term_title(); // название текущего элемента таксономии }
С иерархией:
if( is_tax( $taxonomy_name ) ) { $current_term = get_queried_object(); // если родительский элемент таксономии существует if( $current_term->parent ) { echo get_term_parents_list( $current_term->parent, $taxonomy_name, array( 'separator' => $separator ) ) . $separator; } single_term_title(); }
Если мы вообще не хотим отображать никаких таксономий, то наш пример становится очень похож на пример с обычными Страницами:
if( is_singular( $post_type_name ) ) { the_title(); }
В случае, если нам нужно также добавить какую-то произвольную таксономию:
if( is_singular( $post_type_name ) ) { $post_terms = get_the_terms( get_the_ID(), $taxonomy_name ); if( ! empty( $post_terms[0]->term_id ) ) { echo get_term_parents_list( $post_terms[0]->term_id, $taxonomy_name, array( 'separator' => $separator ) ) . $separator; } the_title(); }
Кстати, видел на других блогах функцию хлебных крошек длиной в 5-10 строк :) Люди копипастят даже не задумываясь, понятно, что у них очень урезанные варианты.
Чтобы оставить комментарий, пожалуйста, зарегистрируйтесь или войдите.
реально, это самая полная версия крошек из всех, которые я видел на других сайтах! Спасибо :)
Михаил, прочитала ваш блог "от корки до корки".
У вас не только талант в программировании, но и явный преподавательский талант.
Все, даже сложные вещи, вы описываете просто и понятно.
Я читала и восторгалась - не верится, что вам всего 20 лет.
Какой вы умница!
Нашла на вашем блоге несколько полезных рецептов.
Спасибо!
Спасибо) приятно)
Миша, предлагаю тему для статьи в категорию Юзабилити:
Как выводить похожие записи в сайдбар по заголовку с миниатюрами без плагина(вообще сможете такое реализовать?).
Имхо многим пригодится.
хорошо, буду иметь ввиду)
и еще имейте ввиду) хотелось бы увидеть побольше статей о похожих записях(чтобы были статические они).
Вам же надо наполнять кат. "Юзабилити" :)
С нетерпением жду. Спасибо
п.с. когда заглянуть?
кат юзабилити скоро удалю на самом деле)
загляни в течение недели)
куда тогда(заглянуть в кат. WordPress)?
Очень бы хотелось, увидеть статью с оригинальным выводом "похожих записей"(видно что можешь:))
если ты подписался на обновления, то её не пропустишь)
Доброе время суток!
Все отлично, но по этим ссылкам из хлебных крошек, вес уходит со страницы. Не подскажите, как ссылки закрыть в нофолов, чтобы вес не терялся, а все крошки в ноиндекс, чтобы не было переспама, так как в крошках идет повторение текста заголовка записи?
Добрый день,
ajax
здравствуйте, хорошая работа, спасибо,
подскажите, пжл как можно подгрузить хлебные крошки через ajax - как делаю, добавил ваш код в functions.php и создал новый файл и создал новую страницу где применил этот шаблон, но получилось что я через аякс просто на просто подтягиваю те хлебные крошки к которым относится созданный шаблон, то есть на всех страницах у меня получаются хлебные крошки
Главная -> Ajax - the_breadcrumb
Добрый день!
про ajax в WorPress можно почитать здесь truemisha.ru/blog/wordpress/admin-ajax.html
если всё равно ничего не будет получаться, обращайтесь.
удалось реализовать?
Вот я и "доросла" до "хлебных крошек"... Установила себе их на сайт твоим, Миша, способом. Перепробовала всё, но хотела без плагина и попроще в настройках. Твой вариант действительно РАБОТАЕТ на 100%. Спасибо тебе, огромное. Только вот хотела спросить: твой сайт в поиске Гугл выводится так: сайт > блог > категория. А у меня тоже так будет? Просто я проверила у меня выводится одна ссылка, не видно "крошек". Может просто должно пройти время, чтобы Гугл это заметил?
увы, эти хлебные крошки не дадут такого результата,
тем не менее, это хороший повод доработать статью, спасибо.
Буду с нетерпением ждать такой "обновки"!!! Читаю все новые статьи и возвращаюсь к прежним. Хотя многого ещё не понимаю... (((
Со временем обязательно во всём разберётесь :) Желаю удачи!
Отпишусь после обновления поста.
Автору большое спасибо. Но опять возникает вопрос по скрытию через АЯКС - вывод работает, но страница определяется совершенно неправильно :(
Если комуто удалось решить эту проблему буду премного благодарен
Почему то возникла проблема , не работает, отображает так:
Главная » Ремонт ПК » Ремонт компьютера
Вместо стрелочек отображает
Вероятно у вас заменилось
на
Я извиняюсь, а в чем смысл echo у the_title() на 22 строчке ?
😁😁😁
Первоначальная дата публикации поста – 2011-й год, надо будет полностью обновить его
Спасибо за рабочий код)!
И за твой проект!
Пожалуйста! 🙃
Спасибо за рабочий код!
у меня возник вопрос: сайт на вордпресс. структура рубрик идет гл.рубрика - подкатегория 1ур- подкатегория А 2 ур и подкатегория В 2 ур. И я имею ситуацию что у товара1 хлебные крошки собираются в правильном порядке: гл.рубрика - подкатегория 1ур- подкатегория А 2 ур, а у товара2 в неверном: гл.рубрика - подкатегория В 2 ур - подкатегория 1 ур.
С помощью плагина я изменила иерархию рубрик, но проблема не решилась. в чем проблема? возможно поможете с решением?
Пожалуйста!
Та функция, которую мы здесь используем для вывода категорий – the_category() – не умеет определять, какая рубрики главная, а какая нет 🙂
Подскажите какая функция мне поможет решить проблему, буду очень благодарна Вам!
Кастомная к сожалению. Я немного допилю на этой неделе этот пост про хлебные крошки.
Если вам удобно подождать пару дней 🙃
О, подожду) Было бы просто замечательно!
Ну супер тогда! :)
Обновил!
Спасибо за обновление! К сожалению моя проблема с функцией the_category() так и осталась актуальной, и используется именно несколько категорий и подкатегорий у записей, т.е. путь по иерархии категорий полный
вот моя жалкая попытка переписать код..
А так вы сделайте, чтобы была отмечена только подкатегория 🙃
к сожалению, так не подходит :((
Тогда вам нужно получить все категории через get_the_category(), определить через цикл, какая из них сааамая дочерняя, и потом можно использовать мой код. Это самый несложный вариант мне кажется.
Другой вариант – несколько раз прогонять результат через массив с разными проверками.
ох, не выходит у меня совсем( уже сегодня и вчера весь день.
результаты: могу вывести гл.рубрику+подрубрику1уровня+название, а надо гл.рубрика+подрубрика1уровня+подрубрика2уровня+название.
по вашему коду неверно по иерархии попадают рубрики: гл.рубрика+подрубрика2уровня+подрубрика1уровня+название
спасите пожалуйста
Аня, очень вам сочувствую! ... Тоже через это проходил..
Пожалуйста, не сдавайтесь, и я гарантирую, у вас всё получится! Это самое главное в такие моменты. 💪
Попробуйте сходить в душ или, если есть возможность, в басик, это кстати реально освежает моск.
Добавлю также, что вы очень многим людям поможете, если скинете свой получившийся рабочий код в комментарии. Ну а я постараюсь подкорректировать, если в нём что-то будет не так.
Благодарю за поддержку, все таки удалось разобраться.
Суть проблемы - нарушена иерархия рубрик в хлебных крошках.
Иерархия выставляется по параметру term_order, а мы множество раз тасовали иерархию рубрик, и они все намешались, а параметр принадлежности иерархии term_order как был присвоен при создании 0-1-2-3-4.. 8.. и тп, так и остается. Ни один из плагинов настройки иерархии эту проблему не смог решить.
Решение: в файлах базы данных выставить правильно параметр term_order у рубрик. Думаю если намешана иерархия у таксономий - это также поможет.
чем дело с кодом закончилось? вот что остается у нас:
Спасибо большое за ваш комментарий! 🙏
Спасибо огромное за полезную информацию. Пригодилось для работы
Может Вы бы подсказали , как присвоить классы ссылкам, которые формируются при добавлении "хлебных крошек"? На странице несколько тегов , в том числе и "хлебные крошки", когда хочешь изменить стиль одной меняются все. Заранее благодарю.
Огромное спасибо за код! Есть вопрос. В последнем примере кода (стр.28) в первом аргументе get_term_parents_list наверное надо добавить [0] к $post_terms (то есть $post_terms[0]->term_id). Верно? Потому что у меня этот фикс убрал ошибку для бредкрамба сингл поста кастомного типа со своей таксономией.
Я прям тащусь!!! Спасибо огромное за хлебные крошки!
Еее 🔥