2020年1月のある日、サーチコンソールに以下のようなエラーメッセージが…
全く意味が分からないので、とりあえずサーチコンソールで見てみるとこんな感じで「パンくずリスト」という項目に警告ステータスが大量に増加してました↓
「data-vocabulary.org schema deprecated」?
これは一体どういうエラーなんだろう…
【このページのもくじ↓】
パンくずリストの推奨マークアップが2020年4月より変更になるのが原因
まず「data-vocabulary.org schema deprecated」の意味が分からないので調べてみると、どうやらGoogle側でのパンくずリストの推奨が変更されたらしいです。
deprecated=非推奨という意味なので、直訳で「data-vocabulary.org」というschemaが非推奨という事らしい。
例えば自分の警告がきたサイトのパンくずリストのHTMLを見るとこんな感じになってます↓
確かにパンくずリストのHTMLには「data-vocabulary.org」が入っていて、これがGoogle的には非推奨になったという事らしいです。(googleが推奨しているのは「schema.org」というマークアップ)
どうすればいい?パンくずリストのマークアップを「data-vocabulary.org」から推奨マークアップ「schema.org」へ書き換えればOK
という事で原因が分かったので解決方法に。
自分のサイトの警告が出た時点のパンくずリストのHTMLは以下↓
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<ul> <li itemscope itemtype="//data-vocabulary.org/Breadcrumb"> <a href="トップページのURL" itemprop="url"> <i class="fa fa-home"><span itemprop="title">HOME</span> </a> </li> <li itemscope itemtype="//data-vocabulary.org/Breadcrumb"> <a href="カテゴリページのURL" itemprop="url"> <i class="fa fa-home"><span itemprop="title">(カテゴリ名)</span> </a> </li> <li> (記事タイトル) </li> </ul> |
これをGoogle推奨のマークアップである「schema.org」に書き換えるとこんな感じにっぽいです↓
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<ol itemscope itemtype="http://schema.org/BreadcrumbList"> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"> <a href="トップページのURL" itemprop="item"> <i class="fa fa-home"><span itemprop="name">HOME</span> </a> <meta itemprop="position" content="1" /> </li> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"> <a href="カテゴリページのURL" itemprop="item"> <i class="fa fa-home"><span itemprop="name">(カテゴリ名)</span> </a> <meta itemprop="position" content="2" /> </li> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"> (記事タイトル) <meta itemprop="position" content="3" /> </li> </ol> |
まず</ul>ではなく</ol>にするのと、itempropも微妙に違います。
パンくずリストの構造はワードプレスのテーマによって違う可能性があるので、自分の場合はこんな感じに変えてみました。
で、ワードプレスのどこを書き換えればいいのか
自分の場合は「stoak」というワードプレスのテーマを使っているんですが、パンくずリストの記述は「function.php」にあったのでそこを書き換えました。
「外観」>「テーマエディタ」にあるのだが、phpとかよく分からない人はあまり触らない方がいいかも。
一応編集するときは、バックアップを取っておいて、最悪の場合はサーバのFTPから元のコードに戻せばいいと思う。
正直合っているのか自信は無いですが、こんな感じに修正してみましたよ↓
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 |
/********************* パンくずナビ *********************/ if (!function_exists('breadcrumb')) { function breadcrumb($divOption = array("id" => "breadcrumb", "class" => "breadcrumb inner wrap cf")){ global $post; $str =''; if(!get_option('side_options_pannavi')){ if(!is_home()&&!is_front_page()&&!is_admin() ){ $tagAttribute = ''; foreach($divOption as $attrName => $attrValue){ $tagAttribute .= sprintf(' %s="%s"', $attrName, $attrValue); } $str.= '<div'. $tagAttribute .'>'; $str.= '<ol itemscope itemtype="http://schema.org/BreadcrumbList">'; $str.= '<li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a href="'. home_url() .'/" itemprop="item"><i class="fa fa-home"></i><span itemprop="name"> HOME</span></a><meta itemprop="position" content="1" /></li>'; if(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 itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a href="'. get_category_link($ancestor) .'" itemprop="item"><span itemprop="name">'. get_cat_name($ancestor) .'</span></a><meta itemprop="position" content="2" /></li>'; } } $str.='<li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><span itemprop="name">'. $cat -> name . '</span><meta itemprop="position" content="2" /></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 itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a href="'. get_category_link($ancestor).'" itemprop="item"><span itemprop="name">'. get_cat_name($ancestor). '</span></a><meta itemprop="position" content="2" /></li>'; } } $str.='<li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a href="'. get_category_link($cat -> term_id). '" itemprop="item"><span itemprop="name">'. $cat-> cat_name . '</span></a><meta itemprop="position" content="2" /></li>'; $str.= '<li>'. $post -> post_title .'</li><meta itemprop="position" content="3" />'; } elseif(is_page()){ if($post -> post_parent != 0 ){ $ancestors = array_reverse(get_post_ancestors( $post->ID )); foreach($ancestors as $ancestor){ $str.='<li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a href="'. get_permalink($ancestor).'" itemprop="item"><span itemprop="name">'. get_the_title($ancestor) .'</span></a><meta itemprop="position" content="3" /></li>'; } } $str.= '<li>'. $post -> post_title .'</li>'; } elseif(is_date()){ if( is_year() ){ $str.= '<li>' . get_the_time('Y') . '年</li>'; } else if( is_month() ){ $str.= '<li><a href="' . get_year_link(get_the_time('Y')) .'">' . get_the_time('Y') . '年</a></li>'; $str.= '<li>' . get_the_time('n') . '月</li>'; } else if( is_day() ){ $str.= '<li><a href="' . get_year_link(get_the_time('Y')) .'">' . get_the_time('Y') . '年</a></li>'; $str.= '<li><a href="' . get_month_link(get_the_time('Y'),get_the_time('m')) . '">' . get_the_time('n') . '月</a></li>'; $str.= '<li>' . get_the_time('j') . '日</li>'; } if(is_year() && is_month() && is_day() ){ $str.= '<li>' . wp_title('', false) . '</li>'; } } elseif(is_search()) { $str.='<li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><span itemprop="name">「'. get_search_query() .'」で検索した結果</span></li>'; } elseif(is_author()){ $str .='<li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><span itemprop="name">投稿者 : '. get_the_author_meta('display_name', get_query_var('author')).'</span></li>'; } elseif(is_tag()){ $str.='<li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><span itemprop="name">タグ : '. single_tag_title( '' , false ). '</span></li>'; } elseif(is_attachment()){ $str.= '<li><span itemprop="name">'. $post -> post_title .'</span></li>'; } elseif(is_404()){ $str.='<li>ページがみつかりません。</li>'; } else{ $str.='<li></li>'; } $str.='</ol>'; $str.='</div>'; } } echo $str; } } |
一応表示も確認してみたところ、問題なさそう↓
ちゃんと「schema.org」になってますね。
本当に合っているのか確認する事も可能で、サーチコンソールの「パンくずリスト」から「修正を検証」する事ができるみたいです↓
直さないとどんなデメリットが!?
「data-vocabulary.org」マークアップのパンくずリストだと、2020年4月6日から検索結果の表示に影響が出てくるとの事。
なので2020年1月くらいから移行期間としてサーチコンソールで警告している訳です。
検索順位への直接的な影響はないようですが、「検索結果の表示」に影響が出るようです。
ユーザーの行動指数の比重が大きい昨今のアルゴリズムなので、間接的な検索結果への影響は否定できませんね。しっかり修正しておきましょう。
ワードプレスのテーマによってマークアップも違えば、この変更に対しての対応も違いますが、手動で直すならこんな感じでいいのかな?
コメントを残す コメントをキャンセル