サイトにパンくずリストをつけたかったので、その準備としてSEO対策プラグインをYoast SEOに変更しました。パンくずリストもすぐに表示できる状態になったのですが、そのままでは使いづらそうな点も見つかりました。
今回はパンくずリストの実装に向けて、Wordpressの標準テーマ「Twenty Sixteen」のアーカイブページを改修していきます。
目次：
はじめに
今回はテーマの編集を行います。テーマを編集する場合はそのテーマの子テーマを準備し、そちらを改修しましょう。
カテゴリ記事一覧が表示されたときの問題点
サイト構造はカテゴリを使って整理していたので、パンくずリストをたどるとカテゴリの記事一覧（アーカイブページ）が表示されます。初期状態ではアーカイブページには記事の本文が表示されるのですが、記事一つの縦幅が広すぎて一覧性が悪く、使いにくい印象です。
現在SEO対策の一環として、固定ページや記事の概要を整備しています。アーカイブページに表示される本文は「続きを読む」までで区切ることもできるのですが、概要のほうがコンパクトにまとめているので、アーカイブページにはこちらを表示したいと思います。
content.php を修正する
WordPressメニュー「外観」→ 「テーマエディター」をたどります。
今回改修するファイルは「content.php」になります。
Twenty Sixteenでは「template-parts」というフォルダ内に入っています。
元の概要とアイキャッチ画像を削除
元のソースだと２０行目に概要とアイキャッチ画像のコードがあります。削除してしまってもいいのですが、今回はコメントアウトで対応します。
削除したアイキャッチ画像は、表示サイズを調節して更新日の上に表示します。
本文表示を概要だけに変更
元のソースだと２４行目あたりに「<div class=”entry-content”>」から始まる部分があります。
ここで、記事本文を表示しているのですがまるっといらないので、下記のように修正します。
<a href="<?php esc_url(the_permalink()) ?>" rel="bookmark">
<?php
twentysixteen_excerpt();
?>
</a>アーカイブページを確認してみると、問題なく概要が表示されています。
一覧性も良くなったと思います。
今後の課題
記事本文を概要に変更することで、一覧性はかなり向上すると思います。あと気になるとすれば、概要の左手にある、カテゴリ・タグの情報でしょうか。現状この部分の縦幅が広いので、ここは概要の下辺りに表示したほうがスッキリするかもしれませんね。ここについては、時間を作って検討してみたいと思います。
この断片があなたの星へ続く道を、少しでも照らすことを願って
