• 赤色のリンクは、まだ日本語Codex に存在しないページ・画像です。英語版と併せてご覧ください。（詳細）
• この Wiki はいつでも誰でも編集できます。ログインアカウントの取得からどうぞ :)
• 5月23日に MySQL 4.0 → 5 へ移行しました。動作不良等があればご一報ください （連絡先）

出典: WordPress Codex 日本語版

このページでは、自分用の WordPress テーマの作成とデザインについて説明します。テーマを構築するためのコードの記述についての技術的な内容ですが、テーマの大まかな構造を知っておくと、テーマを少しカスタマイズしたいときにも役立ちます。 テーマの使い方、新しいテーマの入手方法・切り替え方について知りたいときは、テーマの使い方をおさらいしましょう。

これを読めば、きっと自分のオリジナルテーマや配布用テーマ/enを作成したくなることでしょう。

WordPress テーマは、WordPress サイトの外観を作り上げるためのPHP ファイルとスタイルシートのセットです。テーマはそれぞれ異なっていて、ユーザーが外観をすぐに変更できるよう、たくさんの種類があります。では、どうして独自テーマを作るべきなのでしょうか？

• 自分だけのデザインの WordPress サイトを作るため
• テンプレート、テンプレートタグ、WordPress ループ/enを活用し、異なったコンテンツやデザインのサイトを作るため。
• 特定のサイト機能のための代替テンプレートを提供するため。例えばカテゴリーページ/enや検索結果ページなど。
• 複数のサイトレイアウトを入れ替えるため、またはテーマ (スタイル) スイッチャーを活用して、訪問者があなたのサイトの外観を変えられるようにするため。
• 公開テーマを作って、他の人にもあなたのデザインを楽しんでもらうため。

WordPress テーマにはたくさんの利点もあります。

• スタイルとテンプレートファイルをシステムファイル (WordPress コア) から分離し、テーマに大きな影響なくアップグレードできるようになる。
• デザインをカスタマイズして、テーマ独自のページが作れるようになる。
• サイトの外観を素早く変更できる。
• ユーザーがCSS、HTML、PHPを知らなくても良い見かけのサイトが持てるようになる。

なぜ独自テーマを作るべきなのか、考えてみましょう。

• CSS、HTML/XHTML、PHP についてもっと良く知る良い機会だから。
• CSS、HTML/XHTML、PHP についての知識を実際に使ってみる良い機会だから。
• クリエイティブな作業だから。
• (たいていの場合は) 楽しいから。
• もし公開テーマ/enを作成すれば、WordPress コミュニティと何かを共有し、貢献したことで気分が良くなれるから (そう、自慢ができます！)。

WordPress テーマは、wp-content/themes/ の中のサブディレクトリに存在します。例えば、「test」というテーマは、wp-content/themes/test/ ディレクトリにあります。テーマフォルダには、スタイルシートファイル、テンプレートファイル、オプションの関数ファイル（functions.php）、画像といったものが含まれています。

ダウンロードした WordPress には、「Classic」と「Default」という二つのテーマが同梱されています。この二つのテーマでは、ウェブページの表示内容や外観を生成するために、異なる機能やタグを使っています。独自のテーマファイルを作成する方法をよりよく理解するために、これらのテーマを詳しく見ていきましょう。

WordPress テーマは、画像を除くと、大きく分けて次の 3種類のファイルから構成されています。

1. style.css -- テーマの情報 および ウェブページの外観を制御するスタイルシート
2. functions.php -- オプションの関数ファイル
3. テンプレートファイル -- ウェブページとして表示する情報をデータベースから取得し、ウェブページを生成する方法を制御

では、個別に見ていきましょう。

