【WordPressで作るキュレーションメディア第3回】記事・まとめ・ランキングのテンプレートとパターン

2025年7月1日2026年10月1日

書き手が増えてくると、「記事によって見出しの構成がばらばら」「出典の書き方が人によって違う」「まとめ記事なのか普通の記事なのか見た目で区別できない」といった問題が出てきます。品質のばらつきは、書き手のスキルだけでなく「型」がないことからも生まれます。

「まとめ記事やランキング記事を、毎回同じ構成・同じ見た目で作れるようにしたい。WordPress でどう仕組みにすればいい？」

結論から言うと、ページの見た目の型は「テンプレート」、本文の書き方の型は「パターン」で用意します。WordPress 6.8 のブロックテーマなら、テンプレートは HTML ファイル、パターンは PHP ファイルを子テーマに置くだけで、書き手はエディターから選んで使えるようになります。

前回の第2回では、カテゴリ・タグ・特集の役割を分け、特集タクソノミーを実装しました。第3回の今回は、記事・まとめ・ランキングの3種類のテンプレートと、新規投稿時に選べる初期パターンを作ります。

記事・まとめ・ランキングの3つの「型」を決める

このサンプルでは、記事の種類を次の3つに分けます。

種類	使う場面	テンプレートでの違い	本文の骨組み（パターン）
記事	1つのテーマを解説する通常の記事	標準の記事テンプレート	導入 → 結論 → 詳しい解説 → 出典と確認日
まとめ	複数の情報源を整理して紹介する	「まとめ」ラベルと、編集方針の注記	導入 → ポイント → 項目ごとの要約と編集部コメント → 出典と確認日
ランキング	基準を決めて順位を付けて比べる	「ランキング」ラベルと、選定基準の注記	導入 → 選定基準 → 順位ごとの理由 → 出典と確認日

役割分担は次のとおりです。

テンプレート（＝ページ全体の枠組み）：タイトルの位置、カテゴリや日付の表示、注記など、書き手が変えてはいけない部分を決めます。
パターン（＝ブロックの組み合わせの見本）：見出しの構成や出典欄など、書き手が中身を埋める部分の初期状態を決めます。

どちらの型にも「出典と確認日」を入れているのは、第0回で決めた編集方針（一次情報の確認・出所の明示）を、書き手が意識しなくても守りやすくするためです。

単一記事テンプレートとテンプレートパーツを作る

ここから実装です。今回変更・追加したファイルは次のとおりです（すべて子テーマ wp-content/themes/curation-child/ 配下）。

ファイル	変更内容
`templates/single.html`	記事の標準テンプレート（親テーマを上書き。新規）
`templates/single-matome.html`	カスタムテンプレート「まとめ」（新規）
`templates/single-ranking.html`	カスタムテンプレート「ランキング」（新規）
`parts/post-meta.html`	カテゴリ・特集・公開日・更新日のテンプレートパーツ（新規）
`patterns/starter-article.php` ほか2つ	新規投稿時の初期パターン（新規）
`theme.json`	`customTemplates` と `templateParts` を追加
`functions.php`	パターンカテゴリ「キュレーション」を登録
`style.css`	公開日・更新日のラベル、バージョン 0.3.0

テンプレートパーツ：記事のメタ情報を1か所にまとめる

カテゴリ・特集・日付の表示は3つのテンプレートすべてで使うため、テンプレートパーツ（＝複数のテンプレートで共有する部品）にします。

parts/post-meta.html

<!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|30"}},"layout":{"type":"flex","flexWrap":"wrap"},"fontSize":"small"} -->
<div class="wp-block-group has-small-font-size">
	<!-- wp:post-terms {"term":"category"} /-->
	<!-- wp:post-terms {"term":"feature","prefix":"特集："} /-->
	<!-- wp:post-date {"className":"curation-published-date"} /-->
	<!-- wp:post-date {"displayType":"modified","className":"curation-modified-date"} /-->
</div>
<!-- /wp:group -->

2つ目の post-terms では、第2回で作った特集（feature）を表示しています。特集が付いていない記事では何も出力されません。

