サイトの直帰率を減らそうキャンペーン第2段w
リニューアルの際にパンくずリストが設定されていないことに今更気づきました。。。
という訳でプラグインの「Breadcrumb NavXT」を導入することになったので、導入方法をご紹介。
「Breadcrumb NavXT」インストール方法
１、管理画面「プラグイン」メニュー→「新規追加」→「Breadcrumb NavXT」を検索→「Breadcrumb NavXT」をインストール・有効化
２、インストール後、「設定」メニューに「Breadcrumb NavXT」が追加されているので、プラグイン設定ページへ移動
３、下記のようなメッセージがでるので、「すぐに移行する。」をクリック。
４、管理画面の設定は３までで終了ですが、パンくずを表示させたい箇所のテンプレートに下記を追加します。
<div class="breadcrumbs">
<?php if(function_exists('bcn_display'))
{
bcn_display();
}?>
</div>
管理画面の「外観」メニューから「テーマ編集」を選択して、該当のテンプレートを修正します。
このプラグインの場合は、
■loop-single.php（投稿ページのテンプレート）
■loop-page.php（固定ページのテンプレート）
■category.php（カテゴリー一覧のテンプレート）
■loop.php（archiveのテンプレート）
といったファイルたちですかね。
これで、各ページに実装完了です。こんな感じに表示されます。
CSSで表示調整
プラグインを実装すると、
<div class="breadcrumbs"></div>
ではきだされます。
という事で、cssで調整します。
文字が大きいので小さくするのと、上下に余白を作りたいので、
.breadcrumbs {
font-size:0.9rem;
margin:10px 0 ;
}
修正後はこんな感じです↓
管理画面プラグインページでの設定
Breadcrumb NavXTのプラグインページに入ると、下のような画面です。
基本的には、そのままでも問題ないとは思いますが、ひとつ気になる箇所が。
トップページの表記が、タイトルを抜粋しているので長いんです。設定を確認すると、ホームページ用テンプレートという項目が、
<a title="%title%へ行く" href="%link%"class="%type%">%htitle%</a>
となっています。「%htitle%」の部分で設定してあるタイトルを読み込んでいるので、これを「ホーム」と変更します。
<a title="%title%へ行く" href="%link%" class="%type%">ホーム</a>
これで設定は全て完了。完成系はこちらです↓
最後に、プラグインをインストールした際に、
Breadcrumb NavXT was just updated from a pre-5.0 version, please go to your plugins page and activate "Breadcrumb NavXT". Also, deactivate "Breadcrumb NavXT 5.0 Migration Compatibility Layer" to make this message disappear.
のようなメッセージが表示されると思います。
これは、「Breadcrumb NavXT」をインストールすると、一緒に「Breadcrumb NavXT 5.0 Migration Compatibility Layer DO NOT ACTIVATE」というプラグインも自動でインストールされます。このインストールを停止すればメッセージも消えます。
