Wordpress, "хлебные крошки": обзор плагинов. Хлебные крошки для WordPress без плагина Как изменить home в хлебных крошках wp

Сегодня я расскажу о плагине для WordPress под народным названием "Хлебные крошки", официальное название Breadcrumb NavXT. Это пожалуй самый востребованный и популярный плагин среди веб мастеров. Его популярность связана с двумя причинами.

Первая причина популярности плагина "Хлебные крошки"

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

Вторая причина востребованности этого плагина

Дополнительная перелинковка страниц, и как следствие + в ранжировании поисковиков. (Собственно, прозвище "Хлебные крошки" произошло от сказки братьев Гримм под названием Гензель и Гретель по сюжете которой дети чтобы не заблудится в лесу бросали хлебные крошки… Но это так, лирическое отступление.) Вернёмся всё же к нашему плагину.

Скачиваем и устанавливаем плагин Breadcrumb NavXT.

Скачать плагин Breadcrumb NavXT лучше всего, найдя его через свою панель управления введя в строке поиска "Breadcrumb NavXT "

Установка обычная ничем не отличается от установки остальных плагинов. А вот с настройками придётся повозиться.

Переходим по вкладке "Параметры"…

… и попадаем в панель настроек плагина Breadcrumb NavXT. В данном случае нас интересует только вкладка"Основные" , все остальные вкладки настроек: "Записи и страницы", "Таксономии", "Другое" , можно оставить пока без изменений. Возможно вам когда то придётся к ним вернуться чтобы более продвинуто настроить Хлебные крошки, но а пока оставляем всё как есть. Ну а настройки вкладки "Основные" изменяем как показано на картинке ниже:

Сохраняем изменения настроек, и на этом здесь все.

Теперь приступаем к самому интересному.

Необходимо отредактировать шаблон вашей темы.

К сожалению без этого никак нельзя. Плагин Breadcrumb NavXT, "просто так" работать не будет.

Переходим в консоль и выбираем «Внешний вид»→«Редактор»:

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

Редактировать необходимо такие шаблоны: single.php, index.php и page.php (если есть специально созданная страница, например, category.php, то и этот тоже)

Выглядит это так:

Сначала выбираем необходимый шаблон. (На данном примере показаны шаблоны имеющиеся в моей теме, у вас их может быть больше или меньше. Редактировать необходимо все что имеются согласно списка: single.php, index.php и page.php, category.php Если какой то из перечисленных шаблонов в вашем списке не отображён, значит просто пропускаем.)

Затем берём код:

И вставляем его в каждом из перечисленных шаблонов примерно в одно и тоже место, после заголовка (header ):

Естественно сохраняем каждый изменённый файл. После чего плагин Breadcrumb NavXT начнёт работать.

Ну вот и всё, почти… Почти, потому что как правило этих настроек вполне достаточно.

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

В этом случае придётся подгонять Хлебные крошки под дизайн сайта отдельно.

Делается это так. Берём этот код:

.breadcrumb {

font:bolder 12px "Trebuchet MS", Verdana, Arial;

padding-bottom: 10px;

}

.breadcrumb a{

color: #1B7499;

} .breadcrumb a:hover {

color: #EF0E0E;

}

Изменяем в нём параметры отображения размера текста, шрифта и цвета на необходимые. Затем копируем изменённый код, идём по вкладке "Таблица стилей" вашей темы

… и вставляем код в самом низу редактора

… сохраняемся, нажав "Обновить файл" Конечно, для получения удовлетворительного результата придётся немного поэкспериментировать.

Ну вот, теперь пожалуй всё.

Привет! Я продолжаю освещать супер полезные плагины для системы wordpress. Сегодня я расскажу и покажу как очень просто и быстро установить на свой сайт wordpress хлебные крошки. Что такое Хлебные крошки? В хлебных крошках показывается путь проделанный вами на сайте, от первой страницы до текущей. Например, вы зашли на сайт на Главную страницу, затем перешлю в рубрику “Хозтовары”, затем открыли запись “Как подоить корову” и т.д.

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

Добавить на свой сайт Хлебные крошки вы сможете с помощью простого плагина – Yummi Хлебные Крошки . Установить данный плагин на свой сайт вы сможете прямо из админ-панели wordpress. Перейдите на страницу: Плагины – Добавить новый , введите название плагина в форму поиска, нажмите Enter, установите и активируйте плагин.