style.css は、テーマの「スタイルシート」情報に加えて、コメントの形式で必ず「テーマについての明細」を記述していなければなりません。管理パネルのテーマ設定ダイアログで問題が生じるので、同じ明細が別のテーマのコメントヘッダにあってはなりません。既存のテーマを複製してあなた用のテーマを作るときは、最初にこの情報を変更してください。 次の例は、テーマ「Rose」のスタイルシートの冒頭の数行にある、スタイルシートヘッダです。

/*   
Theme Name: Rose
Theme URI: テーマのホームサイトの URI
Description: a-brief-description
Author: 作者の名前
Author URI: 作者の URI
Template: 親テーマの定義（オプション）
Version: バージョン番号（オプション）
.
コメント／利用許諾の記述（あれば）
.
*/

最も単純なテーマには、style.css ファイルと、あれば画像だけが含まれます。このようなテーマを作成するには、style.css のヘッダコメント内の Template: 行を編集し、このテーマ用に継承させたいテンプレートのセットを指定する必要があります。例えば、テーマ「Rose」に、別の「test」というテーマからテンプレートを継承させたい場合、Rose の style.css の冒頭のコメントに Template: test と書きます。すると、「test」は、wp-content/themes/Rose ディレクトリにある style.css ファイルと付属画像のみからなる「Rose」の親テーマとなります。さらに (WordPress 2.7 の時点では)、子テーマはテンプレートファイルを含む事もできます。このファイルは通常の通り管理パネルから選択して、親テーマ内の同名のファイルより優先させることができます。

style.css のコメントヘッダ行は、WordPress に「テーマ」として識別させ、有効なテーマとして他のインストール済みテーマとともに 管理パネル > デザイン > テーマ/en 画面に表示させるために必要なものです。

注： 親テーマを定義するとき、コメントヘッダの Template: セクションには、スタイルのディレクトリ名を書かなければなりません。例えば、親テーマとして WordPress Default テーマを使う場合は、Template: WordPress Default ではなく、このテーマのディレクトリ名で Template: default と書きます。

テーマでは、オプションとして、テーマのサブディレクトリ内に functions.php というファイル名で「関数ファイル」を置くことができます。このファイルは基本的にプラグインのような動作をし、現在使っているテーマ内に存在していれば、自動的に WordPress の初期化中に読み込まれます（管理パネルとサイト表示の両方で）。このファイルの使用例：

• テーマ内の複数のテンプレートファイルで使う関数の定義
• 色・様式・その他テーマの外観についてのオプションをユーザが設定できるようにする管理パネルの設置

「Default」WordPress テーマには、関数と管理パネルを定義する functions.php ファイルが入っているので、見本にするといいでしょう。functions.php は基本的にプラグインのように動作するので、このファイルでできることの情報は、プラグインの作成/en リストを見るのが一番です。

テンプレートは、訪問者から要求されたページを生成するために使われる PHP ソースファイルです。テーマの部品として定義できる様々なテンプレートを見てみましょう。

WordPress では、ウェブログの各種の表示を個別のテンプレートとして定義できるようになっていますが、ウェブログ全体を機能させるためにあらゆるテンプレートファイルの全てを揃えなければならないわけではありません。テンプレートは、そのテーマに存在するテンプレートに応じて、テンプレート階層に基づいて選ばれ、生成されます。テーマ開発者としては、カスタマイズしたいテンプレートだけを選んで用意できるのです。極端な例を挙げると、ウェブログとして生成・表示する全てのページ用のテンプレートとして、index.php というテンプレートファイル一つだけを使うこともできます。通常は、最大限のカスタマイズができるように、異なる表示には別のテンプレートファイルを用意します。

最少 2ファイル構成の WordPress テーマ：

• style.css
• index.php

