【Cocoon(コクーン)】簡単にパンくずリストを設定するやり方

こんにちは、まちゃりさです。

今回は、Cocoonでパンくずリストを表示するやり方について解説していきます。

「パンくずリスト」は、記事の階層を表示するリンクのことです。

私は、このように投稿記事の上に表示させています。

この記事を見れば、Cocoonでパンくずリストを設定する方法を知ることができます。

まちゃりさ

設定は1分ほどで終わります！

それでは、どうぞ！

パンくずリストとは？
パンくずリストを設定した方がいい理由3つ
Cocoonのパンくずリスト設定のやり方
1. 「投稿ページ」のパンくずリストを設定
2. 「固定ページ」のパンくずリストを設定
まとめ：パンくずリストでサイトの使用性を向上！

パンくずリストとは？

ブログサイトの「パンくずリスト」とは、閲覧ユーザー（読者）がWebサイトの中でどの位置(階層)にいるのかを表示するリンクです。

「パンくずリスト」があることで、道に迷うことなく、閲覧中の記事がサイト内のどのカテゴリー階層に位置しているか視覚的にわかります。

実は、「パンくずリスト」の名前の由来は、童話「ヘンゼルとグレーテル」のエピソードに由来します。

主人公は、森の中で迷子になることがないよう、通り道にパンくずを置いていきますよね！

パンくずリストを設定した方がいい理由3つ

パンくずリストを設定するといい理由は次の3つ！

サイト使用性の向上
SEO評価の向上
サイト運営者が管理しやすい

１．サイト使用性の向上

カテゴリリンクを押すだけで、飛びたい場所にすぐに移動できるので、ブログ読者に親切です。

2．SEO評価の向上

Googleのクローラー（※）が、効率良くサイトをチェックすることができます。

※「クローラー」とは、ウェブページ間のリンクをたどることによってウェブサイトを自動的に検出してスキャンするプログラム（ロボットやスパイダーなど）の総称です。

引用：Google クローラの概要（ユーザーエージェント） | Google 検索セントラル | Google Developers

また、「パンくずリスト」はGoogleも推奨しています。

「パンくずリスト」を使用する
パンくずリストとは、ページの上部または下部に表示される内部リンクの行です。訪問者は、パンくずリストを使って、前のセクションやルートページにすばやく戻ることができます。ほとんどのパンくずリストでは、最初の左端のリンクとして最も一般的なページ（通常はルートページ）を置き、右側に向けてより具体的なセクションを並べています。
SEO スターターガイド: 基本 | Google 検索セントラル | Google Developers

サイトのSEO評価が良くなるので、パンくずリストは設定しておくとよいです。

3．サイト運営者が管理しやすい

パンくずリストは、サイト運営者がカテゴリを整理する（見直す）ときにも、役立ちます。

Cocoonのパンくずリスト設定のやり方

Cocoonテーマでは、パンくずリスト機能が標準で搭載されています。

しかし、初期設定ではページの一番下にあり、あまり存在感がありません・・( ;∀;)

上部に移動するのがおすすめです。

まちゃりさ

設定は1分あれば変更できます！

Cocoonのパンくずリスト配置のパターンは次の４種類です

①メインカラム手前
②メインカラムトップ
③メインカラムボトム（デフォルト）
④フッター手前

見え方は、下の画像をご参考にしてください。

①②と③④、それぞれにそれほど違いはありません。

お好みで設定してよいですが、おすすめは、目立つ場所の①メインカラム手前、または②メインカラムトップです！

ここからは、投稿ページ、固定ページのそれぞれで「パンくずリスト」を設定するやり方をご紹介していきます↓

「投稿ページ」のパンくずリストを設定

まずは、投稿ページでパンくずリストを設定するやり方です。

１．WordPress管理画面(ダッシュボード)で[Cocoon設定]をクリックします。

２．上部タブメニューの[投稿]をクリック。

３．下の方にスクロールすると「パンくずリスト設定」があります。

パンくずリスト設定項目は、次の２つです。

（１）パンくずリストの配置
（２）記事タイトル

（１）配置は、先ほどご紹介した4種類から選びます。（①メインカラム手前か②メインカラムトップがおすすめ）

（２）パンくずリストに「記事タイトルを表示するor表示しない」を選択できます。(初期設定は「表示しない」になっています)

記事タイトルを表示する、しない状態のパンくずリストの見え方は、次のような感じです。

［記事タイトルを含める］場合は、「パンくずリストに記事タイトルを含める」にチェックを入れます。

［記事タイトルを含めない］方が、特にスマホでの見た目はスッキリしますが、お好みでOKです。

最後に、[変更をまとめて保存]をクリックするのを忘れずに。

パンくずリストが表示されないときは・・

設定を変更しても、パンくずリストが表示されないのなら、ブラウザのキャッシュを削除して再度更新して確認してみてください。

「固定ページ」のパンくずリストを設定

続いて、固定ページでパンくずリストを設定するやり方です。

１．WordPress管理画面(ダッシュボード)で[Cocoon設定]をクリックします。

２．上部タブメニューの[固定ページ]をクリック。

３．下の方にスクロールするとパンくずリスト設定があります。

投稿ページと同様、表示したいイメージにあわせて設定します。

最後に、[変更をまとめて保存]をクリックするのをお忘れなく！

まとめ：パンくずリストでサイトの使用性を向上！

今回は、WordPressのCocoonテーマで、パンくずリストを表示する手順をご紹介しました。

カテゴリー階層がひと目でわかるので、サイトの使用性を向上できます。

ユーザー、管理者ともにメリットしかない機能です。

ブログサイトを開設した後は、すぐに設定するのをおすすめします。

回遊率アップも期待でき、SEO評価も上がるはず！

それでは、今回はこの辺で。

最後までお読みいただき、ありがとうございました！

おわり。