日付は「公開日」と「更新日」の2つを出しています。post-date ブロックの displayType: "modified" は、更新日が公開日より後のときだけ表示される設定です。まとめやランキングは情報が古くなりやすいため、読者が「いつの情報か」を判断できるようにしておきます。

post-date ブロックには「公開」「更新」といった前置きを付ける設定がないため、ラベルは style.css で付けています。

style.css（追加部分）

/* 記事のメタ情報：公開日と更新日にラベルを付ける（post-date ブロックには前置きの設定がないため） */
.curation-published-date::before {
	content: "公開 ";
}

.curation-modified-date::before {
	content: "更新 ";
}

テンプレートパーツは theme.json の templateParts に登録しておくと、サイトエディターで分かりやすい名前で表示されます。

theme.json（追加部分）

"customTemplates": [
	{
		"name": "single-matome",
		"title": "まとめ",
		"postTypes": [ "post" ]
	},
	{
		"name": "single-ranking",
		"title": "ランキング",
		"postTypes": [ "post" ]
	}
],
"templateParts": [
	{
		"name": "post-meta",
		"title": "記事のメタ情報（カテゴリ・特集・日付）",
		"area": "uncategorized"
	}
]

📰 出典：WordPress Theme Handbook「Template Parts」

single.html：親テーマの記事テンプレートを上書きする

子テーマに親と同じ名前のテンプレート（templates/single.html）を置くと、子テーマ側が使われます。親テーマのファイルは編集しません。

templates/single.html

<!-- wp:template-part {"slug":"header"} /-->

<!-- wp:group {"tagName":"main","style":{"spacing":{"margin":{"top":"var:preset|spacing|60"}}},"layout":{"type":"constrained"}} -->
<main class="wp-block-group" style="margin-top:var(--wp--preset--spacing--60)">
	<!-- wp:group {"tagName":"header","layout":{"type":"constrained"}} -->
	<header class="wp-block-group">
		<!-- wp:template-part {"slug":"post-meta"} /-->
		<!-- wp:post-title {"level":1} /-->
		<!-- wp:post-featured-image {"aspectRatio":"16/9"} /-->
	</header>
	<!-- /wp:group -->

	<!-- wp:post-content {"layout":{"type":"constrained"}} /-->

	<!-- wp:post-terms {"term":"post_tag","prefix":"タグ：","style":{"spacing":{"margin":{"top":"var:preset|spacing|50"}}},"fontSize":"small"} /-->

	<!-- wp:pattern {"slug":"twentytwentyfive/post-navigation"} /-->
</main>
<!-- /wp:group -->

<!-- wp:template-part {"slug":"footer"} /-->

親テーマの記事テンプレートとの主な違いは次のとおりです。

タイトルの上にメタ情報（カテゴリ・特集・日付）を置き、「いつの、どの分野の記事か」を最初に示す
コメント欄と「その他の記事」を外す（コメントを受け付けるかは運用方針次第のため。関連記事は第7回で自作します）
前後の記事へのリンクは親テーマのパターン（twentytwentyfive/post-navigation）をそのまま使う

カスタムテンプレート「まとめ」「ランキング」を追加する

記事ごとに選べるテンプレートは、theme.json の customTemplates に登録します（上の theme.json の追加部分）。name がファイル名（templates/single-matome.html）、title がエディターに表示される名前、postTypes が使える投稿タイプです。

📰 出典：WordPress Theme Handbook「Custom Templates」

templates/single-matome.html（header 部分の抜粋。それ以外は single.html と同じ）

<!-- wp:group {"tagName":"header","layout":{"type":"constrained"}} -->
<header class="wp-block-group">
	<!-- wp:paragraph {"className":"curation-type-label","textColor":"brand","fontSize":"small"} -->
	<p class="curation-type-label has-brand-color has-text-color has-small-font-size">まとめ</p>
	<!-- /wp:paragraph -->
	<!-- wp:template-part {"slug":"post-meta"} /-->
	<!-- wp:post-title {"level":1} /-->
	<!-- wp:group {"backgroundColor":"accent-1","style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30","left":"var:preset|spacing|40","right":"var:preset|spacing|40"}}},"layout":{"type":"constrained"},"fontSize":"small"} -->
	<div class="wp-block-group has-accent-1-background-color has-background has-small-font-size" style="padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--40)">
		<!-- wp:paragraph -->
		<p>この記事は、公式発表などの情報を編集部が確認し、要点を整理したものです。各項目に出典と確認日を記載しています。</p>
		<!-- /wp:paragraph -->
	</div>
	<!-- /wp:group -->
