WordPressで自作テーマを作成する際には、テーマファイルをどこに配置するかと、各テンプレートファイルがどのように読み込まれるかを理解しておくことが重要です。以下では、ファイルの保存場所・ファイル名・読み込み優先度をざっくり整理していますので、ぜひ開発の参考にしてみてください。
目次
テーマの保存場所
WordPressのフォルダ構成は通常、wp-content/themes/
というディレクトリが用意されています。その中に自作テーマ用のフォルダを作成し、その配下へ各種ファイルを格納します。
wp-content/
└─ themes/
└─ my-original-theme/ ← ここが自作テーマフォルダ
├─ style.css
├─ functions.php
├─ header.php
├─ footer.php
├─ sidebar.php
├─ ... etc
└─ images/ (画像を格納する場合)
└─ js/ (JavaScriptファイルを格納する場合)
└─ css/ (独自CSSファイルを格納する場合)
- テーマフォルダの名前は自由ですが、スペースや日本語は避けるほうが無難です。
images
、js
、css
などのフォルダを作成し、リソースをまとめておくと管理がしやすくなります。
トップページ(フロントページ)
WordPressは設定によってトップページ(ホームページ)に表示する内容が異なりますが、以下の優先度でテンプレートが読み込まれます。
front-page.php
- 「フロントページ」 として設定した場合に最優先されるテンプレート。
- 通常、固定ページをトップページに割り当てる場合などに使います。
home.php
- 投稿一覧をトップに表示したいときなどに使われるテンプレート。
- ブログのトップページ(最新の投稿一覧など)に使う場合が多いです。
index.php
- すべてのテンプレートの最終フォールバック。
- 他に該当するファイルがない場合は、
index.php
が呼ばれます。
投稿ページ(single.php)
通常の投稿(post)の単一ページ
single.php
- ブログ投稿(Postタイプ)1件分を表示するデフォルトのテンプレート。
投稿ページ専用テンプレート
投稿タイプやスラッグごとに専用テンプレートを作りたい場合、以下のようなファイル名を使うと優先度が高くなります。
single-スラッグ名(or テンプレート名).php
single-投稿タイプ名.php
single.php
たとえば、投稿タイプが news
なら single-news.php
があればそれが優先されます。また、スラッグ名を活用して個別の投稿だけデザインを変えたい場合は、single-〇〇.php
と名付けることで柔軟に対応できます。
固定ページ(page.php)
通常の固定ページ
page.php
- 固定ページ全般(aboutページやcontactページなど)の標準テンプレートです。
固定ページ専用テンプレート
特定の固定ページだけデザインを変えたい場合に、ファイル名を工夫すると優先度が高くなります。
page-スラッグ名(or テンプレート名).php
page.php
また、先ほどのサンプルと同様、冒頭に以下のようなコメントを入れると、管理画面の「固定ページを編集」画面でテンプレートを選択できるようになります。
<?php
/*
Template Name: テンプレート名
*/
?>
一覧ページ(archive.php)
archive.php
カテゴリー一覧やタグ一覧、カスタム投稿タイプの一覧など、アーカイブ一覧ページを表示するのに使われます。
もし archive-{post_type}.php
が存在すれば、その投稿タイプ専用のアーカイブテンプレートが優先されます。
固定ページ
- page.php
基本的な部品テンプレート
WordPressテーマの中では、以下のファイルが**「共通パーツ」**としてよく使われます。
ヘッダー
header.php
<header>
タグだけでなく、<head>
要素やメニューも含むことが多い
サイドバー
sidebar.php
ブログやウェブサイトの右(または左)に配置されるメニューやウィジェットエリア
フッター
footer.php
<footer>
タグ内のコピーライト表示やSNSリンクなど
functions.php
テーマに必要な機能やフックをまとめるファイル。スクリプトやCSSの読み込み、カスタム投稿タイプ登録など
CSS(スタイルシート)
style.css
テーマのメインスタイルシート。テーマ情報(Theme Name など)もここにコメントとして書く必要があります。
WordPressがテーマとして認識するための必須ファイルです。
/*
Theme Name: My Original Theme
Author: Your Name
Version: 1.0
...
*/
カスタム投稿タイプ用のテンプレート
独自の投稿タイプ(例えば event
や product
など)を使う場合、下記のファイルを用意しておくと便利です。
single-{投稿タイプ名}.php
カスタム投稿タイプ「event」の単一投稿を表示する場合 → single-event.php
archive-{投稿タイプ名}.php
カスタム投稿タイプ「event」の一覧ページを表示する場合 → archive-event.php
さらに、固定ページのデザインを別にしたければ page-{投稿タイプ名}.php
なども検討できます(ただし、厳密に言うとカスタム投稿タイプと固定ページは別物です)。
まとめ
テーマフォルダの配置場所
wp-content/themes/
の直下に自作テーマ用のフォルダを作る
テンプレートファイルの優先度
トップページ:front-page.php
→ home.php
→ index.php
投稿ページ:single-{slug}.php
/ single-{post_type}.php
→ single.php
固定ページ:page-{slug}.php
→ page.php
→ index.php
アーカイブ:archive-{post_type}.php
→ archive.php
→ index.php
共通パーツ
header.php
, sidebar.php
, footer.php
functions.php
はテーマの各種機能を定義する重要ファイル
必須ファイル
style.css
(テーマ情報を定義)
WordPressはテンプレート階層という仕組みを使って、ページの種類や条件ごとに適切なテンプレートを呼び出す柔軟性を備えています。
自作テーマを開発する際には、ファイル名や優先度をしっかり理解しておくことで、余計な混乱を防ぎ、効率的にサイトを構築できます。ぜひ参考にしてみてください。
大阪のホームページ制作会社TREVOでは、ホームページ制作に関する情報を掲載しています。最短2日で仮サイトを公開するサービスやSEO対策に特化したホームページ制作、オリジナルホームページデザイン、ライティング、リスティング広告、WEBマーケティングなどのサービスをご紹介しています。