ワードプレス(WordPress)のブログサイトにパンくずリストを表示してくれるプラグイン Catch Breadcrumb を解説します。
- Catch Breadcrumbの使い方と詳細な設定方法がわかります
Catch Breadcrumbで実現できること
Catch Breadcrumbプラグインを入れるとブログサイトにパンくずリストを表示することができます。
パンくずリストはWordPressのテーマによっては最初から実装されているので不要ですが、例えばWordPressテーマの「JIN」だとフッター(投稿記事下部)だけにしかパンくずリストを表示してくれません。
そうした場合に Catch Breadcrumb プラグインを使えば記事上部にもパンくずリストを表示させることが可能です。
Catch Breadcrumbを有効化したあと、ウィジェットのブロックにショートコードを記述して利用します。
またはWordPressテーマのheader.phpの最終行にPHPコードを直接記述することもできます。
Catch Breadcrumbのインストール方法
Catch BreadcrumbプラグインをWordPressにインストールする方法を解説します。
WoredPressのダッシュボード(管理者画面)の新規プラグイン追加画面- WordPressのダッシュボード(管理者画面)の「プラグイン」をクリックします
- 「新規追加」をクリックします
- 検索ボックスに”Catch Breadcrumb”と入力すると下に検索結果が表示されます
- ”Catch Breadcrumb”の「今すぐインストール」ボタンをクリックします
“Catch Breadcrumb”のインストール完了画面↑Catch Breadcrumbのインストールが完了すると有効化ボタンが表示されるのでクリックします。
“Catch Breadcrumb”を有効化すると表示される画面これでCatch Breadcrumbのインストールと有効化は完了です。
Catch Breadcrumbの設定と使い方
Catch Breadcrumbの設定画面はダッシュボード(管理画面)にある「Catch Breadcrumb」です。
WordPressのダッシュボード(管理画面)↑Catch Breadcrumbの設定画面はWoredPressのダッシュボード(管理者画面)の「Catch Breadcrumb」をクリックします。
Catch Breadcrumbの設定
Catch Breadcrumbの設定画面にはタブが3つありますが、ダッシュボードの設定しか利用しません。
設定は変更しないで初期設定のままでも大丈夫ですが、パンくずリストを表示させるにはウィジェットにショートコードを貼り付ける必要があります。
設定画面
Catch Breadcrumbの設定画面| 設定項目名 | 意味 |
|---|---|
| コンテンツセレクター(Content Selector) | パンくずリストを表示するセレクタを指定 |
| ブレッドクラムを表示する(Display Breadcrumb) | パンくずリストを表示する位置を選択 Before(前)or After(後) |
| ブレッドクラムセパレーター(Breadcrumb Separator) | 階層の区切り文字を指定 |
| ホームアイコンを有効にする(Enable Home Icon) | ホームアイコンの表示/非表示 |
| ホームページで有効にする(Enable On Home Page) | ブログサイトのトップページにパンくずリストを表示するか否か |
| リセットオプション(Reset Options) | 初期設定に戻す |
ウィジェットにショートコードを設定する方法
Catch Breadcrumbのショートコード[catch-breadcrumb]をウィジェットに指定する方法を解説します。
ダッシュボード(管理画面)の外観 ⇒ ウィジェット ⇒ 記事上部 ⇒ブロックを追加 ⇒ ショートコード ⇒[catch-breadcrumb]を入力 ⇒ 更新ボタンを押して完了です。
ウィジェット画面- ダッシュボード(管理画面)の外観をクリックします
- ウィジェットをクリックします
- 記事上部をクリックします
- ショートコードを選択します
- [catch-breadcrumb]を入力します
- 更新ボタンを押します
以上でウィジェットに Catch Breadcrumbのショートコードを設定する方法は完了です。
パンくずリストを確認
投稿ページの上部に表示されているパンくずリストを確認します。
投稿ページ上部のパンくずリスト↑上のパンくずリストは下記の項目を初期設定から変更しています。
- 一般設定のEnable Home Iconを(無効)から(有効)に変更
パンくずリストに長いタイトル名を表示したくない場合は非表示にできないのが難点です。
Catch Breadcrumbのコードをheader.phpに挿入する方法
Catch Breadcrumbはウィジェットを使う方法が簡単なのでおすすめですが、Wordpressテーマのheader.phpの最終行にコードを挿入することも可能です。
header.phpファイルは下記のディレクトリにあります。
ドメイン名/public_html/wp-content/themes/利用しているテーマ名/
WordPressテーマの header.php の最終行に次のPHPコードを挿入します。
<?php echo do_shortcode( '[catch-breadcrumb]' );?>
まとめ
Catch Breadcrumbは非常に簡単にウィジェットを利用してパンくずリストを投稿記事の上部に表示することができるプラグインです。
おまけにパンくずリストの先頭にホームアイコンの家の絵を設定画面からワンクリックだけで表示することもできます。
有料版があるためプラグイン自体の更新(アップデート)も頻繁にされていてセキュリティの面でも安心できます。
難点は無料版だと文字の色を変更することができないことです。有料版にしないと自分好みにカスタマイズできる幅は限られています。
無料でもっと多機能なパンくずリスト用プラグインのほうが良い場合は「Breadcrumb NavXT」がおすすめです。
「Breadcrumb NavXT」の詳細な情報と設定方法はこちらの記事を参考にしてください↓
Breadcrumb NavXT パンくずリスト表示プラグイン 設定方法と使い方
