2025.3.22
WordPressでホームページを作ろう【テーマ開発】
テーマとは
WordPressの「テーマ」は、サイトの見た目やレイアウトを決めるもの。
HTMLやCSSのテンプレートに加えて、PHPで動的にデータを扱う処理も含まれている。
無料・有料問わず多数のテーマが配布されているが、要件に合わない場合は自作する。
やることとしては、以下の技術が中心：
- PHP（テンプレート処理）
- CSS（スタイリング、今回は取り扱わないよ）
- JavaScript（必要に応じて、今回は取り扱わないよ）
テーマの作り方（最小構成）
wp-content/themes/配下に新しいフォルダを作る（任意のテーマ名）- その中に最低限
index.phpとstyle.cssを用意
この2ファイルがあれば、WordPressはそのディレクトリを「テーマ」として認識する。style.css にはテーマのメタ情報を記述する必要がある。
cssコピーする編集する/*
Theme Name: Sample Theme
Author: Your Name
Version: 1.0
*/
あとは管理画面の「外観 > テーマ」から該当テーマを有効化すれば適用できる。
固定ページごとのテンプレート
特定の固定ページ（例：Aboutページ）にだけ適用されるテンプレートを作るには、テンプレート階層を活用する。
たとえば、スラッグが about の固定ページがある場合：
- テーマディレクトリに
page-about.phpを作成 - このファイルに該当ページ専用のHTMLやPHPを記述
これで、/about にアクセスした際に page-about.php が適用される。
テンプレート階層は WordPress のルールに従って上から順に評価される。
公式ドキュメントの図（Template Hierarchy）を見ておくと便利。
カスタムフィールドの追加（ACF）
WordPressの固定ページに「本文」以外の要素を追加したい場合、ACF（Advanced Custom Fields）プラグインが便利。
例えば、以下のような項目を管理画面から入力・出力できるようにする：
- サブタイトル
- ボタンのリンク
- サムネイル画像 など
基本的な使い方
- ACFプラグインをインストール・有効化
- 管理画面に追加された「カスタムフィールド」からフィールドグループを作成
- フィールドを追加し、それぞれに「ラベル」と「フィールド名」を設定
- 表示条件で「特定の固定ページ」のみに出すように指定
入力された値は、テンプレート上で the_field() 関数を使って取得する。
phpコピーする編集する<?php the_field('custom_field_name'); ?>
ACFの操作はGUIで完結するため、非エンジニアと分担してサイトを構築する場合にも扱いやすい。
よく使うフィールドタイプ
用途によってフィールドタイプを選ぶと管理画面が整理しやすくなる。以下は代表的なもの：
| フィールドタイプ | 用途例 |
|---|---|
| テキスト | サブタイトルなど短い文章 |
| テキストエリア | 補足説明、キャプションなど |
| 画像 | アイコンやサムネイル指定 |
| URL | ボタンリンクなど |
| True/False | 表示／非表示の切り替え |
細かい仕様や他のフィールドについては、公式ドキュメントが分かりやすい。
まとめ
WordPressのテーマ開発は、HTMLやCSSの延長で構築できるが、テンプレート階層やPHPの知識も求められる。
基本的な流れとしては：
- テーマディレクトリを作成
- ページごとのテンプレートを用意
- 必要に応じてカスタムフィールドを追加・出力
今回は静的な固定ページを対象としたケースを中心に整理したが、今後は投稿ページやカスタム投稿タイプ、ループ処理などにも対応していく予定。