WordPressのテンプレート階層を理解しよう

この章では、WordPress のテンプレート階層について学んでいきます。

本章で学ぶ内容も、WordPress の自作テーマを開発する上で必須の知識となりますので、使いこなせるようになるまでは何度も復習していきましょう。

このチュートリアルの目標

• WordPressの基本的な投稿単位を理解できる
• WordPressで該当するPHPファイルが存在しない場合、index.phpのファイルが読み込まれることを理解できる
• ファイルの有無によって別のページが呼び出されるテンプレート階層の仕組みが理解できる

WordPressの基本的な投稿単位

WordPressの開発を行う前に、まずはWordPressの基本的な投稿単位を理解しましょう。
WordPressには、ざっくりとわけて以下の投稿タイプがあります。

• 投稿
• カテゴリ
• タグ
• 固定ページ
• フロントページ

投稿

投稿とは、WordPressが持っている、コンテンツの一つの種類になります。
管理画面からは、投稿タブから、実際に投稿することができます。

投稿は、一般的には記事を作成する際に利用します。
たとえば、企業のブログ記事などは、投稿で扱われることが多いです。

投稿には、

• 投稿一覧画面：複数の投稿が一覧表示されるページ。index.phpで表示される。
• 投稿詳細画面：投稿が表示されるページ。single.phpで表示される。

に分かれています。

弊社が運営しているメディアだと、トップページをindex.phpで実装しています。
ブログ記事の一覧が表示されるようになっています。

投稿詳細画面では、単一ページが表示されます。投稿詳細画面は、single.phpで実装しています。

カテゴリ

投稿のカテゴリが存在します。
たとえば、転職ブログの場合は、以下のようなカテゴリに、投稿が属するような形になります。

カテゴリの例

• 転職エージェント
• 転職サイト
• プログラミングスクール

カテゴリは、category.phpに記述し、呼び出します。

弊社が運営しているメディアでは、カテゴリの一覧ページが表示されます。

タグ

投稿にもタグが存在します。
タグは、投稿に紐づいていて、投稿に対して複数のタグが容易されています。

tag.phpで実装します。

固定ページ

固定ページは、投稿と似た単位のページとなります。
投稿は、一般的には記事のようなものに使われます。
一方で、固定ページの場合は、

• 利用規約
• プライバシーポリシー
• 企業概要

など、それ自体が単体で成立するページに利用されることが多いです。

page.phpで実装することになります。

フロントページ

フロントページは、主にページのランディングページに表示されることが多いです。
front-page.phpで実装することになります。

最小構成のテーマで考えるテンプレート階層

前章では、最小構成のテーマを作りました。作成したファイルは

• index.php
• style.css

この２つです。WordPress のテーマでは、最低限この２つのファイルがあればテーマとして認識されます。

この最小構成のテーマの場合、「index.php」はどのような動きをするか考えてみましょう。

試しに、投稿を作成してみましょう！
投稿タブをクリックして、新規追加をクリックします。

タイトルを「サンプル投稿」
テキストを「サンプル投稿しています」と入力してみましょう。

公開をクリックします。

投稿を作成すると、「サンプル投稿を公開しました」と表示されます。
投稿アドレスをコピーして、どのページが表示されるか確認してみましょう。

そうすると、本来はsingle.phpが表示されるコンテンツなのに、single.phpが存在しないので、index.phpのファイルが表示されていることが分かります。

では、次にsingle.phpというファイルを新規作成して、以下のようにファイルを記述してみてください。

single.php

<p>single.phpです</p>

そうして再度、同じページを開くと、以下の画面が出てくるはずです。

このように、single.phpが本来呼ばれるべき場合にsingle.phpが存在しない場合、index.phpをロードします。これが実はテンプレート階層の概念なのです。

テンプレート階層の概観図を確認してみよう

テンプレート階層のイメージを掴むために、先ほどの解説を「テンプレート階層の概観図」で確認してみましょう。

WordPress の公式ドキュメント「WordPress Codex - テンプレート階層」にアクセスします。

ページ内にテンプレート階層のイメージを図解した「概観図」があるので、この画像を確認してください。

テンプレート階層の優先順位については、この概観図をみて確認するとスムーズなので、この画像はダウンロードするかブックマークするなど、テーマの開発中はすぐに確認できるようにしておきましょう。

プライマリーテンプレートを知ろう

テンプレート階層の概観図は色分けされていますが、この中で濃いブルーのファイル名が「プライマリーテンプレート」です。

以下の表に纏めたプライマリーテンプレートはよく使われるので、概観図を見なくても扱えるように自作テーマを開発しながら覚えていきましょう。

セカンダリーテンプレートを知ろう

プライマリーテンプレートの他にも、使用頻度の高いセカンダリーテンプレート（水色部分）があります。

プライマリーテンプレート同様に、セカンダリーテンプレートも概観図を見なくても扱えるように自作テーマを開発しながら覚えていきましょう。

プライマリーテンプレートやセカンダリーテンプレート以外にも、ここでは解説していないテンプレート階層もあります。

一度にすべてを覚える必要はなく、開発時に必要となったタイミングで深堀りしていけば問題ありません。

まずは核となる概念と、利用頻度の高いテンプレートファイルだけを使いこなせるようにしていきましょう。

まとめ

この章では、WordPress のテーマ開発に必要なテンプレート階層の概要を学びました。

一度で理解できるほどシンプルな内容ではないので、実際のテーマ開発を通して使いこなせるようになれば OK です。