こんにちは！
パンくずリストってサーチコンソールに一覧があるだけでなんとなく設定して終わっていませんか？
cocoonは自動設定になっているのでデフォルトでいいかなと思っていました。
でも実はSEOに効果的な設定方法がありました。
ブロガー目線だと、記事とかコンテンツに注視しちゃってて私自身デフォルトのままでした。
Googleが推奨しているというのはわかっていましたし、Googleアドセンスの審査にパンくずリストを見てエラーがなければそれでOKかなと。
ですが、実はこれ結構重要な意味を持っていたのでした。
パンくずリストとは？
パンくずリスト（Breadcrumbs）とは、ウェブページ上でユーザーに現在のページの位置を示すためのナビゲーション要素のことをいいます。
その名前は、ハンゼンとグレーテルが森の中で道を見失わないようにパンくずを散りばめた童話に由来しています。
ウェブサイトの階層構造をわかりやすく示し、ユーザーがどのページにいるのかを把握するのに役立ちます。
パンくずリストがSEOに及ぼす影響
- パンくずリストは、サイトの中でページ同士をつなぐリンクを提供→検索エンジンがサイト内を効果的に巡回
- ユーザーがサイト内をスムーズに移動できる→サイトの使いやすさが向上
- 検索結果に表示されることもあり、クリックされやすくなる
- サイト内のリンクがうまく調整され、検索エンジンの評価に影響します。
パンくずリストは、ウェブサイトの使いやすさを向上させるだけでなく、検索エンジンでの評価にも影響する大切な要素だったりします。
実は最近、プラグインなどを開発している方から、めっちゃ重要ですよ。
と言われて設定してみたところ、地味ですが検索順位に影響がありました。
cocoonのパンくずリストの設定方法
WordPress パンくずリスト cocoon
cocoonでのパンくずリストの設定方法は意外と簡単です。
ダッシュボード→cocoon設定
WordPress パンくずリスト cocoon
まずはダッシュボードからcocoon設定をクリックします。
次に、cocoon設定のタブの投稿をクリックします。
パンくずリストの設定→変更をまとめて保存
WordPress パンくずリスト cocoon
デフォルトだとメインカラムとなっていますが、
SEO的に効果があるのはメインカラムトップです。
理由としてはGoogleのクローラーが巡回するときに、サイトを視認しやすくなります。
また、「パンくずリストに記事タイトルを含める」にチェックを入れると以下の画像のようになります。
パンくずリストの設定場所→メインカラム手前
WordPress パンくずリスト cocoon
メインカラム手前はこの位置になります。
余白があるのでタイトルが含まれてもあまり気になりません。
SEO的に効果があるのはページ上部にある場合です。
パンくずリストの設定→メインカラムトップ
WordPress パンくずリスト cocoon
タイトルの直上にまできました。
上の余白がいらない人は、メインカラムトップで入れて、タイトルが含まれると気になる場合はチェックを外してもいいかと思います。
こちらがSEO的に効果があります。
パンくずリストの設定→フッター手前
WordPress パンくずリスト cocoon
パンくずリストの位置をフッター手前に設定すると上記の場所、一番下になりました。
cocoonはパンくずリストは色の設定もできる
パンくずリストの色も設定できます。
設定方法はCSSをいじっていきます。
パンくずリストの色の設定
上記のコードでは、breadcrumb クラスがパンくずリスト全体を、item-1、item-2、item-3 クラスがそれぞれ階層ごとのアイテムを示しています。各アイテムの色は、color プロパティを使用して設定されています。
この例を元に、パンくずリストの階層に合わせて適切な色を指定してください。また、具体的なデザインに合わせて余白やフォントサイズなどのスタイルも調整できます。
パンくずリストの貼り付け場所と設定
WordPress パンくずリスト cocoon
貼り付け場所は、
- 外観→カスタマイズ
- 追加CSSをクリック
- コードをコピペ
という流れです。
特に背景色と違うような違和感がある場合にはぜひ設定しておきたいですね。
まとめ
今回は、cocoonでのパンくずリストの設定方法について画像付きで解説していきました。
SEO対策上効果があるのは、ページ上部です。
それでは最後までお読みいただきありがとうございました。
お問い合わせ