両ファイルはそのテーマのディレクトリ内に置きます。index.php テンプレートファイルはとても融通が利きます。これは、参照するヘッダ・サイドバー・フッタ・コンテンツ・カテゴリ・アーカイブ・検索結果・エラーほか、サイト上で生成されるウェブページの全てに用いることができます。よく使われる部分の担当毎に、モジュール式のテンプレートファイルとして分割することもできます。 あなたが他にテンプレートファイルを用意しなければ、WordPress は内蔵のデフォルトファイルを使います。例えば、comments.php や comments-popup.php テンプレートファイルがないときは、WordPress は テンプレート階層に従って自動的に wp-comments.php や wp-comments-popup.php を使います。これらのデフォルトテンプレートがあなたのテーマに合わなければ、自分で用意したいと思うことでしょう。通常、分割に用いる基本的なファイルは次のとおりです（テーマのディレクトリに加えます）。

• header.php
• sidebar.php
• footer.php
• comments.php
• comments-popup.php

これらのモジュールテンプレートファイル使うには、最終的に生成するウェブページ内に表示したいユニットを読み込む／取得（get）するためのマスターファイル index.php 内に、テンプレートタグを書きます。

• ヘッダ部の読み込みには get_header() テンプレートタグを使用。
• サイドバーの読み込みには get_sidebar() テンプレートタグを使用。
• フッタ部の読み込みには get_footer() テンプレートタグを使用。

include の使用例：

<?php get_sidebar(); ?>

<?php get_footer(); ?>

各種テンプレートの動作や異なる情報を表示する方法については、テンプレートをご覧ください。

WordPress では、各クエリ（要求）タイプによって異なるテンプレートをロードできます。これには二つの方法があります。内蔵の テンプレート階層の一環とするものと、テンプレートファイルのループ内で条件タグを用いる方法です。

テンプレート階層を使うには、通常、index.php を自動的に無効にする専用のテンプレートファイルが必要です。例えば、テーマに category.php というテンプレートがあり、カテゴリページが要求されると、index.php の替わりに category.php がロードされます。category.php が存在しなければ、従来どおり index.php が使われます。

テンプレート階層では、さらに特定の用途の、例えば category-6.php のようなファイルを取得できます。-- このファイルは、カテゴリID 6 のページを生成する際に category.php に替わって使われます（バージョン 2.3 以下では、カテゴリID は ログイン中に 管理（Manage） > カテゴリー（Categories）で確認できます）。バージョン 2.5 では ID カラムが管理パネルから削除されました。 'カテゴリーを編集' をクリックして URL の '...categories.php?action=edit&cat_ID=3' という部分を確認して下さい (cat_ID=3 なので カテゴリー ID は 3)。この詳細は、カテゴリテンプレート/en をご覧ください。

テンプレート階層よりもさらにテンプレートファイルの制御が必要な場合、条件タグが使えます。条件タグは通常、ある特定の条件に当てはまるかをWordPress ループ/en 内でチェックしてから、その条件に基づいて、特定のテンプレートをロードしたり画面に特定のテキストを配置したりします。

例えば、ある特定のカテゴリに属する記事にのみ独自のスタイルを生成するには、次のようなコードになります。（訳注： 一つ目の例は、原文で is_category(9) となっているが、単体記事表示時であれば in_category() を使う。）

<?php
if (is_category(9)) {
   // カテゴリ 9 に当てはまるとき
   include(TEMPLATEPATH . '/single2.php');
} else {
   // 他のカテゴリの記事のとき
   include(TEMPLATEPATH . '/single1.php');
}
?>

あるいは、クエリを用いて次のようにします。（参考）

<?php
$post = $wp_query->post;
if ( in_category('9') ) {
   include(TEMPLATEPATH . '/single2.php');
} else {
   include(TEMPLATEPATH . '/single1.php');
}
?>

どちらのコードの例も、表示しようとしている記事のカテゴリに応じてテンプレートを使い分けています。クエリ条件はカテゴリに限りません。 -- 全てのオプションについては 条件タグのページをご覧ください。

この機能は 現在のところ、WordPress 2.5 以降で正しく動作しません。

Wordpress uses media icons to represent attachment files/en on your blog and in the Admin interface, if those icons are available.