</header>
<!-- /wp:group -->

「まとめ」のラベルと注記は、書き手が本文に書くのではなくテンプレートに固定しています。書き忘れや、人によって文言が変わることを防ぐためです。注記の背景色には、第1回で「引用元・補足の背景」として定義した accent-1 を使っています。

templates/single-ranking.html は、ラベルが「ランキング」、注記が次の文になっている以外は同じです。

<p>掲載順は、本文の「選定基準」に沿って編集部が決めたものです。各項目の情報は確認日時点の内容です。</p>

ランキングでは、順位の根拠（選定基準）を本文に必ず書くことを前提にしています。基準が書かれていない順位付けは、読者から見て広告との区別が付きにくくなるためです。広告を含む場合の表示は第9回で扱います。

書き手は、投稿の編集画面の右側「テンプレート」から「まとめ」「ランキング」を選びます。選んだテンプレートは記事ごとに保存され（投稿メタ _wp_page_template）、HTML の body 要素に post-template-single-matome のような class が付きます。

新規投稿時に選べるパターンを登録する

子テーマの patterns/ フォルダに PHP ファイルを置くと、WordPress が自動でパターンとして登録します。ファイル冒頭のコメント（ヘッダー）に、名前や使える場所を書きます。

📰 出典：WordPress Theme Handbook「Registering Patterns」

patterns/starter-matome.php（本文の一部を省略）

<?php
/**
 * Title: まとめ記事の基本構成
 * Slug: curation-child/starter-matome
 * Categories: curation
 * Block Types: core/post-content
 * Post Types: post
 * Description: 要点→項目ごとの要約と編集部コメント→出典の順で書く、まとめ記事の骨組み。
 *
 * @package Curation_Child
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}
?>
<!-- wp:paragraph {"placeholder":"導入：何についてのまとめか、誰に役立つかを2〜3文で書く"} -->
<p></p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 class="wp-block-heading">1. 項目の見出し</h2>
<!-- /wp:heading -->

<!-- wp:paragraph {"placeholder":"要約：出典の内容を自分の言葉で短くまとめる（転載しない）"} -->
<p></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"placeholder":"編集部のコメント：この情報をどう読むか、何に注意すべきか"} -->
<p></p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 class="wp-block-heading">出典と確認日</h2>
<!-- /wp:heading -->

<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item {"placeholder":"出典名・URL（確認日：YYYY年M月D日）"} -->
<li></li>
<!-- /wp:list-item --></ul>
<!-- /wp:list -->

ヘッダーのポイントは次のとおりです。

Block Types: core/post-content と Post Types: post：この2つを書いたパターンは「スターターパターン」として扱われ、投稿の新規作成時に表示される「パターンを選択」の画面に候補として出ます。
Categories: curation：パターン一覧での分類です。後述の functions.php で登録します。
本文は placeholder（入力欄のうすい案内文）で書く：見本の文章を入れると、消し忘れたまま公開される事故が起きます。案内文なら、何も入力しなければ公開時には表示されません。

📰 出典：WordPress Theme Handbook「Starter Patterns」

まとめの項目は「要約」と「編集部のコメント」を別の段落に分けています。他者の情報の要約だけで記事を作らず、自分たちの解説を必ず加えるという編集方針を、本文の型で示すためです。項目のデザインを整えた「まとめリスト」は第5回でパターンとして作り込みます。

パターンカテゴリを登録する

functions.php（追加部分）

/**
 * パターンのカテゴリ「キュレーション」を登録する。
 *
 * patterns/ に置いた PHP ファイルは WordPress が自動で登録する。
 * ここではエディターのパターン一覧で探しやすいよう、分類だけを追加する。
 */