После установки и активации плагина, перейдите на страницу: Настройки – Yummi Хлебные крошки . Здесь вы сможете настроить плагин. Плагин имеет очень простые настройки, с которыми справится да же самый заядлый чайник .

– Тип установки, выберите тип установки. Выберите тип Авто , чтобы хлебные крошки автоматически появились на вашем сайте. Если выберите тип – Ручная , то придётся вставлять код хлебных крошек на сайт вручную.

– Вид Хлебных Крошек, выберите вид хлебных крошек. Можете поэкспериментировать с внешним видом хлебных крошек.

– Имя текущей, выберите показывать ли в ХК имя текущей страницы или записи.

– На Главной странице, показывать или нет ХК на главной странице.

– Подсказки всплывающие, включить или отключить всплывающие подсказки.

– “title=” для ссылок, включить атрибут title для ссылок.

– Текущий шрифт, указан текущий шрифт для ХК.

– Изменить вид Заглавных категорий, можно изменить стиль шрифта для категорий.

– Ваша благодарность, выберите – Спрятать , чтобы ссылка на сайт автора плагина не отображалась на вашем сайте.

– Нажмите на кнопку – Сохранить изменения .

Всем привет!

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

Значение и пример хлебных крошек

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

Хлебные крошки выделены оранжевой рамочкой. Их также называют навигационной цепочкой.

Чаще всего такую цепочку можно найти под шапкой сайта, непосредственно перед заголовком статьи.

Так, посетитель может легко понять, в каком разделе находится статья, которую он просматривает. Общая структура навигации «Хлебные крошки» следующая: Главная страница -> Раздел -> Название статьи . Она может быть усложнена, если, к примеру, в разделе появится подраздел, тогда структура будет такой: Главная страница –> Раздел –> Подраздел –> Название статьи .

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

Хлебные крошки: как сделать на своем блоге?

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

Для начала рассмотрим, как вывести хлебные крошки с php-кодом. Сразу скажу, что ниже будет приведен этот же код, но с элементами микроразметки, советую сразу взять .

Вот образец кода, который нужно вставить в файл functions.php:

1 2 3 4 5 6 7 8 9 10 11 12 13 14

" Pro-wordpress » " term_id ) . ""> " . $categories [ 0 ] -> name . " » " ; } echo " " ; echo the_title() ; echo " " ; }

"; }

Русские названия в коде можно заменить на свои. Например, вместо «Главная» подставить название сайта.

1 2 3 4 5

После этого на вашем сайте должна появиться навигационная цепочка. Однако чтоб получились красивые хлебные крошки, понадобиться внести изменения в файл стилей. Например, чтобы получилось, как на моем блоге, нужно вставить в styles.css такой код:

