この記事は約 2 分で読めます。
Webサイトで複数ページを閲覧してもらうとき、どこの階層のページにいるのかをパッと理解できる「パンクズリスト」を設置していると親切です。
「WordPress」サイトで、パンくずリストを簡単に設置できるプラグイン「Breadcrumb NavXT」を使用してみました。
設置方法をメモします。
「Breadcrumb NavXT」設置手順
- プラグイン「Breadcrumb NavXT」を追加する
- page.phpなど、パンクズを表示したい部分にコードを追加
- cssで見た目を整える
1.プラグイン「Breadcrumb NavXT」を追加する
WordPressの管理画面から「Breadcrumb NavXT」で検索して、プラグインを追加します。
Breadcrumbの設定画面
ほとんどデフォルトの状態で大丈夫そうですが、私は「パンくずの区切り」の部分と「ホームページパンくず」の部分を少し変更しました。
2.page.phpなど、パンクズを表示したい部分にコードを追加
テンプレートによって、パンクズを表示したい部分のphpが違うかもしれません。私の場合は、page.phpに以下のコードを追加しました。
|
1 2 3 4 5 6 |
<div class="breadcrumbs" typeof="BreadcrumbList" vocab="http://schema.org/"> <?php if(function_exists('bcn_display')) { bcn_display(); }?> </div> |
3.cssで見た目を整える
2番目の項目までの作業が終わったら、一旦FTPでアップしてブラウザ表示をしてみます。
それを確認してから、cssで見た目を整えます。
私の場合は、周囲の余白とフォントサイズを変更しました。
これが出来たら、パンクズリスト設置完了です！
【広告】
【広告】
