WEBサイトのSEO対策としてポピュラー手段であるパンくずリスト。
WordPressでパンくずリストを表示する為によく使われるプラグイン、Breadcrumb NavXT。
自動でWordPressのWEBサイトの構造にあったパンくずリストを生成し表示してくれる便利なプラグインです。
しかし、自動で生成する為、思った通りのパンくずリストが表示されない場合もあります。
今回は、そんな時に自由自在に表示をカスタマイズする方法をご紹介いたします。
目次
Breadcrumb NavXTは、WordPressで作成されたサイトにパンくずリストを設置する為のプラグインです。
WordPressのWEBサイトの構造をそのままパンくずリストとして出力してくれるので、一度設定をしてしまえば
現在のWEBサイトの状態に応じてパンくずリストを自動で生成し表示してくれます。
▼関連記事
Breadcrumb NavXTは、WordPressのWEBサイトの構造にあったパンくずリストを自動で生成してくれます。
この自動生成されるパンくずリストは、デフォルトの投稿とカスタム投稿で以下のような違いがあります。
それ以外に、カテゴリやタグの種類毎にテンプレートを設定できます。
アーカイブも、著者アーカイブ、日付アーカイブ、検索アーカイブにそれぞれテンプレートと表示項目が選べます。
この仕様の上であれば、管理画面からの操作でパンくずリストを任意の形に変更出来ます。
しかし、この仕様外のカスタムをしたい場合は専用のカスタマイズが必要になります。
仕様外のカスタムとは以下のような場合です。
Breadcrumb NavXTでパンくずリストをカスタマイズするには用意されたフックを使用する必要があります。
Breadcrumb NavXTのフックは以下の２つになります。
前項で解説したフックを利用する際に関数の引数としてオブジェクトが取得出来ます。
こちらのオブジェクトがパンくずリスト生成用の情報が入っているオブジェクトになります。
ですので、このオブジェクトを書き換える事で画面に表示されるパンくずリストが変更されます。
このオブジェクトの中で画面に表示されるパンくずのデータが入っているのは、trailというオブジェクトの中になります。
こちらのオブジェクト1つに付き1つのパンくずリストの階層情報が格納されており配列として複数の階層が保持されています。
この配列の数がパンくずリストの階層の数となり、配列番号の大きい順にパンくずリストとして表示されます。
trailオブジェクトの中身にはパンくず表示に直接関係する変数があります。
パンくずに表示される文字列
パンくずを表示する際の階層のHTMLタグが記載出来ます。
%%で囲んだ変数が使用でき、trailオブジェクトの内容によって出力を切り替えることが出来ます。
よく使われる変数
パンくずリストにリンクをつける場合の遷移先
階層の種類や、現在表示している項目かどうか、スタイル用の値
trailオブジェクトの値を書き換えるには関数を利用するか、新規にtrailオブジェクトを生成する必要があります。
trailオブジェクトの値を書き換える関数は以下になります。
上記関数で内容を書き換えられますが、既に設定されてしまっているtypeだけは変更出来ない為
typeの内容まで指定しなければならない場合は新規のtrailオブジェクトを作成したほうが良いです。
新規にtrailオブジェクトを生成する場合は以下のように記載します。
$bcnObj->add(new bcn_breadcrumb(設定したいタイトル, null, array('post-clumn-archive'), home_url('post_list/'), null, true));
bcn_breadcrumbの引数
階層の一番上に新しい階層を追加する場合、配列の末尾に新規のtrailオブジェクトを生成する事で新しい階層を追加出来ます。
デフォルト投稿のアーカイブページのパンくずリスト 末尾の階層に投稿一覧という文字を出すサンプルコードになります。
function bcn_add($bcnObj) {
// デフォルト投稿のアーカイブかどうか
if (is_post_type_archive('post')) {
// 新規のtrailオブジェクトを末尾に追加する
$bcnObj->add(new bcn_breadcrumb('投稿一覧', null, array('archive', 'post-clumn-archive', 'current-item')));
// trailオブジェクト0とtrailオブジェクト1の中身を入れ替える
$trail_tmp = clone $bcnObj->trail[1];
$bcnObj->trail[1] = clone $bcnObj->trail[0];
$bcnObj->trail[0] = $trail_tmp;
}
return $bcnObj;
}
add_action('bcn_after_fill', 'bcn_add');
こちらのコードをfunction.phpに記載する事でパンくずリストは以下の様に変更されます。
パンくずリストの階層を中間に追加する場合は該当の箇所のtrailオブジェクトをcloneで複製し、該当箇所に新規のtrailオブジェクトを生成する事で新しい階層を追加出来ます。
デフォルト投稿の詳細ページのパンくずリストの間に投稿一覧を出力しリンクを設定するサンプルコードになります。
function bcn_add($bcnObj) {
// デフォルト投稿の詳細ページかどうか
if (is_singular('post')) {
// 新規のtrailオブジェクトを末尾に追加する
$bcnObj->add(new bcn_breadcrumb('投稿一覧', null, array('post-clumn-archive'), home_url('/post_list'), null, true));
$trail_tmp = clone $bcnObj->trail[1];
$bcnObj->trail[1] = clone $bcnObj->trail[0];
$bcnObj->trail[0] = $trail_tmp;
}
return $bcnObj;
}
add_action('bcn_after_fill', 'bcn_add');
こちらのコードをfunction.phpに記載する事でパンくずリストは以下の様に変更されます。
このコードを応用する事で生成されたパンくずリストを思いのままにカスタマイズする事が出来ます。
Breadcrumb NavXTプラグインはプログラムが苦手な方でもWordPressに簡単にパンくずリストを実装する事ができる便利なプラグインです。
しかし、自動的に動作してくれる便利な機能の為、自分の思ったとおりに動作させなければならない場合に困る事もあるでしょう。
今回のカスタマイズ方法を実践する事で、自身の作成するWEBサイトのパンくずがワンランク上のものになるでしょう。
プラグインは使いこなす事でより効果を発揮すると思います。
受付時間：平日10:00~19:00(土・日・祝日を除く)