Breadcrumbs{ margin: -5px 0 5px 3px; /* отступы */ overflow: hidden; } .breadcrumbs a { color: #34a6d2; /* цвет ссылок - голубой */ text-decoration: underline; } .breadcrumb > span { color: #000; /* цвет конечного пункта - черный */ } .breadcrumb{ float:left; }

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

Хлебные крошки на WordPress: плагин

Наиболее распространенные плагины для вывода хлебных крошек: Yoast WordPress Seo, BreadCrumb NavXT. Плагин WordPress SEO by Yoast является многофункциональным и хлебные крошки в его арсенале – лишь малая часть. Поэтому, если данный плагин у вас уже установлен, то вы можете использовать и эту его функцию.

После установки в настройках вы сможете задать вариант пути (рубрики, даты, метки), максимальную длину заголовка, символы между разделами. Кроме того, можно отключить вывод названия страницы, на которой находится посетитель, чтобы не дублировать заголовок статьи. Для того чтобы хлебные крошки отображались на странице, вам опять-таки нужно прописать код в файле single.php или header.php.

1 2 3 4 5 6 7 8

Внести изменения в стили можно по аналогии с тем, как это было описано выше.

Микроразметка хлебных крошек

Мы уже говорили о том, насколько важна . Хлебные крошки в сниппете моего блога выглядят так:

Такой вид более понятен и приятен для пользователя, нежели просто url страницы.

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

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

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

function my_breadcrumb() { echo " Pro-wordpress » " ; $categories = get_the_category() ; if ($categories [ 0 ] ) { echo " term_id ) . "" itemprop="url"> " . $categories [ 0 ] -> name . " » " ; } echo " " ; echo the_title() ; echo " " ; }

function my_breadcrumb() { echo "

"; }

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

Данный код позволяет поисковым системам определить, что это элемент «Хлебные крошки».
Каждый отдельный элемент цепочки обернут в div, содержащий код: itemscope itemtype="https://data-vocabulary.org/Breadcrumb" .

itemprop="url" – определяет значение url, его нужно добавить в каждый тег a

itemprop="title – определяет значение заголовка элемента цепочки

Весь код оборачивается в div с параметром xmlns:v="https://rdf.data-vocabulary.org/#"> , чтобы подключить словарь schema.org.

После добавления кода снова проверьте, распознали ли хлебные крошки Яндекс и Гугл.

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

Напоследок предлагаю посмотреть видео о внутренней перелинковке.

Вы наверняка уже знакомы с понятием «Хлебные крошки» в веб-разработке и возможно даже приходилось реализовывать эти самые «крошки» на WordPress.

(с англ. breadcrumbs) - это элемент навигации по сайту, выглядит как путь от главной страницы до текущей, на которой находится пользователь. Более логичное название - навигационная цепочка . Хлебные крошки называются так по ироничной аналогии со сказкой, в которой дети, когда их завели в лес во второй раз, не смогли найти обратную дорогу, так как на этот раз вместо маленьких камешков они оставляли за собой хлебные крошки, впоследствии склеванные лесными птицами.

Если этот код работает не так как нужно, есть платная версия в виде плагина. Этот код я больше не поддерживаю.

Выглядят «хлебные крошки» так:

Главная страница » Раздел » Подраздел » Текущая страница

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

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

Функция будет показывать «хлебные крошки» для страниц следующих типов:

• Главная страница;
• Постоянная страница;
• Страница любого древовидного типа записи;
• Страница поста;
• Страница вложения (учитывается прикреплено вложение к записи или нет);
• Любой не древовидный тип записи (прикрепленный к любой таксономии, например, к стандартным "рубрикам");
• Страница рубрики;
• Страница меток;
• Страница таксономии (как древовидной, так и одноуровневой (метки));
• Страницы архивов по датам, авторам;
• Страница пагинации для всех типов где предусмотрена пагинация
  (отображается как: Главная » Рубрика » Страница 2,3,4).
• Поддерживает микроразметку. Инструменты для проверки: для Яндекса и для Google .

Из особенностей, которые я не встретил в аналогичных функциях представленных в сети, стоит отметить правильный показ "хлебных крошек" для произвольных типов записей и произвольных таксономий, также в аналогах страница пагинации отображалась как, например, "Рубрика (страница 2)", а не "Рубрика > Страница 2", что, на мой взгляд, неправильно.

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

Также, я старался написать как можно менее прожорливый вариант функции.

Что касается плагина Breadcrumb NavXT , который повсеместно рекомендуется для вывода «хлебных крошек» - он мне не понравился из-за своей громоздкости. Моя функция не хуже, а в чем-то даже лучше: за счет функциональности, компактности и местами быстродействия!

Также функция поддерживает микроразметки: schema.org или RDF, смотрите параметр "markup".

Функция «хлебных крошек» для WordPress

get_crumbs($sep, $l10n, $args); } class Kama_Breadcrumbs { public $arg; // Локализация static $l10n = array("home" => "Главная", "paged" => "Страница %d", "_404" => "Ошибка 404", "search" => "Результаты поиска по запросу - %s", "author" => "Архив автора: %s", "year" => "Архив за %d год", "month" => "Архив за: %s", "day" => "", "attachment" => "Медиа: %s", "tag" => "Записи по метке: %s", "tax_tag" => "%1$s из "%2$s" по тегу: %3$s", // tax_tag выведет: "тип_записи из "название_таксы" по тегу: имя_термина". // Если нужны отдельные холдеры, например только имя термина, пишем так: "записи по тегу: %3$s"); // Параметры по умолчанию static $args = array("on_front_page" => true, // выводить крошки на главной странице "show_post_title" => true, // показывать ли название записи в конце (последний элемент). Для записей, страниц, вложений "show_term_title" => true, // показывать ли название элемента таксономии в конце (последний элемент). Для меток, рубрик и других такс "title_patt" => "%s", // шаблон для последнего заголовка. Если включено: show_post_title или show_term_title "last_sep" => true, // показывать последний разделитель, когда заголовок в конце не отображается "markup" => "schema.org", // "markup" - микроразметка. Может быть: "rdf.data-vocabulary.org", "schema.org", "" - без микроразметки // или можно указать свой массив разметки: // array("wrappatt"=>"", "linkpatt"=>"%s", "sep_after"=>"",) "priority_tax" => array("category"), // приоритетные таксономии, нужно когда запись в нескольких таксах "priority_terms" => array(), // "priority_terms" - приоритетные элементы таксономий, когда запись находится в нескольких элементах одной таксы одновременно. // Например: array("category"=>array(45,"term_name"), "tax_name"=>array(1,2,"name")) // "category" - такса для которой указываются приор. элементы: 45 - ID термина и "term_name" - ярлык. // порядок 45 и "term_name" имеет значение: чем раньше тем важнее. Все указанные термины важнее неуказанных... "nofollow" => false, // добавлять rel=nofollow к ссылкам? // служебные "sep" => "", "linkpatt" => "", "pg_end" => "",); function get_crumbs($sep, $l10n, $args){ global $post, $wp_query, $wp_post_types; self::$args["sep"] = $sep; // Фильтрует дефолты и сливает $loc = (object) array_merge(apply_filters("kama_breadcrumbs_default_loc", self::$l10n), $l10n); $arg = (object) array_merge(apply_filters("kama_breadcrumbs_default_args", self::$args), $args); $arg->sep = "". $arg->sep .""; // дополним // упростим $sep = & $arg->sep; $this->arg = & $arg; // микроразметка --- if(1){ $mark = & $arg->markup; // Разметка по умолчанию if(! $mark) $mark = array("wrappatt" => "", "linkpatt" => "%s", "sep_after" => "",); // rdf elseif($mark === "rdf.data-vocabulary.org") $mark = array("wrappatt" => "", "linkpatt" => "%s", "sep_after" => "", // закрываем span после разделителя!); // schema.org elseif($mark === "schema.org") $mark = array("wrappatt" => "", "linkpatt" => "%s", "sep_after" => "",); elseif(! is_array($mark)) die(__CLASS__ .": "markup" parameter must be array..."); $wrappatt = $mark["wrappatt"]; $arg->linkpatt = $arg->nofollow ? str_replace("sep .= $mark["sep_after"]."\n"; } $linkpatt = $arg->linkpatt; // упростим $q_obj = get_queried_object(); // может это архив пустой таксы? $ptype = null; if(empty($post)){ if(isset($q_obj->taxonomy)) $ptype = & $wp_post_types[ get_taxonomy($q_obj->taxonomy)->object_type ]; } else $ptype = & $wp_post_types[ $post->post_type ]; // paged $arg->pg_end = ""; if(($paged_num = get_query_var("paged")) || ($paged_num = get_query_var("page"))) $arg->pg_end = $sep . sprintf($loc->paged, (int) $paged_num); $pg_end = $arg->pg_end; // упростим $out = ""; if(is_front_page()){ return $arg->on_front_page ? sprintf($wrappatt, ($paged_num ? sprintf($linkpatt, get_home_url(), $loc->home) . $pg_end: $loc->home)) : ""; } // страница записей, когда для главной установлена отдельная страница. elseif(is_home()) { $out = $paged_num ? (sprintf($linkpatt, get_permalink($q_obj), esc_html($q_obj->post_title)) . $pg_end) : esc_html($q_obj->post_title); } elseif(is_404()){ $out = $loc->_404; } elseif(is_search()){ $out = sprintf($loc->search, esc_html($GLOBALS["s"])); } elseif(is_author()){ $tit = sprintf($loc->author, esc_html($q_obj->display_name)); $out = ($paged_num ? sprintf($linkpatt, get_author_posts_url($q_obj->ID, $q_obj->user_nicename) . $pg_end, $tit) : $tit); } elseif(is_year() || is_month() || is_day()){ $y_url = get_year_link($year = get_the_time("Y")); if(is_year()){ $tit = sprintf($loc->year, $year); $out = ($paged_num ? sprintf($linkpatt, $y_url, $tit) . $pg_end: $tit); } // month day else { $y_link = sprintf($linkpatt, $y_url, $year); $m_url = get_month_link($year, get_the_time("m")); if(is_month()){ $tit = sprintf($loc->month, get_the_time("F")); $out = $y_link . $sep . ($paged_num ? sprintf($linkpatt, $m_url, $tit) . $pg_end: $tit); } elseif(is_day()){ $m_link = sprintf($linkpatt, $m_url, get_the_time("F")); $out = $y_link . $sep . $m_link . $sep . get_the_time("l"); } } } // Древовидные записи elseif(is_singular() && $ptype->hierarchical){ $out = $this->_add_title($this->_page_crumbs($post), $post); } // Таксы, плоские записи и вложения else { $term = $q_obj; // таксономии // определяем термин для записей (включая вложения attachments) if(is_singular()){ // изменим $post, чтобы определить термин родителя вложения if(is_attachment() && $post->post_parent){ $save_post = $post; // сохраним $post = get_post($post->post_parent); } // учитывает если вложения прикрепляются к таксам древовидным - все бывает:) $taxonomies = get_object_taxonomies($post->post_type); // оставим только древовидные и публичные, мало ли... $taxonomies = array_intersect($taxonomies, get_taxonomies(array("hierarchical" => true, "public" => true))); if($taxonomies){ // сортируем по приоритету if(! empty($arg->priority_tax)){ usort($taxonomies, function($a,$b)use($arg){ $a_index = array_search($a, $arg->priority_tax); if($a_index === false) $a_index = 9999999; $b_index = array_search($b, $arg->priority_tax); if($b_index === false) $b_index = 9999999; return ($b_index === $a_index) ? 0: ($b_index < $a_index ? 1: -1); // меньше индекс - выше }); } // пробуем получить термины, в порядке приоритета такс foreach($taxonomies as $taxname){ if($terms = get_the_terms($post->ID, $taxname)){ // проверим приоритетные термины для таксы $prior_terms = & $arg->priority_terms[ $taxname ]; if($prior_terms && count($terms) > 2){ foreach((array) $prior_terms as $term_id){ $filter_field = is_numeric($term_id) ? "term_id" : "slug"; $_terms = wp_list_filter($terms, array($filter_field=>$term_id)); if($_terms){ $term = array_shift($_terms); break; } } } else $term = array_shift($terms); break; } } } if(isset($save_post)) $post = $save_post; // вернем обратно (для вложений) } // вывод // все виды записей с терминами или термины if($term && isset($term->term_id)){ $term = apply_filters("kama_breadcrumbs_term", $term); // attachment if(is_attachment()){ if(! $post->post_parent) $out = sprintf($loc->attachment, esc_html($post->post_title)); else { if(! $out = apply_filters("attachment_tax_crumbs", "", $term, $this)){ $_crumbs = $this->_tax_crumbs($term, "self"); $parent_tit = sprintf($linkpatt, get_permalink($post->post_parent), get_the_title($post->post_parent)); $_out = implode($sep, array($_crumbs, $parent_tit)); $out = $this->_add_title($_out, $post); } } } // single elseif(is_single()){ if(! $out = apply_filters("post_tax_crumbs", "", $term, $this)){ $_crumbs = $this->_tax_crumbs($term, "self"); $out = $this->_add_title($_crumbs, $post); } } // не древовидная такса (метки) elseif(! is_taxonomy_hierarchical($term->taxonomy)){ // метка if(is_tag()) $out = $this->_add_title("", $term, sprintf($loc->tag, esc_html($term->name))); // такса elseif(is_tax()){ $post_label = $ptype->labels->name; $tax_label = $GLOBALS["wp_taxonomies"][ $term->taxonomy ]->labels->name; $out = $this->_add_title("", $term, sprintf($loc->tax_tag, $post_label, $tax_label, esc_html($term->name))); } } // древовидная такса (рибрики) else { if(! $out = apply_filters("term_tax_crumbs", "", $term, $this)){ $_crumbs = $this->_tax_crumbs($term, "parent"); $out = $this->_add_title($_crumbs, $term, esc_html($term->name)); } } } // влоежния от записи без терминов elseif(is_attachment()){ $parent = get_post($post->post_parent); $parent_link = sprintf($linkpatt, get_permalink($parent), esc_html($parent->post_title)); $_out = $parent_link; // вложение от записи древовидного типа записи if(is_post_type_hierarchical($parent->post_type)){ $parent_crumbs = $this->_page_crumbs($parent); $_out = implode($sep, array($parent_crumbs, $parent_link)); } $out = $this->_add_title($_out, $post); } // записи без терминов elseif(is_singular()){ $out = $this->_add_title("", $post); } } // замена ссылки на архивную страницу для типа записи $home_after = apply_filters("kama_breadcrumbs_home_after", "", $linkpatt, $sep, $ptype); if("" === $home_after){ // Ссылка на архивную страницу типа записи для: отдельных страниц этого типа; архивов этого типа; таксономий связанных с этим типом. if($ptype && $ptype->has_archive && ! in_array($ptype->name, array("post","page","attachment")) && (is_post_type_archive() || is_singular() || (is_tax() && in_array($term->taxonomy, $ptype->taxonomies)))){ $pt_title = $ptype->labels->name; // первая страница архива типа записи if(is_post_type_archive() && ! $paged_num) $home_after = sprintf($this->arg->title_patt, $pt_title); // singular, paged post_type_archive, tax else{ $home_after = sprintf($linkpatt, get_post_type_archive_link($ptype->name), $pt_title); $home_after .= (($paged_num && ! is_tax()) ? $pg_end: $sep); // пагинация } } } $before_out = sprintf($linkpatt, home_url(), $loc->home) . ($home_after ? $sep.$home_after: ($out ? $sep: "")); $out = apply_filters("kama_breadcrumbs_pre_out", $out, $sep, $loc, $arg); $out = sprintf($wrappatt, $before_out . $out); return apply_filters("kama_breadcrumbs", $out, $sep, $loc, $arg); } function _page_crumbs($post){ $parent = $post->post_parent; $crumbs = array(); while($parent){ $page = get_post($parent); $crumbs = sprintf($this->arg->linkpatt, get_permalink($page), esc_html($page->post_title)); $parent = $page->post_parent; } return implode($this->arg->sep, array_reverse($crumbs)); } function _tax_crumbs($term, $start_from = "self"){ $termlinks = array(); $term_id = ($start_from === "parent") ? $term->parent: $term->term_id; while($term_id){ $term = get_term($term_id, $term->taxonomy); $termlinks = sprintf($this->arg->linkpatt, get_term_link($term), esc_html($term->name)); $term_id = $term->parent; } if($termlinks) return implode($this->arg->sep, array_reverse($termlinks)) /*. $this->arg->sep*/; return ""; } // добалвяет заголовок к переданному тексту, с учетом всех опций. Добавляет разделитель в начало, если надо. function _add_title($add_to, $obj, $term_title = ""){ $arg = & $this->arg; // упростим... $title = $term_title ? $term_title: esc_html($obj->post_title); // $term_title чиститься отдельно, теги моугт быть... $show_title = $term_title ? $arg->show_term_title: $arg->show_post_title; // пагинация if($arg->pg_end){ $link = $term_title ? get_term_link($obj) : get_permalink($obj); $add_to .= ($add_to ? $arg->sep: "") . sprintf($arg->linkpatt, $link, $title) . $arg->pg_end; } // дополняем - ставим sep elseif($add_to){ if($show_title) $add_to .= $arg->sep . sprintf($arg->title_patt, $title); elseif($arg->last_sep) $add_to .= $arg->sep; } // sep будет потом... elseif($show_title) $add_to = sprintf($arg->title_patt, $title); return $add_to; } } /** * Изменения: * 3.3 - новые хуки: attachment_tax_crumbs, post_tax_crumbs, term_tax_crumbs. Позволяют дополнить крошки таксономий. * 3.2 - баг с разделителем, с отключенным "show_term_title". Стабилизировал логику. * 3.1 - баг с esc_html() для заголовка терминов - с тегами получалось криво... * 3.0 - Обернул в класс. Добавил опции: "title_patt", "last_sep". Доработал код. Добавил пагинацию для постов. * 2.5 - ADD: Опция "show_term_title" * 2.4 - Мелкие правки кода * 2.3 - ADD: Страница записей, когда для главной установлена отделенная страница. * 2.2 - ADD: Link to post type archive on taxonomies page * 2.1 - ADD: $sep, $loc, $args params to hooks * 2.0 - ADD: в фильтр "kama_breadcrumbs_home_after" добавлен четвертый аргумент $ptype * 1.9 - ADD: фильтр "kama_breadcrumbs_default_loc" для изменения локализации по умолчанию * 1.8 - FIX: заметки, когда в рубрике нет записей * 1.7 - Улучшена работа с приоритетными таксономиями. */

Вставлять этот код нужно в файл шаблона functions.php или непосредственно в тот файл где вызывается функция.

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

Примеры использование фильтров

#1 Установка параметров через фильтр

Измени дефолтные параметры через фильтр

Add_filter("kama_breadcrumbs_default_args", function($args){ $args["on_front_page"] = 0; $args["show_post_title"] = ""; $args["priority_tax"] = array("mytax"); return $args; });

Если установить параметры при вызове функции в третьем аргументе функции, то они перебьют параметры указанные в фильтре...

#3 Пример перевода крошек на английский

Эти примеры показывают как перевести крошки на нужный язык или просто изменить дефолтные значения:

Вариант 1

При вызове функции нужно указать строки локализации так:

// Локализация if(function_exists("kama_breadcrumbs")){ $myl10n = array("home" => "Front page", "paged" => "Page %d", "_404" => "Error 404", "search" => "Search results by query - %s", "author" => "Author archve: %s", "year" => "Archive by %d год", "month" => "Archive by: %s", "day" => "", "attachment" => "Media: %s", "tag" => "Posts by tag: %s", "tax_tag" => "%1$s from "%2$s" by tag: %3$s", // tax_tag выведет: "тип_записи из "название_таксы" по тегу: имя_термина". // Если нужны отдельные холдеры, например только имя термина, пишем так: "записи по тегу: %3$s"); kama_breadcrumbs(" » ", $myl10n); }

Вариант 2

C версии 1.9. Можно использовать хук kama_breadcrumbs_default_loc , чтобы для каждого вызова одно и тоже не указывать. Для этого рядом с исходным кодом крошек добавьте такой хук:

Add_filter("kama_breadcrumbs_default_loc", function($l10n){ // Локализация return array("home" => "Front page", "paged" => "Page %d", "_404" => "Error 404", "search" => "Search results by query - %s", "author" => "Author archve: %s", "year" => "Archive by %d год", "month" => "Archive by: %s", "day" => "", "attachment" => "Media: %s", "tag" => "Posts by tag: %s", "tax_tag" => "%1$s from "%2$s" by tag: %3$s", // tax_tag выведет: "тип_записи из "название_таксы" по тегу: имя_термина". // Если нужны отдельные холдеры, например только имя термина, пишем так: "записи по тегу: %3$s"); });

Function_exists("kama_breadcrumbs") && kama_breadcrumbs();

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

#3 Добавление произвольной ссылки в начало крошек

Допустим нам нужно добавить после пункта "Главная" ссылку на страницу 7, если в текущий момент мы находимся в категории 5 или в её дочерней категории (учитывается один уровень вложенности).

Для этого добавьте такой хук рядом с кодом крошек:

Add_action("kama_breadcrumbs_home_after", "my_breadcrumbs_home_after", 10, 4); function my_breadcrumbs_home_after($false, $linkpatt, $sep, $ptype){ // если мы в рубрике с ID 5 или в дочерней рубрике, // то дополним начало крошек ссылкой на страницу с ID 7 $qo = get_queried_object(); if(is_category() && ($qo->term_id == 5 || $qo->parent == 5)){ $page = get_post(7); return sprintf($linkpatt, get_permalink($page), $page->post_title) . $sep; } return $false; }

#4 Добавление еще таксономий в крошки

По умолчанию в крошках обрабатывается только одна таксономи. Но иногда нужно несколько, для этого в версии 3.3 я вставил хуки: "attachment_tax_crumbs" , "post_tax_crumbs" , "term_tax_crumbs" .

Допустим, у нас есть тип записи realty и 3 таксы для него: country , type_deal , type_realty . Нужно, чтобы у страницы записи в крошках отображались все таксы в указанном порядке. Также нужно, чтобы на каждой странице таксы указывались все предыдущие таксы и текущая в указанном порядке: country > type_deal > type_realty ...

// apply_filters("term_tax_crumbs", "", $term, $that); add_filter("term_tax_crumbs", "more_tax_crumbs", 10, 3); add_filter("post_tax_crumbs", "more_tax_crumbs", 10, 3); function more_tax_crumbs($empty, $term, $that){ $is_post_filter = doing_filter("post_tax_crumbs"); // else "term_tax_crumbs" if(($is_post_filter && is_singular("realty")) || is_tax("country")){ global $post; $out = ""; $out = $that->_tax_crumbs($term, "self") . $that->arg->sep; // базовая такса - country // тип сделки $term = get_query_var("type_deal"); if($term && ($term = get_term_by("slug", $term, "type_deal"))) $out .= $that->_tax_crumbs($term, "self") . $that->arg->sep; // тип сделки // тип недвижимости $term = get_query_var("type_realty"); if($term && ($term = get_term_by("slug", $term, "type_realty"))){ // запись if($is_post_filter){ $_crumbs = $that->_tax_crumbs($term, "self"); $out .= $that->_add_title($_crumbs, $post); } // такса else { $_crumbs = $that->_tax_crumbs($term, "parent"); $out .= $that->_add_title($_crumbs, $term, esc_html($term->name)); } } return $out; } return $empty; }

Другой вариант крошек

Этот вариант я стянул по ссылке , которую в комментариях дал Master . Весьма занимательное решение, потому и не удержался.

Условно, этот код подойдет не только к WordPress, а вообще к любому движку. Для WordPress он подойдет:

• во-первых, если включены ЧПУ ;
• во-вторых, если в ссылках присутствуют названия категории;
• в-третьих, если названия статей и категорий в УРЛ пишутся в кириллице или это вообще англ. блог.

В других случаях будет работать, но, думаю, как-то не круто получится. Такие условия, потому что этот вариант разбирает ссылку на страницу (УРЛ) и по её элементам создает хлебные крошки. Ссылка разбивается разделителем / .

Допустим у нас УРЛ на статью имеет вид:
http://wptest.ru/рецепты/торт/готовим наполеон
тогда, мы получим цепочку крошек вида:
Главная » Рецепты » Торт » Готовим наполеон

Function breadcrumbs($separator = " » ", $home = "Главная") { $path = array_filter(explode("/", parse_url($_SERVER["REQUEST_URI"], PHP_URL_PATH))); $base_url = ($_SERVER["HTTPS"] ? "https" : "http") . "://" . $_SERVER["HTTP_HOST"] . "/"; $breadcrumbs = array("$home"); $last = end(array_keys($path)); foreach($path as $x => $crumb){ $title = ucwords(str_replace(array(".php", "_"), Array("", " "), $crumb)); if($x != $last){ $breadcrumbs = "".$title.""; } else { $breadcrumbs = $title; } } return implode($separator, $breadcrumbs); }

Используется аналогично моей функции, только на экран выводить надо через echo:

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

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

Зачем крошки и почему без плагина?

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

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

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

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

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

Я, как вы помните (правда не понятно, зачем вам это помнить, но все же), сейчас сижу на от Инфобокса . Замечательная и недорогая штука, но вот чуть больше месяца назад у меня — как будто бы меня вернули к обычному .

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

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

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

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

Использование на больших сайтах (более 1000 сообщений) может привести к падению сайта

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

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

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

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

А для подгона их под дизайн своего блога у вас будет выбор из шести цветовых гамм.

Реализация красивых хлебных крошек для Вордпресс

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

/wp-content/themes/ее название

Вообще, темы Вордпресса я описывал , а точнее рассказывал из каких файлов (шаблонов) они могут состоять и за какие фрагменты макета блога они отвечают. Однако, кроме чисто дизайнерских решений в папке с темой вы найдете и файл functions.php (если его нет, то просто создаете его).

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

Итак, добавляете в этот расчудесный файл следующую функцию:

//Breadcrumb как у Google function the_breadcrumb() { if (!is_home()) { echo "

"; }

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

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

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

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

Но сначала распакуйте архив с фонами и залейте их в папку с вашей темой в имеющуюся там директорию:

/wp-content/themes/папка темы/images

Теперь откройте на редактирование (лучше не в админке Вордпресс, а подключившись к сайту по ФТП) файл со стилями style.css из папки с вашей темой оформления. Можно прямо в его конец добавить следующий код:

#breadcrumb {display:block;float:none;margin:0 0 40px 0;font-weight:600;} #breadcrumb ul {font-family: Helvetica, sans-serif;list-style: none;} .crumbs {display: block;} .crumbs li.first {padding-left: 8px;} .crumbs li a, .crumbs li a:link, .crumbs li a:visited {color: #616d7e;display: block;float: left;font-size: 11px;margin-left: -13px;padding: 7px 17px 11px 25px;position: relative;text-decoration: none;} .crumbs li a {background-image: url(images/bg-crumbs-blue.png);background-position: 100% 0%;background-repeat: no-repeat;position: relative;} .crumbs li a:hover {background-position: 100% -48px;color: #333;cursor: pointer;} .crumbs li a:active {background-position: 100% -96px;color: #333;} .crumbs li.first a span {border-left: 1px solid #d9d9d9;height: 29px;left: 0;position: absolute;top: 0;width: 3px;}

В строке background-image: url (images/bg-crumbs-blue.png) вы вольны будете изменить название графического файла фона на тот, чей цвет больше всего подходит дизайну вашего блога. Про то, как работает , а так же про все его возможные вариации (color, position, image, repeat, attachment). На самом деле жуть, как интересно, ибо открывает массу возможностей.

Вывод крошек в постах Вордпресса и небольшой их тюнинг

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

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

Он (код) будет выглядеть так:

Я не долго думая запихнул его в самом начале, сразу после подгрузки шапки блога: