» » » Расширенные хлебные крошки с элементами микроразметки
logotip

Расширенные хлебные крошки с элементами микроразметки

Всем привет! Около года назад, на seo-mayak.com, я опубликовал статью как сделать хлебные крошки без плагина.

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

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

Я потратил много времени, на поиск оптимального решения, но мои знания PHP, не позволяли мне справиться с поставленной задачей.

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

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

kroshki s mikrorazmetkoi

На заметку! Микроразметка — это семантическая оптимизация сайтов, с применением специализированных стандартов (микроформатов), которые поддерживают все ведущие поисковые системы.

Я сейчас не буду вдаваться в подробности, скажу лишь, что стандартов микроразметки несколько и этой теме я обязательно посвящу отдельную статью.

В данной функции хлебных крошек я использовал микроформат или правильней будет сказать, язык передачи микроданных, который называется — 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:

mikrorazmetka1

Жмем на кнопку «Проверить» и любуемся результатом:

kroshki4

Благодаря микроданным, переданных роботу на языке 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 = ' &raquo; '; 
  $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

Комментарии: 72

  1. Кирилл:

    Здравствуйте, простите так сказать за глупый вопрос, перед установкой хлебных крошек этим способом, старый код нужно удалять?

    Ответить
    • Виталий Кириллов:

      Кирилл, конечно надо удалить!

      Ответить
  2. Кирилл:

    Большое спасибо Виталий, всё сделал по инструкции буквально за пару минут. Да и в целом блог у вас отличный, очень много нужной и полезной информации. Удачи вам и творческих успехов!

    Ответить
  3. ALEX:

    Хорошая статья спасибо. Подскажите а Валидатор сразу должен показывать результат или страницы должны быть проиндексированы? после всех манипуляций?

    Ответить
    • Виталий Кириллов:

      Сразу!

      Ответить
  4. ALEX:

    Жаль, видать для моей темы не подходит ваш «ХАК» 🙂 придется сносить. Будем искать (с).

    Ответить
    • Виталий Кириллов:

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

      Ответить
      • ALEX:

        Спасибо что ответили!
        В Гугл Валидаторе претензий к авторским правам нету, автора он пишет правильно, да и к другой разметке претензий нету, есть одна ошибка но в гугл вебмастер (Отсутствующие заголовки (теги title)) но это претензия к главной странице а не к записям … пока нахожусь в тупике 🙂

        Ответить
  5. Анна:

    Спасибо большое! У меня получилось! Только почему-то в валидаторе google на записях, которые принадлежат дочерним категориям, показываются крошки, а на тех, которые принадлежат обычным категориям — не показываются. Проверила, у вас тоже так же. Это нормально?

    Ответить
    • Виталий Кириллов:

      Анна, у меня категории не участвуют в поиске, а у Вас?

      Ответить
      • Анна:

        У меня категории участвуют в поиске, но я имела в виду немного другое. Например, для вашей записи «Хлебные крошки с микроразметкой», которая принадлежит к категории «Поисковые системы», которая в свою очередь принадлежит к рубрике «Seo-продвижение» в поисковой выдаче Гугл хлебные крошки показываются. А для записи например «Программа для SEO анализа сайта — Site-Auditor. Как определить позиции сайта. Часть №1», которая принадлежит рубрике «Программы и сервисы», которая больше никакой рубрике не принадлежит, хлебные крошки не работают.

        Ответить
        • Виталий Кириллов:

          Не работают где, в валидаторе?

          Ответить
        • Анна:

          И в валидаторе, и в поисковой выдаче проверяла.

          Ответить
          • Виталий Кириллов:

            Анна, так и должно быть. Название статьи находится в заголовке сниппета.

            Ответить
            • Виталик:

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

              Ответить
              • Виталий Кириллов:

                Виталик, я Вас понял, но факт в том что разметка работает. Я конечно посмотрю что можно сделать. А если У вас есть другое (правильное) решение давайте его рассмотрим. Я еще не волшебник в php, а только учусь, поэтому может где есть ошибка. Но вполне допускаю, что Гугл может так отображать крошки в корневых категориях из каких то своих соображений.

                Ответить
                • Виталик:

                  В том-то и дело, что только у Вас и нашел информацию по микроразметке. Поэтому надежда только на Вас.

                  Ответить
                • Виталик:

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

                  Ответить
                  • Виталий Кириллов:

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

                    Ответить
  6. http://ladymsk.com/:

    А у меня не получилось, притом вообще…уже весь инет был перерыт, и прововал плагинами, но увы никак…что делать прямо не знаю…

    Ответить
    • Виталий Кириллов:

      Жаль, что у Вас ничего не выходит.

      Ответить
  7. http://ladymsk.com/:

    Да кстати, обратите внимание: здесь /category/seo-prodvizhenie/poiskovye-sistemy
    крошки не работают

    Ответить
    • Виталий Кириллов:

      Не знаю, у меня все работает!

      Ответить
  8. Виталик:

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

    Ответить
  9. Виталик:

    Поставил на сайт. Хлебные крошки работают все нормально. Но вот валидатор микроразметки Яндекса и Гугла находят очень много ошибок. Видимо, не очень корректно все-таки сделана она. Кстати, решил проверить Ваш сайт, Виталий, думал может только у меня так, а у Вас стоит совсем другая разметка — schema.org

    Ответить
    • Виталий Кириллов:

      Виталик, я работаю над статьей на тему микроразметки, немного терпения! RDF и schema.org могут сосуществовать вместе. А ошибки у Вас вовсе нет от хлебных крошек, так как надо весь сайт размечать! Ждите статьи.

      Ответить
  10. Анастасия:

    Большое спасибо
    Уже установила у себя

    Ответить
  11. Рашида:

    Что-то не получилось у меня с микроразметкой. Хлебные крошки появились — а гугл показывает при проверке тот же результат, что и без них.

    Ответить
  12. сергей:

    а как удалить Главная из хлебных? точнее удалить могу, а вот как убрать радио?

    Ответить
  13. сергей:

    а нет, получилось убрать и то и то

    Ответить
  14. glad:

    Добрый день!
    Автор, подскажи пожалуйста, как исправить код, чтобы он действовал только для записей (single) ? А то выходит что я использую крошки только в них, а подгружается разметка на всех страницах, в том числе и главной. В итоге когда проверяешь заглавную страницу на разметку, выходит коряво все.
    Заранее спасибо за ответ! Очень надеюсь что поможете, так-как не хочется из-за такой мелочи отказываться от вашего решения.

    Ответить
    • Виталий Кириллов:

      Будет время, покапаюсь

      Ответить
  15. Илья:

    Здравствуйте, Виталий.
    Подскажите пожалуйста, ваш код может не срабатывать в валидаторе (т.е. вообще валидатор не видит код крошек и не выдает никаких ошибок) на каких-либо темах вордпресса? Или во всех темах должен работать?
    В моей теме никак не хочет работать — перепроверил всё сто раз.
    Кстати, это может быть, что в моей теме в файл functions.php в самом конце — НЕТ закрывающего знака ?> …!!! Но все функции темы работают безупречно.

    На всякий случай даю ссылку на тему wordpress.org/themes/constructor

    Заранее благодарен за ответ!

    Ответить
  16. Роман llgr:

    Здравствуйте, Виталий.
    Вы считаете RDF актуальны?
    data-vocabulary.org/ нам намекает что с 2011 надо переориентироваться на Schema.org
    Не стоит ли использовать itemtype=»http://schema.org/BreadcrumbList» ?

    Ответить
    • Виталий Кириллов:

      Гугл пока не намекает, а прямо говорит, что RDF поддерживается. Что будет дальше известно только Гуглу с Яндексом, а data-vocabulary.org может только и делать, что намекать)

      Ответить
  17. Dmitry:

    Спасибо за статью, ждём статьи про Notepad++ функцию FTP клиента в нём.

    Ответить
  18. Андрей Курасов:

    Виталий, добрый день.

    1.) Ваш код для css у меня не работает, так как он запрашивает стиль цитаты a, a:hover и т.д., в то время как в css стили к цитатам уже приписаны. В результате хлебные крошки выводятся ровно в том же стиле, что и все другие цитаты сайта. Отдельно изменить их внешний вид через ваш код не получается.

    2.) Некликабельное название статьи в крошках содержится в контейнере , которым закрываются внешний ссылки сайта через ajax по Вашей технологии. В результате скрипт-интерпритатор в футере воспринимает название статьи как цитату и применяет к нему стиль внешних ссылок (для внешних ссылок у меня отдельный стиль css) — название статьи при наводке мыши ведёт себя как ссылка: меняет цвет, подчёркивается — но, разумеется. совершенно не кликается. Однако такое поведение вводит в заблуждение.

    Что Вы можете посоветовать?

    Ответить
    • Виталий Кириллов:

      Андрей, можно использовать !important для установления приоритетов стилей. Прописывается для каждого селектора в отдельности. Например:

      .block-crumbs{
         margin: 5px 25px !important; /* Внешние отступы от блока */
         padding-bottom:5px !important; /* Нижний внутренний отступ от блока */
         border-bottom:2px solid #f2f2f2 !important; /* Черта под блоком */
         color:#215B9B !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] на конце… увидел только когда друг указал… бывает же >_<

                    Спасибо!

                    Ответить
                    • Виталий Кириллов:

                      Ну вот, если долго мучится, все обязательно получится!)

  19. Егор:

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

    Ответить
    • Виталий Кириллов:

      Странно, использую тот же код, но уже в который раз проверяю и все нормально.

      Ответить
      • Егор:

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

        Можно все свои дополнения, шорткоды, ставить не в functions.php, а создать файл
        my-functions.php с содержимым:
        <?php
        /**
        * Plugin Name: Моя альтернатива файлу functions.php
        */

        //Cюда ставим код

        ?>

        И закидываем в папку (как можно догадаться) plugins. Все, активируем из админки, в плагинах.
        Так проще обновлять тему, менять тему.
        Загружается этот файл перед загрузкой functions, да и на скорость совсем не влияет.

        Я хотел спросить: как в валидаторе разметки увидеть как будет выглядеть будущий сниппет? Что-то я там не нашел.

        Ответить
        • Виталий Кириллов:

          Егор, я не обновляю темы, я их сам делаю). Тут каждый сам себе режиссер и наверное для тех, кто пользуется обновлениями, ваш метод весьма актуальный.
          С момента написания статьи интерфейс валидатора Гугла сильно изменился. Наверное теперь надо ждать, пока обновиться сниппет в поиске. Благо у Гугла это происходит сравнительно быстро.

          Ответить
  20. Егор:

    Я тоже начал темы разрабатывать. Дочерние темы не в счет 🙂 Уже несколько сделал c нуля. Сначала HTML-версию, потом натяжка на WP.
    Свою вот разработал с нуля. Все проверки проходит, можно размещать в WP — репозитории. Вот время будет, специально для WP репозитория создам тему, кому понравится с расширенным функционалом сделаю за копейку малую :).

    Ответить
  21. Андрей Курасов:

    Отмечу ещё один неочевидный, но важный момент (обратил внимание сегодня при работе над сайтом)

    Важно! Если Вы закрывали КАТЕГОРИИ от индексации мета-тегом <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) с соответствующими битыми ссылками. Учтите это!

    Ответить
  22. Егор:

    А зачем заморачиваться? Если есть плагин?

    Ответить
    • Андрей Курасов:

      Плагины:
      1.) требуют обновления, могут перестать обновляться
      2.) создают дополнительную нагрузку на сервер
      3.) внедряя код, мы получаем полный контроль над его работой.

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

      Плюс приятное чувство самостоятельно решаемой задачи:)

      Ответить
  23. Егор:

    Я бы поспорил насчет нагрузки. Одинаково. А в остальном бесспорно.

    Ответить
  24. Ксенья Юрьевна:

    Спасибо Виталий, за ваш труд, все понятно написано. Попробую сделать у себя, скопировала в блокнот все коды.

    Ответить
  25. Ксенья Юрьевна:

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

    Ответить
  26. Хваст:

    Вот у меня момент не понятный

    Вот после выполнения этого пункта

    И перед ней вставляем код вызова функции:

    Пропадает содержимое страницы

    Ответить
    • Виталий Кириллов:

      Шаблоны все разные. Вам надо найти код вывода цикла WordPress.

      Ответить
  27. gipnomag:

    Делаю киносайт на WP, крошки настроил, всё работает, но хочется кое что поменять
    Сейчас выводиться вот так к примеру:
    Главная » Вестерны » Помпеи (2014)
    а нужно так:
    Главная » Вестерны » Боевики » Приключения » Помпеи (2014)

    Надо чтоб выводилась не одна рубрика, а все рубрики определенного фильма, если можно, подскажите, как это реализовать?

    Ответить
  28. Евгений:

    Присоединяюсь к вопросу gipnomag. Как вывести полную цепочку рубрик, а не только последнюю?

    Ответить
  29. Akira Tsukizawa:

    Спасибо за код! Всё работает, правда изменил стили.
    Скажите пожалуйста, код добавил в header.php, так как вставка в index и single ломает вёрстку, а шаблон header грузиться на каждой странице, то есть не надо редактировать все файлы…вроде всё работает на отлично, но вот интересно, поисковикам всё равно же где крошки стоят?

    Ответить
    • Виталий Кириллов:

      ПС это совершенно без разницы.

      Ответить
  30. Виталий:

    Здравствуйте! Спасибо за код. Возник такой вопрос. Как можно сделать свой текст вместо заголовка статьи. То есть например заголовок статьи:
    Как сделать хлебные крошки. Вместо заголовка хотелось бы вывести в хлебных крошках свой текст.
    И еще вопрос:
    Можно ли как то сократить по количеству символов хлебные крошки?

    Ответить
  31. Vasya:

    Воспользовался кодом со схемой.орг, спасибо, но с кастомными типами проблема — битая ссылка на тип, а к названию лепиться «mayak_from». Т.е. получается так:

    Главная » Игрушки » mayak_fromРозовый Слон

    Где «Игрушки» — тип поста. И под ними вместо site.ru/igrushki/ генериться site.ru/// (ссылка на морду с тремя слешами)

    Ответить
    • Виталий Кириллов:

      Да, проблема! Надо будет поправить код. Времени совсем нет на блог, не знаю когда руки дойдут.

      Ответить
  32. Юрий:

    Виталий подскажите как убрать «Главная» на главной странице, но так что бы оставить её в крошках при последующих переходах? Спасибо

    Ответить
    • Виталий Кириллов:

      Юрий, просто не выводите крошки на главной странице.

      Ответить
      • Юрий:

        Логичный совет, я в php полный ноль, мне в коде который вы выкладывали «Хлебные крошки с микроразмекой Schema.org» нужно что то менять?

        Ответить
  33. Юрий:

    разобрался, благодарю за оперативный ответ

    Ответить
  34. Андрей:

    Виталий, подскажи пожалуйста ещё в одном вопросе. У меня уровень вложенности на сайте, имеется ввиду не реальный уровень, а показ в строке браузера, максимум второго уровня, промежуточные данные в адресе я удаляю плагином. Что будет если я установлю этот скрипт? К примеру может случиться такое, что в ХК будет путь вида: сайт/категория/статья, а в браузере так: сайт/статья? И вообще, если смысл мне при таком раскладе ставить ХК?

    Ответить

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

Внимание комментатор! Прежде чем вставить: HTML, JavaScript или PHP код в свой комментарий, преобразуй его в html сущность!

Subscribe without commenting

» Подписаться на комментарии по RSS