WordPress|パンくずリストのリッチスニペット表示

           
Wordpressでのパンくずリストのリッチスニペット表示について、まとめてみました。

検索結果に表示されるスニペットは、
通常meta descriptionに設定したテキストが表示されますが、
画像やパンくずなど、meta description以外で検索結果に表示されるものを”リッチスニペット”といいます。

リッチスニペットは、構造化データマークアップを行うことによって検索画面に表示させることができ、
構造化データマークアップとは、テキストに対してメタデータを設定していくことで、
これによって検索エンジンのロボットがページの内容や階層をより正確に理解出来ます。

以前は、パンくずのプラグインをしようして、構造化マークアップを行っていましたが、
プラグインのアップデートにより、出来なくなってしまいましたので、
こちらの記事を参考に
パンくずリストを作ってみるとWordPress でのサイト構築のコツがつかめるかもしれない(コード 付き)
構造化マークアップされたパンくずリストを作成しました。

テーマ内fanction.phpに以下を書き込みます。

/** パンくずリスト*/
function breadcrumb(){
global $post;
$str ='';
if(!is_home()&&!is_admin()){ 
$str.= '<ol class="inner">';
$str.= '<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb"><a href="'. home_url() .'" itemprop="url"><span itemprop="title">HOME</span></a>  >  </li>';

if(is_search()){
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title">「'. get_search_query() .'」で検索した結果</span></li>';
} elseif(is_tag()){
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title">タグ : '. single_tag_title( '' , false ). '</span></li>';
} elseif(is_404()){
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title">404 Not found</span></li>';
} elseif(is_date()){
if(get_query_var('day') != 0){
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb"><a href="'. get_year_link(get_query_var('year')). '" itemprop="url"><span itemprop="title">' . get_query_var('year'). '年</span></a>  >  </li>';
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb"><a href="'. get_month_link(get_query_var('year'), get_query_var('monthnum')). '" itemprop="url"><span itemprop="title">'. get_query_var('monthnum') .'月</span></a>  >  </li>';
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title">'. get_query_var('day'). '日</span></li>';
} elseif(get_query_var('monthnum') != 0){
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb"><a href="'. get_year_link(get_query_var('year')) .'" itemprop="url"><span itemprop="title">'. get_query_var('year') .'年</span></a>  >  </li>';
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title">'. get_query_var('monthnum'). '月</span></li>';
} else {
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title">'. get_query_var('year') .'年</span></li>';
}
} elseif(is_category()) {
$cat = get_queried_object();
if($cat -> parent != 0){
$ancestors = array_reverse(get_ancestors( $cat -> cat_ID, 'category' ));
foreach($ancestors as $ancestor){
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><a href="'. get_category_link($ancestor) .'" itemprop="url"><span itemprop="title">'. get_cat_name($ancestor) .'</span></a>  >  </li>';
}
}
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><span itemprop="title">'. $cat -> name . '</span></li>';
} elseif(is_author()){
$str .='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><span itemprop="title">投稿者 : '. get_the_author_meta('display_name', get_query_var('author')).'</span></li>';
} elseif(is_page()){
if($post -> post_parent != 0 ){
$ancestors = array_reverse(get_post_ancestors( $post->ID ));
foreach($ancestors as $ancestor){
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><a href="'. get_permalink($ancestor).'" itemprop="url"><span itemprop="title">'. get_the_title($ancestor) .'</span></a>  >  </li>';
}
}
$str.= '<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><span itemprop="title">'. $post -> post_title .'</span></li>';

} elseif(is_attachment()){
if($post -> post_parent != 0 ){
$str.= '<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><a href="'. get_permalink($post -> post_parent).'" itemprop="url"><span itemprop="title">'. get_the_title($post -> post_parent) .'</span></a>  >  </li>';
}
$str.= '<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><span itemprop="title">' . $post -> post_title . '</span></li>';
} elseif(is_single()){
$categories = get_the_category($post->ID);
$cat = $categories[0];
if($cat -> parent != 0){
$ancestors = array_reverse(get_ancestors( $cat -> cat_ID, 'category' ));
foreach($ancestors as $ancestor){
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><a href="'. get_category_link($ancestor).'" itemprop="url"><span itemprop="title">'. get_cat_name($ancestor). '</span></a>  >  </li>';
}
}
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><a href="'. get_category_link($cat -> term_id). '" itemprop="url"><span itemprop="title">'. $cat-> cat_name . '</span></a>  >  </li>';
$str.= '<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><span itemprop="title">'. $post -> post_title .'</span></li>';
} else{
$str.='<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb" itemprop="url"><span itemprop="title">'. wp_title('', false) .'</span></li>';
}
$str.='</ol>';
}
echo $str;
}


そして、パンくずを表示させたいところに、

<?php breadcrumb(); ?>


このショートコードを書くことで、構造化マークアップされたパンくずが生成されます。

Written by Ishiko.
EDITO DESIGN

2018-05-30

https://edito.jp/blog/diary/160416/