function curation_child_register_pattern_category() {
	register_block_pattern_category(
		'curation',
		array(
			'label'       => 'キュレーション',
			'description' => '記事・まとめ・ランキングの基本構成など、このサイト用のパターン',
		)
	);
}
add_action( 'init', 'curation_child_register_pattern_category' );

親テーマには多数のパターンが含まれているため、自社用のパターンを専用のカテゴリにまとめておくと、書き手が迷いません。

動作確認の方法

第0回・第2回の手順（setup.sh・seed-terms.sh）の後、次のように確認します（筆者の環境で確認済みです）。

# テンプレート「まとめ」を指定して記事を作る
docker compose run --rm wpcli wp post create --post_title=まとめテスト --post_name=matome-test \
  --post_status=publish --page_template=single-matome --porcelain

# body の class にテンプレート名が出るか
curl -sL http://localhost:8088/matome-test/ | grep -o '<body class="[^"]*"'

「まとめ」を指定した記事の body に post-template-single-matome、「ランキング」なら post-template-single-ranking が付き、タイトルの上にそれぞれのラベルと注記が出る
テンプレートを指定しない記事では、子テーマの single.html が使われ、カテゴリ・特集・公開日が表示される
公開日を過去にずらした記事（wp post update <ID> --post_date=...）では、「更新」の日付も表示される
REST API（/wp-json/wp/v2/block-patterns/patterns、管理者で認証）に curation-child/starter-article・starter-matome・starter-ranking が、カテゴリ curation・投稿タイプ post で登録されている
/wp-json/wp/v2/templates?post_type=post に「まとめ」「ランキング」が含まれる

なお、「パターンを選択」画面の表示は、WordPress 6.8 のエディターが「本文ブロックを対象にし、投稿タイプに post を含むパターン」を新規投稿時の候補にする仕組みによるものです。筆者は登録内容を REST API で確認しており、画面のスクリーンショットは掲載していません。この画面は、エディターの環境設定でオフにもできます。

つまずきやすい点

サイトエディターで編集したテンプレートはファイルより優先される：管理画面の「外観 > エディター」でテンプレートを保存すると、その内容がデータベースに保存され、テーマのファイルを更新しても表示が変わらなくなります。開発中に「ファイルを直したのに反映されない」ときは、サイトエディターでそのテンプレートに加えた変更をリセットし、ファイルの内容に戻してください。
テンプレートを削除・改名すると記事が標準に戻る：記事ごとに保存されているのはテンプレートの名前です。single-matome をなくすと、その記事は single.html で表示されます。名前は最初に決めて変えない前提にします。
パターンの修正は既存の記事に反映されない：パターンは「挿入時にコピーされる見本」です。パターンを直しても、すでに書かれた記事の本文は変わりません。全記事で共通にしたい部分はテンプレート側に置きます。
テンプレートの種類を増やしすぎない：種類が増えるほど、デザイン・表示確認・書き手への説明の手間が増えます。まずは3種類程度から始め、運用して必要になったら足します。

発注者向けメモ：ページの「型」は品質と工数の両方に効く

ページの型を先に用意しておくと、書き手ごとの構成のばらつきが減り、編集者のチェックも「型どおりか」を見ればよくなります。一方で、型の数を増やすほど、デザイン・表示確認・マニュアル作成の工数はほぼ比例して増えます。

開発会社に依頼するときは、次の点を決めておきましょう。

記事の種類と、それぞれの必須項目：通常記事・まとめ・ランキング・インタビューなど、何種類必要か。種類ごとに「必ず書く項目」（出典、確認日、選定基準など）は何か
テンプレートに固定する文言：「まとめ」の注記やランキングの選定基準の案内など、書き手に変えさせない文言は何か。文言の最終確認は誰が行うか
サイトエディターを誰が触るか：テンプレートを管理画面から変更できる人を限定するか。変更した場合、コード側にどう反映するか
コメント欄の有無：受け付ける場合は、スパム対策と返信の担当が必要になる

打ち合わせでは、次のように聞いてみてください。