It looks for image files named by media type in the images directory of the current theme. (As of Wordpress 2.2, the default theme comes with only one media icon, audio.jpg.)

For example, for an attachment of MIME type audio/mpeg, Wordpress would look for an icon file at these locations, stopping after the first match (see wp_mime_type_icon/en):

1. my_theme/images/audio.jpg
2. my_theme/images/audio.gif
3. my_theme/images/audio.png
4. my_theme/images/mpeg.jpg
5. my_theme/images/mpeg.gif
6. my_theme/images/mpeg.png
7. my_theme/images/audio_mpeg.jpg
8. my_theme/images/audio_mpeg.gif
9. my_theme/images/audio_mpeg.png

WordPress が認識するテーマテンプレートファイルの一覧は次のとおりです。もちろん、他のスタイルシート・画像・ファイルもテーマに含めることができます。ただ、以下のファイルが WordPress にとって特別な意味を持つことは覚えておいてください。さらなる情報はテンプレート階層をご覧ください。

style.css

メインのスタイルシート。テーマにはこのファイルが必須で、テーマのヘッダ情報を含まなければなりません。

index.php

メインテンプレート。（親テーマのテンプレートを利用するのではなく）このテーマ自身のテンプレートを設けるなら index.php は必須。

comments.php

コメントテンプレート。存在しなければデフォルトテーマの comments.php が使われる。

comments-popup.php

ポップアップコメントテンプレート。存在しなければデフォルトテーマの comments-popup.php が使われる。

home.php

ホームページテンプレート。

single.php

単体記事テンプレート。個別記事が要求（クエリ）されたときに使用。このクエリテンプレートが存在しないときは index.php が使われる。この他のクエリテンプレートも同様。

page.php

ページテンプレート。特定のページが要求されたときに使用。

category.php

カテゴリテンプレート/en。あるカテゴリが要求されたときに使用。

author.php

著者テンプレート/en。ある著者が要求されたときに使用。

date.php

日時テンプレート。ある日付または時刻が要求されたときに使用。年・月・日・時・分・秒

archive.php

アーカイブテンプレート。あるカテゴリ・著者・日付が要求されたときに使用。このテンプレートは、各クエリ種類に対応する category.php、author.php、date.php によって無効となる。

search.php

検索結果テンプレート。ある検索が実行されたときに使用。

404.php

404 Not Found/en テンプレート。WordPress が要求に合う記事やページを見つけられなかったときに使用。

これらのファイルは、テンプレート階層に従って適用できるファイルがあるときや、対応する条件タグ（別名 is_*() 関数）が true を返すとき、index.php に代わって使われるため、WordPress にとって特別な意味を持ちます。例えば、単体記事が表示される際に is_single() 関数は 'true' を返し、有効になっているテーマ内に single.php ファイルがあれば、ページの生成にはこのテンプレートが使われます。

WordPress のデフォルトテーマ（WordPress 1.2 用の Michael Heilemann の Kubrick レイアウトが元）は、テンプレート上へのクエリの配置方法のよい見本です。

コード <?php bloginfo('template_directory'); ?> は、テンプレートの出力にテンプレートディレクトリの URL を挿入します。テーマ内のファイルを参照するために、この出力にさらに URI 情報を付け足すこともできます（例： <?php bloginfo('template_directory'); ?>/style.css とすると、http://www.example.com/wordpress/wp-content/themes/default/style.css と出力）。

コード <?php bloginfo('stylesheet_directory'); ?> は、現在のテーマのスタイルシートが入っているディレクトリの URL を、テンプレートの出力に挿入します。テーマ内のファイル、具体的には、スタイルシートに使うファイルを参照するために、この出力にさらに URI 情報を付け足すことができます（訳注： 'stylesheet_directory' パラメータは WordPress 2.3.1 から非推奨です。）

定数 TEMPLATEPATH は、現在のテーマのテンプレートディレクトリへの絶対パス（末尾の / を除く）への参照です。

