Yoast SEOでパンくずリストを表示する方法【WordPress】
公開日:こんにちは、ゆきまるです。
パンくずリスト(通称breadcrumb)はWebサイトでよく見かけますね。
ユーザーが回遊しやすくなるのはもちろん、Googleの検索結果でもリッチリザルト(リッチスニペット)という形で表示されるようになり、他の検索結果より気を引きやすくなるかもしれません。
今回は、いろいろとSEOの機能が詰まったYoast SEOというWordPressのプラグインで、パンくずリストを表示する方法を紹介します。
Yoast SEOのインストール
プラグインの新規追加で「Yoast SEO」と検索しましょう。さくっとインストールしましょう。
Yoast SEOの設定
有効にする
今回は、パンくずリストに関するもののみ解説します。
管理画面 > SEO > Search Appearance と進むと、上にメニューが出てきます。
その中の右から2番目の「パンくずリスト」をクリックしましょう。
まずは、「パンくずリストを有効にする」を「有効」に変更します。
実は、これだけではまだ表示されませんテンプレートファイルに書き込む必要があるので、後で説明します。
最低限設定すべき項目
有効にすると、項目が出てきます。
最低限設定すべきなのは、以下の3つですかね。
①は、区切りの文字をどうするかです。「>」や「/」など、自由に設定してください。
②は、表示するホームページ(最初のページ)の名前をどうするかです。ブログの名前にしておくのがいいと思ったのでそうしています。
③は、訳すと、
コンテントタイプに応じて、パンくずリストになんのタクソノミーを表示するか
といった感じです。ちょっとわからないと思うので下の画像を見てください。投稿ページにおいて、以下の部分になにを出すか選択できます。
「カテゴリー」を選んでいて、この記事のカテゴリーは「WordPress」なので、「WordPress」という項目が、ホームページ名と投稿ページ名の間に表示されています。
パンくずリストをブログに表示させる
表示させるコード
投稿を表示しているテンプレート(例えばsingle.php)に以下のようなコードを書き足すことで、パンくずリストを表示させることができます。
<?php
if(function_exists( 'yoast_breadcrumb' )){
yoast_breadcrumb( '<p id="breadcrumbs">', '</p>');
}
?>
うまくいかないとき
これで表示されるようになりましたか?
もし表示されない場合は、
- 設定が「有効」になっているか。
- 書き込んだテンプレートはそれであっているか
- 「<?php」や、「?>」などのタグが入れ子になったりしてないか
など一度確認してみてください。
カスタマイズ
p要素とspan要素で構成されているので、そのままでも横並びになっていますが、
CSSで見え方を自分なりに変えてみるといいでしょう。
これらの情報は設定の下部にあるリンク先に詳しく載っています。
構造化データが埋め込まれているか確認
確認する方法
Yoast SEOはJSON-LDの埋め込みも自動でやってくれます。
Googleの以下のツールできちんとできているか確認できます。
上記サイトで、自分のブログのURLを入力して確認してみましょう。検出できていればたぶんオッケーです。
まとめ
今回は、パンくずリストにしか触れていませんが、Yoast SEOは他にもいろいろな機能があります。
構造化データでサイトの情報をサーチエンジンに正しく伝え、正しい評価を得るために、構造化データは大事だなと思いました(小並感)