WordPressでオリジナルテーマを作るときは、HTMLやCSSの知識だけでなく、どのページでどのテンプレートファイルが使われるのかを理解することが大切です。
静的サイトでは、作成したHTMLファイルをそのままブラウザで表示します。たとえばトップページなら index.html、会社概要なら about.html のように、ファイルとページの関係が比較的わかりやすいです。
一方でWordPressでは、ページの種類に応じて読み込まれるPHPファイルが決まっています。この仕組みを押さえると、オリジナルテーマの構造がかなり理解しやすくなります。
読者WordPressオリジナルテーマは テンプレートファイルの理解が重要は、最初にどこを理解するとよいですか?
木村WordPress標準機能、プラグインの機能、テーマ側の処理を分けて考えると、どこを変更すべきか判断しやすくなります。
読者実際に試すときは、手順だけでなく確認方法も知っておいた方がよいでしょうか?
木村はい。この記事では、作業の目的から実装後の確認までを順番に整理します。自分の環境と照らし合わせながら読み進めてください。
WordPressは決められたテンプレートファイルで表示される
WordPressのテーマは、決められた名前のテンプレートファイルを使ってページを表示します。
代表的なファイルには、次のようなものがあります。
front-page.php:トップページ用home.php:投稿一覧ページ用index.php:最後に使われる基本ファイルpage.php:固定ページ用archive.php:一覧ページ用single.php:投稿やカスタム投稿の詳細ページ用
これらのファイル名は、WordPress側が認識する名前です。自由に名前を付ける静的サイトとは違い、WordPressのルールに合わせてファイルを用意する必要があります。
例:テーマ内でよく使う基本ファイル
original-theme
├── front-page.php
├── home.php
├── index.php
├── page.php
├── archive.php
└── single.phpWordPressは決められたテンプレートファイルで表示されるで押さえたいポイント
WordPressは決められたテンプレートファイルで表示されるは、コードや設定だけを切り離して覚えるより、何を変えるための処理なのかを確認してから試すと理解しやすくなります。変更前の状態を控え、作業を一つずつ反映すると、問題が起きた場所も特定しやすくなります。
トップページで使われるファイルの優先度
トップページでは、主に front-page.php、home.php、index.php が関係します。
特に重要なのは、どのファイルが優先されるかです。
例:トップページのテンプレート優先順位
front-page.php
↓
home.php
↓
index.phpトップページ専用のデザインを作りたい場合は、まず front-page.php を用意します。
front-page.php がない場合、設定や表示条件によって home.php が使われることがあります。さらに該当するファイルがなければ、最終的に index.php が使われます。
index.phpは最後の受け皿になる
index.php は、WordPressテーマに必ず必要な基本ファイルです。
ただし、すべてのページを index.php だけで作るという意味ではありません。より適切なテンプレートファイルがあれば、WordPressはそちらを優先して使います。
つまり index.php は、他に該当するテンプレートがないときの最後の受け皿として考えるとわかりやすいです。
まず覚えたい基本ファイル
オリジナルテーマを学び始める段階では、すべてのテンプレートファイルを一気に覚える必要はありません。
まずは、次の4つのページの種類を押さえることが重要です。
- トップページ
- 固定ページ
- 一覧ページ
- 詳細ページ
例:ページの種類とテンプレートファイル
トップページ:front-page.php
固定ページ:page.php
一覧ページ:archive.php
詳細ページ:single.php
最後の基本ファイル:index.phpこの対応関係を理解しておくと、どのファイルを編集すればよいか判断しやすくなります。
まず覚えたい基本ファイルで押さえたいポイント
まず覚えたい基本ファイルは、コードや設定だけを切り離して覚えるより、何を変えるための処理なのかを確認してから試すと理解しやすくなります。変更前の状態を控え、作業を一つずつ反映すると、問題が起きた場所も特定しやすくなります。
固定ページと一覧ページの違い
初心者がつまずきやすいポイントのひとつが、固定ページと一覧ページの違いです。
どちらもWebサイト内の1ページに見えるため、最初は混同しやすいです。しかし、役割は大きく異なります。
固定ページは単発のページに使う
固定ページは、内容が単発で完結するページに使います。
たとえば、会社概要ページ、お問い合わせページ、サービス紹介ページ、プロフィールページなどです。
静的サイトで about.html や contact.html として作るようなページは、WordPressでは固定ページで管理することが多いです。
例:固定ページとして考えやすいページ
about
contact
service
privacy-policy固定ページの基本テンプレートは page.php です。単発で完結するページは、まず固定ページとして考えると整理しやすくなります。
一覧ページは複数の記事を並べるページに使う
一覧ページは、投稿やカスタム投稿など、複数のコンテンツを並べて表示するページです。
一覧ページに記事のカードやタイトルを並べ、クリックするとそれぞれの詳細ページへ移動します。
固定ページと一覧ページの違いの補足
固定ページと一覧ページの違いの補足では、前の章に続く項目を整理します。各項目の役割と違いを確認しながら、必要な部分を自分の制作へ取り入れてください。
例:一覧ページと詳細ページの関係
お知らせ一覧:archive.php
├── お知らせ詳細 1:single.php
├── お知らせ詳細 2:single.php
└── お知らせ詳細 3:single.phpこのように、一覧ページと詳細ページがセットになっているコンテンツでは、一覧側に archive.php、詳細側に single.php を使う考え方が基本になります。
同じ種類のページを1つのPHPファイルで表示できる
WordPressテーマでは、「同じ種類のページを、1つのPHPファイルでまとめて表示できる」という考え方があります。
たとえば、固定ページは page.php、投稿一覧やカテゴリー一覧などは archive.php、個別記事は single.php というように、ページの種類ごとに使われるテンプレートファイルが決まっています。
少しわかりにくいのは、これらのファイルが「1ページにつき1ファイル」ではないという点です。たとえば固定ページが10ページあっても、基本的には page.php が1つあれば、その10ページすべての表示に対応できます。WordPressがアクセスされたページの内容を自動で読み込み、同じ page.php の中にタイトルや本文を差し込んで表示してくれるためです。
個別記事も同じです。記事が100本あっても、基本的には single.php が1つあれば、それぞれの記事ページを表示できます。記事ごとにPHPファイルを100個作る必要はありません。WordPressが「今表示する記事はどれか」を判断し、その記事のタイトル、本文、画像、日付などを single.php に流し込んでくれます。
アーカイブページも同様に、カテゴリー一覧、月別一覧、投稿者別一覧などを archive.php でまとめて表示できます。表示する内容はアクセスされた条件によって変わりますが、見た目の枠組みは1つのテンプレートで共通化できます。
つまり、WordPressのテンプレートファイルは「特定の1ページを作るファイル」ではなく、「同じ種類のページを表示するための設計図」のようなものです。page.php、single.php、archive.php を用意しておけば、WordPressが中身を自動で入れ替えながら、たくさんのページを効率よく表示してくれます。
archive.phpとsingle.phpはセットで考える
繰り返しになりますが、ブログ記事、お知らせ、制作実績、商品情報などは、一覧ページと詳細ページの両方が必要になることが多いです。
この場合は、次のように考えると整理しやすくなります。
例:archive.phpとsingle.phpの役割
archive.php:複数の記事を一覧表示する
single.php:クリックした1件の記事を詳しく表示するたとえば「お知らせ」というコンテンツを作る場合、一覧ページではお知らせを複数件表示します。そして、それぞれの記事をクリックすると詳細ページへ移動します。
この流れがある場合は、固定ページだけで無理に作るのではなく、一覧ページと詳細ページの構造として考えることが大切です。
archive.phpとsingle.phpはセットで考えるで押さえたいポイント
archive.phpとsingle.phpはセットで考えるは、コードや設定だけを切り離して覚えるより、何を変えるための処理なのかを確認してから試すと理解しやすくなります。変更前の状態を控え、作業を一つずつ反映すると、問題が起きた場所も特定しやすくなります。
まとめ
- WordPressのオリジナルテーマは、決められたテンプレートファイルでページを表示する仕組みになっています。
- トップページでは
front-page.php、home.php、index.phpの優先度が重要 - 固定ページは
page.phpで表示する - 一覧ページは
archive.phpで表示する - 詳細ページは
single.phpで表示する index.phpは最後に使われる基本ファイルとして考える- 特に大切なのは、固定ページと一覧ページの違いを明確にすることです。
- 単発で完結するページは固定ページ。複数の記事を並べ、クリックして詳細ページへ移動するコンテンツは一覧ページとして考えます。
- この考え方がわかると、WordPressのオリジナルテーマは一気に理解しやすくなります。まずは、トップページ、固定ページ、一覧ページ、詳細ページの4つを意識して、どのテンプレートファイルが使われるのかを確認していきましょう。

MEMBER COMMENTS
コメント(0件)