スタイルシート内で使われている URL は、スタイルシートファイルに対する相対パスになっている事に注意して下さい。スタイルシートを読み込んでいるページに対する相対パスではありません。これにより、ディレクトリを指定するために CSS ファイルに PHP コードを書く必要がなくなります。例えば、テーマ不フォルダ内に images/ ディレクトリを含めた場合、CSS では以下のように書きます。

h1 { background-image: URL(images/my_background.jpg); }

これで、どのページから見ても画像が正しく表示されます。

WordPress を使って追加のカスタムテンプレートを定義する事もできます。この上級者向け機能を使うには、template_redirect というアクションフックを利用します。詳しくはプラグイン API のページを参照して下さい。

テーマを作成する時、どのプラグインを入れても動くようにしておくと良いでしょう。プラグインは"アクションフック"を通し、WordPress に対して拡張機能を追加します（詳しくはプラグイン API を参照）。アクションフックの多くは WordPress のコア PHP コードの中にあるため、これらのみを使う場合はテーマファイルに特別なタグを入れる必要はありません。しかし、テーマのヘッダー、フッター、サイドバー、本文などに直接情報を表示するためには、いくつかのタグ必要です。以下が含めるべきアクションフックテンプレートタグの一覧です。

wp_head

HTML の <head> 要素内に挿入する。header.php テンプレート用。プラグインによるフック使用の例: JavaScript コードを <head> 内に書き込む。

使い方: <?php do_action('wp_head'); ?>

または <?php wp_head(); ?>

wp_footer

テーマのフッター部分に挿入する。footer.php テンプレート用。プラグインによるフック使用の例: ページが読み込まれる最後に実行する PHP のコードをフッター下に挿入する。

使い方: <?php do_action('wp_footer'); ?>

または <?php wp_footer(); ?>

wp_meta

一般的には、テーマのメニューまたはサイドバーの <li>Meta</li> セクションに含める。sidebar.php テンプレート用。プラグインによるフック使用の例: 広告スイッチャーやタグクラウドを表示させる。

使い方: <?php do_action('wp_meta'); ?>

または <?php wp_meta(); ?>

comment_form

comments.php および comments-popup.php のコメントフォーム終了タグ (</form>) の直前に含める。プラグインによるフック使用の例: コメントプレビューを表示させる。

使い方: <?php do_action('comment_form', $post->ID); ?>

実際のテーマ内での使い方の例については、デフォルトテーマのファイルに書かれたフックを探してみてください。

テーマのドキュメンテーションには以下の内容を分かりやすく書いて下さい (テーマフォルダに README ファイルを入れておくと、多くのユーザーがツマづく可能性を防ぐ事ができるでしょう):

1. このテーマとテンプレートファイルでできることをはっきり説明する。
2. 標準のテーマ階層の命名法則に従う。
3. テーマにできない事があれば知らせる。
4. 特別な変更があれば、テンプレートやスタイルシートファイルの コメント/en ではっきり言及する。テンプレートファイルと相互関係がある場合は、変更点、テンプレートのセクション、CSS スタイルにコメントを加える。Add comments to modifications,
5. 特別な必要条件 (カスタムのリライトルール、追加の特別なテンプレート・画像・ファイルなど) があるなら、テーマを使うために必要なステップを明確に書く。
6. テーマを複数のブラウザでテスト/enして、少なくともいくつか、ユーザーがあとで遭遇するかもしれないレイアウトの問題/enを見つけるようにする。
7. サポート情報や質問のために、連絡先（サイトまたはメールアドレス）を記入する。

時間をとって、公開テーマのデザインについて書かれたページ/enを読んでおきましょう。

WordPress サイトデザイン リファレンスには、WordPress テーマおよびテンプレートファイルに関する資料の一覧があります。

原文・最新版： WordPress Codex » Theme Development （最新版との差分）