WordPressテーマのテンプレートファイルを知る【WordPress制作入門講座】

前回、新しく作ったフォルダをWordPressのテーマと認識させるために、index.phpを作成しました。これは、index.phpが「テンプレートファイル」と呼ばれる、サイトを表示させるために必要なファイルのためです。

WordPressでサイトを作るためには、index.php以外にもサイトを構成するための「テンプレートファイル」を作っていく必要があります。
WordPressの仕組みとテンプレートファイルの役割を把握しましょう。

WordPressテーマの仕組み

実際にテーマを作成する前に、WordPressがWebページを表示する仕組みを知りましょう。そうすることで、作りたいサイトの構成にはどのようなテンプレートファイルが必要かがわかります。

HTMLページとWordPressの違い

HTMLファイルでWebページを作った時は、1ファイルがそのまま1つのWebページとして表示されていました。
3ページ作りたければ、3つのhtmlファイルが必要でしたね。

このように、書かれていることがそのまま表示されている＝いつアクセスしても毎回同じ情報が表示されるページを静的ページと言います。

対してWordPressは、存在するページの数と同じだけhtmlやphpファイルを用意する必要はありません。1つのファイルに、条件に応じた情報を出力して表示することが出来ます。

テンプレートファイルがあれば、リクエストに応じてデータベースにある情報を取り出し、それをページに表示させることが出来ます。このようにアクセス時の条件によって表示される情報が異なるページを動的ページと呼びます。

● index.phpを使って確認してみよう

リクエストに応じてデータベースにある情報を取り出し…と聞いても、馴染みがないとピンと来ないのではないでしょうか？
どういうことか、index.phpを使って実験してみましょう。

index.phpを開いてください。
「index.phpのテストです」の下に、下記コードを貼り付けてください。

これは、投稿のタイトルを取得・表示せよというWordPressのタグです。

<h1><?php the_title(); ?></h1>

↓貼り付けイメージ

貼り付けたら上書き保存。
WordPressの管理画面から、投稿一覧を開きます。

テストです、という記事を表示してみましょう。
投稿のタイトル「テストです」が表示されているはずです。

次に、Hello world!の記事を表示させてみます。
こちらも投稿のタイトル「Hello world!」が表示されました。

どちらもindex.phpを使って表示されていますが、WordPressのデータベースに下記の２つを指示（リクエスト）しています。

• どのページの情報を表示するか（投稿を選ぶ）
• 投稿のタイトルを取得・表示せよ（ php the_title(); ）

タイトルの表示が変わる＝リクエストに応じて表示内容が変わっていることが分かりやすいのではないでしょうか。

テンプレートファイルの考え方

WordPressでは、同じファイルを使って別々のページを表示することが出来ます。

ですが、サイトのトップページ、新着記事一覧、投稿ページなど、それぞれのページでは表示させたいものが違いますよね。デザインやレイアウトも分けたいです。
全てindex.phpで表示させようとすると難しいですよね。

そこで、WordPressにはindex.php以外にも、役割ごとにテンプレートファイルが設定されています。役割に合わせてファイル名が決められており、ページを書き出す際に自動でそれぞれのファイルを使用してくれます。

使用できるテンプレートファイルの一覧図も公開されています。

外部リンク

Template Hierarchy

とはいえ、テーマを作る際に図にあるファイル全てを揃える必要はありません。
この中から必要なファイルだけを用意すれば良いのです。
どのファイルが必要かは図を見て決めれば良いので、暗記する必要もありません。

今回のエドベースサイトをwordPress化するために使うテンプレートを確認しましょう。この４つのテンプレートは、大抵のWordPressテーマで使用されています。

トップページがindex.phpでは無いことに、違和感を覚えた方もいらっしゃるかもしれません。お察しの通り、index.phpもトップページに使えます。

ただ、WordPressテーマでindex.phpは「なんでも屋」のポジション。
ピッタリ当てはまるテンプレートファイルが無い時は、とりあえずindex.phpを使ってWebページとして表示させる仕様になっています。
だからこそ、テーマにindex.phpが必須となっているわけです。

今回のサイトの場合、トップページ(index.html)は固有のデザインです。
このデザインをindex.phpにしてしまうと、カテゴリー一覧、投稿年月による表示などでindex.phpが使われた際に、記事情報が出てこないんですね。
ですので、front-page.phpという独立したテンプレートファイルを使います。