【WordPress】アーカイブページの記事一覧の上に固定ページを表示させます

【WordPress:Twenty Sixteen】パンくずリストを実装した場合はアーカイブページの表示回数が増えそうです。一覧性を改善すればそのまま使えそうですが、柔軟な情報表示ができる用にアーカイブページを改修したいと思います。

サイトの構造はカテゴリで整理しています。パンくずリストをたどるとカテゴリの記事一覧(アーカイブページ)が表示されます。

一覧性を改善すればそのまま使えそうですが、パンくずリストを実装した場合はアーカイブページの表示回数が増えそうです。柔軟な情報表示ができる用にアーカイブページを改修したいと思います。


はじめに

今回はテーマの編集を行います。テーマを編集する場合はそのテーマの子テーマを準備し、そちらを改修しましょう。


アーカイブページの改修点は?

多くのカテゴリでは文字情報が主となるので問題ないのですが、WORKSやGALLERYなどの画像が主となるカテゴリではグリッド表示のほうがコンテンツとして見やすいと思います。

現在この部分は固定ページで準備しているので、パンくずリストをたどった時には固定ページが見えるのが理想です。

WORKS やGALLERYを例に挙げましたが、その他のカテゴリーでも関連するタグ情報などを一覧の上部に表示できると情報の絞り込みなどがしやすくなると思います。

ここは実装をどうやるかが今後の課題になりますが、コードで一括処理をするよりも、用意した固定ページをアーカイブページの上部へ表示したほうが柔軟なコンテンツを作れると思います。


archives.php を修正する

カテゴリと固定ページでは同じスラッグを設定することができます。

それを利用してアーカイブページを表示する際、同じスラッグを持つ固定ページを表示するように改修したいと思います。

WordPressメニュー「外観」→ 「テーマエディター」をたどります。

今回改修するのは「archives.php」になります。

元のソースでは33行目から記事一覧を表示するループ処理が始まるので、その手前の32行目に下記のコードを貼り付けます。

<?php
	// 現在のクエリ情報からカテゴリ名(スラッグ)を取得し、
	// 一致する固定ページのIDを取得します
	$page_id = get_page_by_path(get_query_var('category_name'));
	// 同スラッグの固定ページがあれば表示します。
	if(!is_null($page_id)){
		echo do_shortcode(get_post($page_id)->post_content);
	}
?>

処理の概要

このコードでは現在のクエリ情報からカテゴリスラッグを取得し、同スラッグを持つ固定ページのIDを取得します。取得したIDを使って固定ページの本文を取得し、ショートコードを実行した状態で表示しています。

固定ページのIDが取得できなければ、表示の処理は行いません。


補足(参考コードメモ)

カテゴリ情報を取得する方法をGoogleで検索すると、get_the_category()やsingle_cat_title()がまず見つかります。動作確認をするまでは関数機能としては十分に見えたのですが、これらの関数が対象にしているのはクエリ結果の一番最初の記事の情報でした。

結果として同じ動きは作れるのですが、親子関係のあるカテゴリの設定状態によっては意図しない動きになってしまいました。

クエリ情報からカテゴリスラッグを取得したほうが、コードもスッキリとまとまるのでおすすめです。

get_the_category()やsingle_cat_title()については、「記事一覧表示のループ処理の外で、最初の記事の情報を取りたい場合」の参考にはなりそうなので、メモ程度に眺めて貰えばと思います。

// カテゴリ一覧から、現在のアーカイブと名前が一致するカテゴリのIDを探します。
$page_id = null;
$categories = get_the_category();
foreach ( $categories as $category ) {
	if (single_cat_title("", false) == $category->cat_name) {
		$page_id = get_page_by_path(get_query_var('category_name'));
	}
}
/* 
 * 一致するIDを持つページがあれば、
 * コンテンツページの内容を表示
 */
if(!is_null($page_id)){
	echo do_shortcode(get_post($page_id)->post_content);
}

固定ページへnoindexを設定する

アーカイブページのパーマリンクから「/category」を削除している場合、今回の処理を実装するとアーカイブページと固定ページのパーマリンクが重複します。

サーチエンジンが混乱しないように固定ページにはnoindex属性を付け、クロールの対象から外します。

Yost SEOの場合は下記の設定でnoindexを付与します。

【Yoast SEO】固定ページでのnoindex設定
【Yoast SEO】固定ページでのnoindex設定

固定ページの下部にあるYoast SEOの設定項目「高度な設定」内にある「 Allow search engines to show this 固定ページ in search results? 」の項目を「いいえ」に設定します。


Yoast SEOでパーマリンクから「/category」を削除する

アーカイブページのパーマリンクから「/category」を削除するのはパーマリンク上でのサイトの構造をシンプルにするためです。Yost SEOでは下記の設定で消すことができます。

WordPressメニューから「SEO」→ 「Search Appearance」→ 「タクソノミー」をたどります。一番下の項目「Category URLs」を「削除」に設定します。

【Yoast SEO】パーマリンクから「/category」を削除する
【Yoast SEO】パーマリンクから「/category」を削除する


この断片があなたの星へ続く道を、少しでも照らすことを願って

投稿者: 0.1

イラストレーター/0.1up project著者 厚塗りで「存在感や重さ、質感による説得力」のあるイラストを目指しています。 日本では線画をベースとしたイラストが主流ですが、そこから外れたモノもイラストの世界を広げる為に必要だと考えています。「世界観にもう一味試したい」そんなときには、ぜひお声がけください。