固定ページのパンくずリストにページタイトルを追加する方法

こんにちは、連久実子です。

当サイトでは、構築に無料のWordPressテーマであるSimplicityを利用させていただいています。

とっても便利なんですが、デフォルトの状態だと、現在閲覧しているページタイトルがパンくずリストに表示されません。

運営側では、2014年当初、ユーザビリティを考慮して、このような仕様にされたようです。

もちろんやろうと思い調べれば出来ないことはないのだろうと思います。
ただ、固定ページのタイトルと言ったら、カテゴリよりは、長いタイトルをつける傾向にあります。
サイトによっては、SEOのためもっと長いタイトルをつけるところもあるので、あまり見栄えが良くないのではと思ったんです。

あと、ほとんどの人が階層化させていないので、homeのみのパンくずリストが表示されることになります。

で、固定ページで問い合わせフォームを作成してみたところ、パンくずリストにページタイトルがないとちょっと物足りなく感じたので、固定ページのパンくずリストに、現在閲覧しているページタイトルを追加する方法を調べてみました。

運営サイト以外にも、個人でsimplicityのカスタマイズ方法を紹介されているサイトなども見てみたのですが、私の悩みをドンピシャで解決してくれるページがない・・・

と、困っていたら、以前参考にさせていただいた、投稿記事のパンくずリストに、現在閲覧しているページタイトルを追加する方法の、コメント欄にて紹介されてました・・・

パンくずリストに、現在閲覧しているページタイトルを表示させたい。

Simplicityの特徴 › フォーラム › テーマファイルのカスタマイズに関する質問など › パンくずリストに、現在閲覧しているページタイトルを表示させたい。このトピックには9

なんと！コメント欄まで見ていなかった・・・

上記のページでは、正しいコードまでは記載されていなかったので、このページで正しいカスタマイズ方法を紹介させていただきますね。

デフォルトの状態
カスタマイズ方法
カスタマイズ後

デフォルトの状態

パンくずリストには、サイト名しか表示されません。（もっというと、このサイト名の表示自体もカスタマイズで表示させているので、本当のデフォルト状態だと「home」と表示されます）

うーん、何か物足りない・・・

カスタマイズ方法

1. 管理画面で”breadcrumbs-page.php”を開く

管理画面のメニューから”外観 > テーマの編集”と進み、右に表示されているbreadcrumbs-page.phpをクリックします。
そうすると、breadcrumbs-page.phpの編集画面が開きます。

ちなみに、私はphpファイルを編集する際は、子テンプレートに親テンプレートのファイルをコピーして、コピーファイルを編集するようにしています。

こうすると、wordpressをバージョンアップしても、カスタマイズした内容が上書きで消されてしまうという危険が回避できるそうです。（現役エンジニアじゃないので、これ以上説明できないことへのツッコミは、ご容赦ください・・・）

2. breadcrumbs-page.phpのコードを修正

breadcrumbs-page.phpを開くと、コードの下3行が下のように記述されていると思います。

<?php } ?>
</div><!-- /#breadcrumb -->
<?php endif; ?>

この

<?php } ?>

と

</div><!-- /#breadcrumb -->

の間に、下のコードを追記します。

<?php
echo '<span class="sp"><span class="fa fa-angle-right"></span></span>
<div itemscope=" itemtype="http://data-vocabulary.org/Breadcrumb">
<span itemprop="title">
<span class="fa fa-file-o fa-fw"></span>
<a href="'.get_the_permalink().'" itemprop="url">'.get_the_title().'</a>
</span></div>' ?>