Всем привет! Около года назад, на seo-mayak.com, я опубликовал статью как сделать хлебные крошки без плагина.
При всех плюсах, а это небольшой объем и простота установки, код имеет ряд минусов. Он не выводит хлебные крошки на страницах с категориями, архивами , метками, на статических страницах WordPrewss и т.д, а действует только на страницах с записями..
В последствии я получал много писем с вопросами, как дополнить код, чтобы исправить вышеописанный недостаток.
Я потратил много времени, на поиск оптимального решения, но мои знания PHP, не позволяли мне справиться с поставленной задачей.
Но время идет и я обучаюсь. Конечно, я не могу сказать, что овладел таким сложным языком, но с помощью образцов, шпаргалок и недюжего терпения, у меня стало кое-что получатся. Не так давно я написал обработчик для формы обратной связи и это был мой первый крупный успех в PHP.
Еще некоторые читатели очень просили добавить в хлебные крошки данные микроразметки. Ну что же, конечно не без труда, но я постарался выполнить и эту просьбу.
На заметку! Микроразметка — это семантическая оптимизация сайтов, с применением специализированных стандартов (микроформатов), которые поддерживают все ведущие поисковые системы.
Я сейчас не буду вдаваться в подробности, скажу лишь, что стандартов микроразметки несколько и этой теме я обязательно посвящу отдельную статью.
В данной функции хлебных крошек я использовал микроформат или правильней будет сказать, язык передачи микроданных, который называется — RDF.
На заметку! RDF расшифровывается, как Resource Description Framework, что в переводе с англ. — среда описания ресурсов. RDF был разработан Консорциумом Всемирной паутины и используется для передачи микроданных на обработку поисковым роботам.
Очень сложно в двух словах дать «человеческое» определение, без отдельной статьи здесь точно не обойтись. А если Вы дочитаете статью до конца, то узнаете, на что влияет микроразметка в хлебных крошках.
Итак, представляю на Ваш суд функцию на PHP, которая способно выводить хлебные крошки, как на страницы с записями, так и на все остальные страницы WordPress. Поехали!
Хлебные крошки с микроразметкой RDF
Для реализации поставленной задачи, в первую очередь нам надо будет открыть для редактирования файл functions.php, что расположен в папке с темой.
При редактировании файлов, советую пользоваться текстовым редактором Notepad++.
Кстати, скоро я планирую продолжить описание возможностей редактора и обязательно расскажу о том, как активировать в Notepad++ функцию FTP клиента, что позволит редактировать файлы прямо на сервере. Так что не примените подписаться на обновления блога.
Итак, открываем файл functions.php и в самый конец, перед знаком ?>, вставляем следующую функцию:
/*** Функция хлебных крошек ***/ function mayak_breadcrumbs_new() { $mayak_home = 'Главная'; // текст ссылки "Главная" $mayak_last_crumb = 1; // 1 - показывать название текущей статьи/страницы/рубрики, 0 - не показывать $mayak_between = ' » '; $mayak_from = '<span class="current-crumbs">'; $mayak_to = '</span>'; global $post; $mayak_link_to_home = home_url('/'); $mayak_from_court = '<span typeof="v:Breadcrumb">'; $mayak_to_court = '</span>'; $mayak_link_rdf = ' rel="v:url" property="v:title"'; $mayak_path = $mayak_from_court . '<a' . $mayak_link_rdf . ' href="%1$s">%2$s</a>' . $mayak_to_court; $mayak_superior = $descendant = $post->post_parent; $mayak_initial_page = get_option('page_on_front'); if (is_home() || is_front_page()) { echo '<div class="block-crumbs"><a href="'. $mayak_link_to_home.'">' . $mayak_home . '</a></div>'; } else { echo '<div class="block-crumbs" xmlns:v="http://rdf.data-vocabulary.org/#">'; { echo '<a href="'. $mayak_link_to_home.'" rel="v:url" property="v:title">' . $mayak_home . '</a>'; if ($mayak_initial_page == 0 || $mayak_superior != $mayak_initial_page) echo $mayak_between; } if ( is_category() ) { $this_category = get_category(get_query_var('cat'), false); if ($this_category->parent != 0) { $category = get_category_parents($this_category->parent, TRUE, ' ' . $mayak_between. ' '); if ($mayak_last_crumb == 1) $category = preg_replace("#^(.+)$mayak_between$#", "$1", $category); $category = str_replace('<a', $mayak_from_court . '<a' . $mayak_link_rdf, $category); $category = str_replace('</a>', '</a>' . $mayak_to_court, $category); echo $category; } if ($mayak_last_crumb == 1) echo $mayak_from. sprintf(' Категория "' . single_cat_title('', false) . '"') .$mayak_to; } elseif ( is_search() ) { echo $mayak_from. sprintf('Результаты поиска для "' . get_search_query() . '"') .$mayak_to; } elseif ( is_day() ) { echo sprintf($mayak_path, get_year_link(get_the_time('Y')), get_the_time('Y')) .$mayak_between; echo sprintf($mayak_path, get_month_link(get_the_time('Y'),get_the_time('m')), get_the_time('F')) .$mayak_between; echo $mayak_from. get_the_time('d') .$mayak_to; } elseif ( is_month() ) { echo sprintf($mayak_path, get_year_link(get_the_time('Y')), get_the_time('Y')) .$mayak_between; echo $mayak_from. get_the_time('F') .$mayak_to; } elseif ( is_year() ) { echo $mayak_from. get_the_time('Y') .$mayak_to; } elseif ( is_single() && !is_attachment() ) { if ( get_post_type() != 'post' ) { $post_specimen = get_post_type_object(get_post_type()); $sleaze = $post_specimen->rewrite; printf($mayak_path, $mayak_link_to_home . '/' . $sleaze['sleaze'] . '/', $post_specimen->labels->singular_name); if ($mayak_last_crumb == 1) echo $mayak_between . $mayak_from . get_the_title() . $mayak_to; } else { $cat = get_the_category(); $cat = $cat[0]; $category = get_category_parents($cat, TRUE, ' ' . $mayak_between . ' '); if ($mayak_last_crumb == 0) $category = preg_replace("#^(.+)$mayak_between$#", "$1", $category); $category = str_replace('<a', $mayak_from_court . '<a' . $mayak_link_rdf, $category); $category = str_replace('</a>', '</a>' . $mayak_to_court, $category); echo $category; if ($mayak_last_crumb == 1) echo $mayak_from. get_the_title() . $mayak_to; } } elseif ( !is_single() && !is_page() && get_post_type() != 'post' && !is_404() ) { $post_specimen = get_post_type_object(get_post_type()); echo $mayak_from. $post_specimen->labels->singular_name . $mayak_to; } elseif ( is_attachment() ) { $superior = get_post($mayak_superior); $cat = get_the_category($superior->ID); $cat = $cat[0]; if ($cat) { $category = get_category_parents($cat, TRUE, ' ' . $mayak_between . ' '); $category = str_replace('<a', $mayak_from_court . '<a' . $mayak_link_rdf, $category); $category = str_replace('</a>', '</a>' . $mayak_to_court, $category); echo $category; } printf($mayak_path, get_permalink($superior), $superior->post_title); if ($mayak_last_crumb == 1) echo $mayak_between . $mayak_from . get_the_title() . $mayak_to; } elseif ( is_page() && !$mayak_superior ) { if ($mayak_last_crumb == 1) echo $mayak_from . get_the_title() . $mayak_to; } elseif ( is_page() && $mayak_superior ) { if ($mayak_superior != $mayak_initial_page) { $breadcrumbs = array(); while ($mayak_superior) { $page = get_page($mayak_superior); if ($mayak_superior != $mayak_initial_page) { $breadcrumbs[] = sprintf($mayak_path, get_permalink($page->ID), get_the_title($page->ID)); } $mayak_superior = $page->post_parent; } $breadcrumbs = array_reverse($breadcrumbs); for ($i = 0; $i < count($breadcrumbs); $i++) { echo $breadcrumbs[$i]; if ($i != count($breadcrumbs)-1) echo $mayak_between; } } if ($mayak_last_crumb == 1) { if ($descendant != 0 && $descendant != $mayak_initial_page) echo $mayak_between; echo $mayak_from. get_the_title() .$mayak_to; } } elseif ( is_tag() ) { echo $mayak_from. sprintf('Записи с меткой "%s"', single_tag_title('', false)) . $mayak_to; } elseif ( is_author() ) { global $author; $userdata = get_userdata($author); echo $mayak_from. sprintf('Записи автора за %s', $userdata->display_name) . $mayak_to; } elseif ( is_404() ) { echo $mayak_from. 'Ошибка 404' . $mayak_to; } elseif ( has_post_format() && !is_singular() ) { echo get_post_format_string(get_post_format() ); } if ( get_query_var('paged') ) { if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ' ('; echo 'Страница ' . get_query_var('paged'); if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ')'; } echo '</div>'; } } /*** Конец функции хлебных крошек ***/
Сохраняем изменения и переходим к следующему этапу.
Код вызова функции хлебных крошек
Далее открываем сразу несколько файлов, которые отвечают за вывод:
‣ записей (single.php),
‣ страниц (page.php)
‣ архивов (archve.php),
‣ рубрик (category.php),
‣ меток (tag.php),
‣ страницы поиска (search.php),
‣ страницы автора (author.php)
А также файл страницы ошибки 404 (404.php).
Если в Вашем шаблоне, отсутствуют некоторые из вышеперечисленных файлов, это нормально! Разные шаблоны имеют разный набор файлов, просто откройте те, которые есть в представленном мной списке.
В открытых файлах ищем что-то похожее на строчку:
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
И перед ней вставляем код вызова функции:
<?php mayak_breadcrumbs_new(); ?>
Поделывает данных процедуру во всех открытых файлах.
Стили для хлебных крошек
В функции я задал два класса. Класс block-crumbs отвечает за стили всего блока хлебных крошек, а класс current-crumbs за стили последней крошки, которая не является ссылкой.
Я подготовил минимальный набор селекторов, для упомянутых классов и постарался им присвоить универсальные значения.
Открываем файл style.css и в самый конец вставляем следующее:
/*** Стили для хлебных крошек ***/ .block-crumbs{ margin: 5px 25px; /* Внешние отступы от блока */ padding-bottom:5px; /* Нижний внутренний отступ от блока */ border-bottom:2px solid #f2f2f2; /* Черта под блоком */ color:#215B9B; /* Цвет ссылок и текста в блоке */ } .block-crumb a:hover,.block-crumb a:active { color:#C6C600; /* Цвет ссылок при наведении и активном состоянии */ } .current-crumbs{ color:#000; /* Цвет текста для последней крошки */ }
Проверяем корректность отображения хлебных крошек на страницах сайта и при необходимости вносим изменения в стили.
Инструмент проверки структурированных данных Google
Теперь нам надо пройти проверку на валидаторе микроразметки Google.
Переходим по ссылке и нам откроется страница, где в вводим в поле URL любой страницы сайта. Я для эксперимента, ввел URL статьи о ЦОП Profit-Partner:
Жмем на кнопку «Проверить» и любуемся результатом:
Благодаря микроданным, переданных роботу на языке RDF, наши хлебные крошки теперь появятся в сниппите результатов поиска.
Хлебные крошки с микроразмекой Schema.org
Время идет и все меняется. Микроразметка, стандарта Schema.org все чаще используется веб-мастерами для разметки своих проектов. Поэтому я решил предложить другой вариант функции mayak_breadcrumbs_new(), где я применил библиотеку http://data-vocabulary.org/Breadcrumb.
/*** Функция хлебных крошек ***/ function mayak_breadcrumbs_new() { $mayak_home = 'Главная'; // текст ссылки "Главная" $mayak_last_crumb = 1; // 1 - показывать название текущей статьи/страницы/рубрики, 0 - не показывать $mayak_between = ' » '; $mayak_from = '<span class="current-crumbs">'; $mayak_to = '</span>'; global $post; $mayak_link_to_home = home_url('/'); $mayak_from_court = '<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">'; $mayak_to_court = '</span>'; $mayak_link_rdf = ' itemprop="url" '; $mayak_path = $mayak_from_court . '<a' . $mayak_link_rdf . ' href="%1$s"><span itemprop="title">%2$s</span></a>' . $mayak_to_court; $mayak_superior = $descendant = $post->post_parent; $mayak_initial_page = get_option('page_on_front'); if (is_home() || is_front_page()) { echo '<div class="block-crumbs" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a' . $mayak_link_rdf . 'href="'. $mayak_link_to_home .'"><span itemprop="title">' . $mayak_home . '</span></a></div>'; } else { echo '<div class="block-crumbs" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">'; { echo '<a' . $mayak_link_rdf . 'href="'. $mayak_link_to_home .'"><span itemprop="title">' . $mayak_home . '</span></a>'; if ($mayak_initial_page == 0 || $mayak_superior != $mayak_initial_page) echo $mayak_between; } if ( is_category() ) { $this_category = get_category(get_query_var('cat'), false); if ($this_category->parent != 0) { $category = get_category_parents($this_category->parent, TRUE, ' ' . $mayak_between . ' '); if ($mayak_last_crumb == 1) $category = preg_replace("#^(.+)$mayak_between$#", "$1", $category); $category = str_replace('<a', $mayak_from_court . '<a' . $mayak_link_rdf, $category); $category = str_replace('</a>', '</a>' . $mayak_to_court, $category); $category = preg_replace('!<a(.*?)>(.*?)</a>!si', '<a\\1><span itemprop="title">\\2</span></a>', $category); echo $category; } if ($mayak_last_crumb == 1) echo $mayak_from. sprintf(' Категория "' . single_cat_title('', false) . '"') . $mayak_to; } elseif ( is_search() ) { echo $mayak_from . sprintf('Результаты поиска для "' . get_search_query() . '"') .$mayak_to; } elseif ( is_day() ) { echo sprintf($mayak_path, get_year_link(get_the_time('Y')), get_the_time('Y')) . $mayak_between; echo sprintf($mayak_path, get_month_link(get_the_time('Y'), get_the_time('m')), get_the_time('F')) . $mayak_between; echo $mayak_from . get_the_time('d') . $mayak_to; } elseif ( is_month() ) { echo sprintf($mayak_path, get_year_link(get_the_time('Y')), get_the_time('Y')) . $mayak_between; echo $mayak_from . get_the_time('F') . $mayak_to; } elseif ( is_year() ) { echo $mayak_from . get_the_time('Y') . $mayak_to; } elseif ( is_single() && !is_attachment() ) { if ( get_post_type() != 'post' ) { $post_specimen = get_post_type_object(get_post_type()); $sleaze = $post_specimen->rewrite; printf($mayak_path, $mayak_link_to_home . '/' . $sleaze['sleaze'] . '/', $post_specimen->labels->singular_name); if ($mayak_last_crumb == 1) echo $mayak_between . $mayak_from . get_the_title() . $mayak_to; } else { $cat = get_the_category(); $cat = $cat[0]; $category = get_category_parents($cat, TRUE, ' ' . $mayak_between . ' '); if ($mayak_last_crumb == 0) $category = preg_replace("#^(.+)$mayak_between$#", "$1", $category); $category = str_replace('<a', $mayak_from_court . '<a' . $mayak_link_rdf, $category); $category = str_replace('</a>', '</a>' . $mayak_to_court, $category); $category = preg_replace('!<a(.*?)>(.*?)</a>!si', '<a\\1><span itemprop="title">\\2</span></a>', $category); echo $category; if ($mayak_last_crumb == 1) echo $mayak_from. get_the_title() . $mayak_to; } } elseif ( !is_single() && !is_page() && get_post_type() != 'post' && !is_404() ) { $post_specimen = get_post_type_object(get_post_type()); echo $mayak_from . $post_specimen->labels->singular_name . $mayak_to; } elseif ( is_attachment() ) { $superior = get_post($mayak_superior); $cat = get_the_category($superior->ID); $cat = $cat[0]; if ($cat) { $category = get_category_parents($cat, TRUE, ' ' . $mayak_between . ' '); $category = str_replace('<a', $mayak_from_court . '<a' . $mayak_link_rdf, $category); $category = str_replace('</a>', '</a>' . $mayak_to_court, $category); $category = preg_replace('!<a(.*?)>(.*?)</a>!si', '<a\\1><span itemprop="title">\\2</span></a>', $category); echo $category; } printf($mayak_path, get_permalink($superior), $superior->post_title); if ($mayak_last_crumb == 1) echo $mayak_between . $mayak_from . get_the_title() . $mayak_to; } elseif ( is_page() && !$mayak_superior ) { if ($mayak_last_crumb == 1) echo $mayak_from . get_the_title() . $mayak_to; } elseif ( is_page() && $mayak_superior ) { if ($mayak_superior != $mayak_initial_page) { $breadcrumbs = array(); while ($mayak_superior) { $page = get_page($mayak_superior); if ($mayak_superior != $mayak_initial_page) { $breadcrumbs[] = sprintf($mayak_path, get_permalink($page->ID), get_the_title($page->ID)); } $mayak_superior = $page->post_parent; } $breadcrumbs = array_reverse($breadcrumbs); for ($i = 0; $i < count($breadcrumbs); $i++) { echo $breadcrumbs[$i]; if ($i != count($breadcrumbs)-1) echo $mayak_between; } } if ($mayak_last_crumb == 1) { if ($descendant != 0 && $descendant != $mayak_initial_page) echo $mayak_between; echo $mayak_from . get_the_title() . $mayak_to; } } elseif ( is_tag() ) { echo $mayak_from . sprintf('Записи с меткой "%s"', single_tag_title('', false)) . $mayak_to; } elseif ( is_author() ) { global $author; $userdata = get_userdata($author); echo $mayak_from . sprintf('Записи автора за %s', $userdata->display_name) . $mayak_to; } elseif ( is_404() ) { echo $mayak_from . 'Ошибка 404' . $mayak_to; } elseif ( has_post_format() && !is_singular() ) { echo get_post_format_string(get_post_format() ); } if ( get_query_var('paged') ) { if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ' ('; echo 'Страница ' . get_query_var('paged'); if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ')'; } echo '</div>'; } } /*** Конец функции хлебных крошек ***/
До встречи!
С уважением, Виталий Кириллов
Статьи по теме:
Микроразметка Schema.org. Пример использования
Микроразметка Schema.org, библиотека Article
Здравствуйте, простите так сказать за глупый вопрос, перед установкой хлебных крошек этим способом, старый код нужно удалять?
Кирилл, конечно надо удалить!
Большое спасибо Виталий, всё сделал по инструкции буквально за пару минут. Да и в целом блог у вас отличный, очень много нужной и полезной информации. Удачи вам и творческих успехов!
Хорошая статья спасибо. Подскажите а Валидатор сразу должен показывать результат или страницы должны быть проиндексированы? после всех манипуляций?
Сразу!
Жаль, видать для моей темы не подходит ваш «ХАК» 🙂 придется сносить. Будем искать (с).
Alex, в исходном коде у Вас разметка встала правильно, возможно надо выполнить другие условия валидатора, например подтверждение авторских прав.
Спасибо что ответили!
В Гугл Валидаторе претензий к авторским правам нету, автора он пишет правильно, да и к другой разметке претензий нету, есть одна ошибка но в гугл вебмастер (Отсутствующие заголовки (теги title)) но это претензия к главной странице а не к записям … пока нахожусь в тупике 🙂
Спасибо большое! У меня получилось! Только почему-то в валидаторе google на записях, которые принадлежат дочерним категориям, показываются крошки, а на тех, которые принадлежат обычным категориям — не показываются. Проверила, у вас тоже так же. Это нормально?
Анна, у меня категории не участвуют в поиске, а у Вас?
У меня категории участвуют в поиске, но я имела в виду немного другое. Например, для вашей записи «Хлебные крошки с микроразметкой», которая принадлежит к категории «Поисковые системы», которая в свою очередь принадлежит к рубрике «Seo-продвижение» в поисковой выдаче Гугл хлебные крошки показываются. А для записи например «Программа для SEO анализа сайта — Site-Auditor. Как определить позиции сайта. Часть №1», которая принадлежит рубрике «Программы и сервисы», которая больше никакой рубрике не принадлежит, хлебные крошки не работают.
Не работают где, в валидаторе?
И в валидаторе, и в поисковой выдаче проверяла.
Анна, так и должно быть. Название статьи находится в заголовке сниппета.
Подтверждаю. В результатах поисковой выдачи не отображаются хлебные крошки в корневых категориях. Во вложенных все работает без проблем. Кстати, у Вас на сайте тоже.
Виталик, я Вас понял, но факт в том что разметка работает. Я конечно посмотрю что можно сделать. А если У вас есть другое (правильное) решение давайте его рассмотрим. Я еще не волшебник в php, а только учусь, поэтому может где есть ошибка. Но вполне допускаю, что Гугл может так отображать крошки в корневых категориях из каких то своих соображений.
В том-то и дело, что только у Вас и нашел информацию по микроразметке. Поэтому надежда только на Вас.
Виталий, скажите пожалуйста, может у Вас уже нашлась минутка для исправления вышеуказанной проблемы с отображением хлебных крошек корневых директорий? Просто очень устраивающий меня вариант. Готов поддержать Вас морально и материально, в случае решения проблемы.
Виталий пока руки не дошли, постараюсь в ближайшее время заняться.
А у меня не получилось, притом вообще…уже весь инет был перерыт, и прововал плагинами, но увы никак…что делать прямо не знаю…
Жаль, что у Вас ничего не выходит.
Да кстати, обратите внимание: здесь /category/seo-prodvizhenie/poiskovye-sistemy
крошки не работают
Не знаю, у меня все работает!
Виталий, искренне спасибо за такую полезную информацию. Про микроразметку в сети до сих пор очень мало информации. А некоторые товарищи предлагают свои услуги за немалые деньги. А здесь все подробно и бесплатно.
Поставил на сайт. Хлебные крошки работают все нормально. Но вот валидатор микроразметки Яндекса и Гугла находят очень много ошибок. Видимо, не очень корректно все-таки сделана она. Кстати, решил проверить Ваш сайт, Виталий, думал может только у меня так, а у Вас стоит совсем другая разметка — schema.org
Виталик, я работаю над статьей на тему микроразметки, немного терпения! RDF и schema.org могут сосуществовать вместе. А ошибки у Вас вовсе нет от хлебных крошек, так как надо весь сайт размечать! Ждите статьи.
Большое спасибо
Уже установила у себя
Что-то не получилось у меня с микроразметкой. Хлебные крошки появились — а гугл показывает при проверке тот же результат, что и без них.
а как удалить Главная из хлебных? точнее удалить могу, а вот как убрать радио?
а нет, получилось убрать и то и то
Добрый день!
Автор, подскажи пожалуйста, как исправить код, чтобы он действовал только для записей (single) ? А то выходит что я использую крошки только в них, а подгружается разметка на всех страницах, в том числе и главной. В итоге когда проверяешь заглавную страницу на разметку, выходит коряво все.
Заранее спасибо за ответ! Очень надеюсь что поможете, так-как не хочется из-за такой мелочи отказываться от вашего решения.
Будет время, покапаюсь
Здравствуйте, Виталий.
Подскажите пожалуйста, ваш код может не срабатывать в валидаторе (т.е. вообще валидатор не видит код крошек и не выдает никаких ошибок) на каких-либо темах вордпресса? Или во всех темах должен работать?
В моей теме никак не хочет работать — перепроверил всё сто раз.
Кстати, это может быть, что в моей теме в файл functions.php в самом конце — НЕТ закрывающего знака ?> …!!! Но все функции темы работают безупречно.
На всякий случай даю ссылку на тему
wordpress.org/themes/constructor
Заранее благодарен за ответ!
Здравствуйте, Виталий.
Вы считаете RDF актуальны?
data-vocabulary.org/
нам намекает что с 2011 надо переориентироваться на Schema.orgНе стоит ли использовать itemtype=»http://schema.org/BreadcrumbList» ?
Гугл пока не намекает, а прямо говорит, что RDF поддерживается. Что будет дальше известно только Гуглу с Яндексом, а data-vocabulary.org может только и делать, что намекать)
Спасибо за статью, ждём статьи про Notepad++ функцию FTP клиента в нём.
/programmy-i-servisy/ftp-klient-notepad.html
Виталий, добрый день.
1.) Ваш код для css у меня не работает, так как он запрашивает стиль цитаты a, a:hover и т.д., в то время как в css стили к цитатам уже приписаны. В результате хлебные крошки выводятся ровно в том же стиле, что и все другие цитаты сайта. Отдельно изменить их внешний вид через ваш код не получается.
2.) Некликабельное название статьи в крошках содержится в контейнере , которым закрываются внешний ссылки сайта через ajax по Вашей технологии. В результате скрипт-интерпритатор в футере воспринимает название статьи как цитату и применяет к нему стиль внешних ссылок (для внешних ссылок у меня отдельный стиль css) — название статьи при наводке мыши ведёт себя как ссылка: меняет цвет, подчёркивается — но, разумеется. совершенно не кликается. Однако такое поведение вводит в заблуждение.
Что Вы можете посоветовать?
Андрей, можно использовать !important для установления приоритетов стилей. Прописывается для каждого селектора в отдельности. Например:
Виталий, всё перепробовал — не работает(
Пример кода:
.block-crumb a, .block-crumb a:visited {color: #000 !important;
text-decoration: underline !important; }
Восклицательные знаки перед «important» чёрные, сам «important» красный, никакие манипуляции со стилями не отображаются в браузере. Кэш чистил, других «!important» в css нет. Причём в крошках при наведении «ГЛАВНАЯ»не подчёркивается при наведении, а «РУБРИКА» подчёркивается, хотя от ссылок к ним должен был перейти только один стиль.
Пока поставил крошки только в статьи, пытаюсь добиться нужного внешнего вида.
Отображение названия статьи в крошках мне удалось визуально превратить в обычный текст стилями так:
.current-crumbs{
color:#000 !important; /* Цвет текста для последней крошки */
text-decoration: none !important; /* убирается подчёркивание при наводе */
cursor:default !important; /* курсор не изменяет вид при наводе */
А вот крошки «Главная» и «Название рубрики» наследуют стиль обычной цитаты <a>крошка</a> и не меняются в css.
Может быть возможно изменить функцию вывода крошек в function.php, чтобы они выводились отдельным специальным стилем цитат (например, вместо <a>крошка</a>, — <a>крошка</a> ) ?
Прошу прощения, так и не научился вставлять код в окно сообщения, чтобы он не обрабатывался браузером.
*Я спрашивал про возможность такой замены: вместо крошка подставлять крошка другого стиля )
Здравствуйте Андрей!
Не думаю, что надо менять стили в функции. Всегда есть выход.
Для «Главной» и «Название рубрик» можно использовать класс .block-crumbs
Вы пробовали использовать данный класс?
Да, конечно. Сейчас в моём css написано так:
.block-crumb a:hover,.block-crumb a:active {
color:#f9369f !important;
text-decoration: underline !important;}
Однако цвет ссылок при наводе курсора не меняется, а сами ссылки не подчёркнуты по-умолчанию. Этот блок игнорируется.
А при попытке работать с самим .block-crumbs{___ , например, записав ему text-decoration: underline , получается подчёркивание всего блока хлебных крошек единой чертой (включая межкрошечные знаки «»» и заголовок статьи), что некрасиво и неудобно для человека.
Андрей, попробуйте поменять классы в функции, возможно это поможет. Думаю Вы без труда их найдете в функции.
Всё, разобрался)
Правильный код крошек для css оказался:
.block-crumbs{
margin: 0px 0px 0px 0px ; /* Внешние отступы от блока */
padding-bottom:5px; /* Нижний внутренний отступ от блока */
border-bottom:2px solid #f2f2f2; /* Черта под блоком */
background:#fff;
color:#000 !important; /* Цвет ссылок и текста в блоке */
text-indent: 1.5em;
font-size: 110%;
}
.block-crumbs a {
text-decoration: underline;
}
.block-crumbs a:hover {
text-decoration: underline;
}
.current-crumbs{
color:#000 !important; /* Цвет текста для последней крошки */
text-decoration: none !important;
cursor:default !important;
}
Сохраняет подчёркивания ссылок с наведением и без
А предыдущий dfhbfyn не работал из-за опечатки в названии — отсутствии[s] на конце… увидел только когда друг указал… бывает же >_<
Спасибо!
Ну вот, если долго мучится, все обязательно получится!)
Спасибо за код крошек, только валидатор ругается, ему нужно активную страницу .сurrent делать ссылкой.
Странно, использую тот же код, но уже в который раз проверяю и все нормально.
Я извиняюсь, были крошки реализованы плагином (он не устраивает так как что-бы микроразметка была правильной в нем нужно последнюю крошку кликабельной делать), когда я ваш код ставил, вместо плагина, не сбросил кеш, перед проверкой.
Можно все свои дополнения, шорткоды, ставить не в functions.php, а создать файл
my-functions.php с содержимым:
<?php
/**
* Plugin Name: Моя альтернатива файлу functions.php
*/
//Cюда ставим код
?>
И закидываем в папку (как можно догадаться) plugins. Все, активируем из админки, в плагинах.
Так проще обновлять тему, менять тему.
Загружается этот файл перед загрузкой functions, да и на скорость совсем не влияет.
Я хотел спросить: как в валидаторе разметки увидеть как будет выглядеть будущий сниппет? Что-то я там не нашел.
Егор, я не обновляю темы, я их сам делаю). Тут каждый сам себе режиссер и наверное для тех, кто пользуется обновлениями, ваш метод весьма актуальный.
С момента написания статьи интерфейс валидатора Гугла сильно изменился. Наверное теперь надо ждать, пока обновиться сниппет в поиске. Благо у Гугла это происходит сравнительно быстро.
Я тоже начал темы разрабатывать. Дочерние темы не в счет 🙂 Уже несколько сделал c нуля. Сначала HTML-версию, потом натяжка на WP.
Свою вот разработал с нуля. Все проверки проходит, можно размещать в WP — репозитории. Вот время будет, специально для WP репозитория создам тему, кому понравится с расширенным функционалом сделаю за копейку малую :).
Отмечу ещё один неочевидный, но важный момент (обратил внимание сегодня при работе над сайтом)
Важно! Если Вы закрывали КАТЕГОРИИ от индексации мета-тегом <meta name="robots" content="noindex,nofollow" />
Код хлебных крошек выводит ссылки на категории в обычном индексируемом виде (можно легко посмотреть в исходном коде). Так что если вы ранее закрыли категории от индексации, то после подстановки крошек статический вес страниц будет утекать на закрытые категории и попросту исчезать в никуда.
Как с этим бороться — каждый решает сам, исходя из юзабилити и seo-дизайна собственного сайта.
Например, у меня были закрыты от индексации рубрики, но открыты метки (тема позволяет использовать на страницах меток и категорий блок «цитата к записи», что защищает от частичных дублей). После установки хлебных крошек я провёл рокировку:
-снял метатег <meta name="robots" со страницы категорий (редактирование в function.php, необходимо убрать is_archive() or is_category() or из функции, описанной в /seo-prodvizhenie/poiskovye-sistemy/meta-teg-robots-indeksaciya-sajta.html ),
-поставил его же на страницу меток (вернул or is_tag() ),
-убрал облако меток (можно было его скрыть по технологии Виталия через ajax, но решил, что облако мне вообще не нужно, появился повод его выбросить ^_^ )
-сами метки (те, которые над/под статьёй) скрыл от индексации через скрипт (/seo-prodvizhenie/tonkosti-prodvizheniya/skvoznye-ssylki.html в комментариях):
/* Hide the tags links */
function llgr_hide_navigation_tags( $llgr_hide_tags ) {
$pum = array ("<a", "/a", "href", );
$bum = array ('<span class="external-reference"', "/span", "data-link");
return str_replace($pum, $bum, $llgr_hide_tags);
}
add_filter( 'the_tags', 'llgr_hide_navigation_tags' );
скрипт:
<script>+function($){$(document).ready(function(){$('.external-reference').replaceWith (function (){return'<a onclick="return !window.open(this.href)" href="'+$(this).data ('link')+'" title="'+$(this).text()+'">'+$(this).html()+'</a>';});
});}(jQuery);</script>
После чего для избегания конфликтов со стилями изменил в коде и в скрипте «external-reference» на выдуманный стиль «47th_tag». В результате дизайн меток остался неизменным (за отсутствием выдуманного стиля в css, как я понимаю), сами метки скрыты в контейнере span, но прекрасно нажимаются и работают
ВАЖНО! Английский ярлык меток (и категорий, если они закрываются скриптом) не должен начинаться на английскую букву «a» (например, answers или avtomobili), поскольку есть баг — в этом случае скрипт воспринимает первую букву a как тег цитаты <a>_____</a> и заменяет a на span (spannswers, spanvtomobili) с соответствующими битыми ссылками. Учтите это!
А зачем заморачиваться? Если есть плагин?
Плагины:
1.) требуют обновления, могут перестать обновляться
2.) создают дополнительную нагрузку на сервер
3.) внедряя код, мы получаем полный контроль над его работой.
А плагин — это такой же кусок кода, только подключаемый отдельно отдельным файлом. И мы ограничены лишь его настройками из админки (так как лезть в само тело плагина — это так же править код).
Плюс приятное чувство самостоятельно решаемой задачи:)
Я бы поспорил насчет нагрузки. Одинаково. А в остальном бесспорно.
Спасибо Виталий, за ваш труд, все понятно написано. Попробую сделать у себя, скопировала в блокнот все коды.
У меня все замечательно получилось, прямо по вашей статье. Еще раз спасибо. Плагин хлебных крошек могу удалить.
Вот у меня момент не понятный
Вот после выполнения этого пункта
И перед ней вставляем код вызова функции:
Пропадает содержимое страницы
Шаблоны все разные. Вам надо найти код вывода цикла WordPress.
Делаю киносайт на WP, крошки настроил, всё работает, но хочется кое что поменять
Сейчас выводиться вот так к примеру:
Главная » Вестерны » Помпеи (2014)
а нужно так:
Главная » Вестерны » Боевики » Приключения » Помпеи (2014)
Надо чтоб выводилась не одна рубрика, а все рубрики определенного фильма, если можно, подскажите, как это реализовать?
Присоединяюсь к вопросу gipnomag. Как вывести полную цепочку рубрик, а не только последнюю?
Спасибо за код! Всё работает, правда изменил стили.
Скажите пожалуйста, код добавил в header.php, так как вставка в index и single ломает вёрстку, а шаблон header грузиться на каждой странице, то есть не надо редактировать все файлы…вроде всё работает на отлично, но вот интересно, поисковикам всё равно же где крошки стоят?
ПС это совершенно без разницы.
Здравствуйте! Спасибо за код. Возник такой вопрос. Как можно сделать свой текст вместо заголовка статьи. То есть например заголовок статьи:
Как сделать хлебные крошки. Вместо заголовка хотелось бы вывести в хлебных крошках свой текст.
И еще вопрос:
Можно ли как то сократить по количеству символов хлебные крошки?
Воспользовался кодом со схемой.орг, спасибо, но с кастомными типами проблема — битая ссылка на тип, а к названию лепиться «mayak_from». Т.е. получается так:
Главная » Игрушки » mayak_fromРозовый Слон
Где «Игрушки» — тип поста. И под ними вместо site.ru/igrushki/ генериться site.ru/// (ссылка на морду с тремя слешами)
Да, проблема! Надо будет поправить код. Времени совсем нет на блог, не знаю когда руки дойдут.
Виталий подскажите как убрать «Главная» на главной странице, но так что бы оставить её в крошках при последующих переходах? Спасибо
Юрий, просто не выводите крошки на главной странице.
Логичный совет, я в php полный ноль, мне в коде который вы выкладывали «Хлебные крошки с микроразмекой Schema.org» нужно что то менять?
разобрался, благодарю за оперативный ответ
Виталий, подскажи пожалуйста ещё в одном вопросе. У меня уровень вложенности на сайте, имеется ввиду не реальный уровень, а показ в строке браузера, максимум второго уровня, промежуточные данные в адресе я удаляю плагином. Что будет если я установлю этот скрипт? К примеру может случиться такое, что в ХК будет путь вида: сайт/категория/статья, а в браузере так: сайт/статья? И вообще, если смысл мне при таком раскладе ставить ХК?