WordPress子テーマの作り方と使い方|必要性・注意点も解説

WordPressの子テーマとは?作成方法と使い方を初心者向けに解説

WordPressの子テーマは、既存テーマのデザインや機能を引き継ぎながら、自分の変更を別ファイルとして管理するテーマです。親テーマを更新しても変更を残しやすい一方、CSSを数行追加するだけなら必ずしも必要ではありません。

クラシックテーマとブロックテーマでは、変更を保存する場所やファイルの役割が異なります。必要性の見分け方から手動作成、反映されない場合の対処まで説明します。

WordPressの子テーマとは

親テーマが完成したデザインと機能を持ち、子テーマが差分を追加・上書きします。WordPress公式のTheme Handbookでは、子テーマのstyle.cssにあるTemplateヘッダーで親テーマのフォルダー名を指定します。

子テーマを有効化しても、親テーマは削除できません。表示時には両方が使われ、テンプレートは同名の子テーマ側が優先されるものがあります。一方、functions.phpは親を置き換えず、子と親の両方が読み込まれます。

子テーマが必要なケース・不要なケース

次のような変更を更新後もファイルとして維持したいなら、子テーマが役立ちます。

  • テンプレートファイルやテンプレートパーツを上書きする
  • テーマに関係するPHP処理を追加する
  • 複数のCSSや画像を含む変更を配布・バージョン管理する
  • theme.jsonの設定を子テーマ側で調整する

色や余白を数行だけ変え、管理画面内で完結したい場合は追加CSSで足りることがあります。テーマに依存しない機能、カスタム投稿タイプ、外部API連携などは子テーマではなく専用プラグインへ分けるほうが、テーマ変更時も維持しやすくなります。変更が親テーマ全体に及ぶなら、独立したテーマとして設計し直す選択もあります。

子テーマ・親テーマ・追加CSSの違い

保存先適する変更更新時の扱い主な弱点
親テーマ配布元が提供する本体更新で置き換わる直接編集した差分が消える
子テーマテンプレート、CSS、テーマ関連PHP親更新と分離できる親の仕様変更への追従が必要
追加CSS小規模な見た目の調整データベースに保存されるファイル管理や複雑な変更に不向き

見た目だけの軽い変更は「追加CSSとの使い分け」を参考にします。どの方法でも、親テーマの更新によってHTMLのクラス名やテンプレート構造が変われば、差分が効かなくなる可能性があります。

子テーマを作る前に確認すること

まずテーマ配布元が公式子テーマを提供していないか調べます。提供されていれば、そのファイルと手順を優先します。すでにサイトエディターやカスタマイザーで変更済みなら、設定がデータベースに保存されているのか、子テーマへ移す必要があるのかも整理します。

作業前にはサイト全体をバックアップし、ステージング環境を用意します。親テーマのフォルダー名、クラシック/ブロックの種類、現在有効なバージョンを控えます。子テーマを有効化すると、メニュー位置、ウィジェット、カスタマイザー設定の再割り当てが必要になるテーマもあるため、公開画面のスクリーンショットを残すと比較しやすくなります。

公式配布の子テーマをインストールする方法

配布元サイトから、使用中の親テーマに対応する子テーマZIPを取得します。第三者が再配布したファイルは避けます。

  1. 親テーマを更新し、指定された対応バージョンにそろえる
  2. 「外観」→「テーマ」→「新しいテーマを追加」を開く
  3. 子テーマZIPをアップロードしてインストールする
  4. ライブプレビューで主要ページを確認する
  5. 子テーマを有効化し、メニューやロゴなどの設定を確認する

すでに親テーマを直接編集していた場合、その変更が自動で子テーマへ移ることはありません。差分を確認し、必要なものだけを子テーマへ移します。

クラシックテーマの子テーマを手動で作る

自作前に「テーマの選び方」で親テーマの更新状況や子テーマ対応を確認します。最小構成は、子テーマ用フォルダーとstyle.cssです。例として親テーマのフォルダー名がsample-parentなら、wp-content/themes/sample-child/style.cssへ次のヘッダーを書きます。

/*
Theme Name: Sample Child
Template: sample-parent
Version: 1.0.0
*/

Templateは親テーマの表示名ではなく、フォルダー名と完全に一致させます。CSSを確実に読み込む必要がある場合は、親テーマがどのスタイルを読み込んでいるか調べてからfunctions.phpで子テーマのスタイルを登録します。

<?php
add_action( 'wp_enqueue_scripts', 'sample_child_enqueue_styles' );

function sample_child_enqueue_styles() {
    wp_enqueue_style(
        'sample-child-style',
        get_stylesheet_uri(),
        array(),
        wp_get_theme()->get( 'Version' )
    );
}

親テーマが子テーマのスタイルまで読み込む場合や、別のCSS構成を持つ場合はコードが異なります。公式子テーマや親テーマの開発文書を優先してください。

ブロックテーマで子テーマを作る場合

ブロックテーマでもstyle.cssのテーマヘッダーとTemplateが子テーマの基本です。ただし、見た目の設定はCSSだけでなくtheme.jsontemplatespartspatternsで管理されることがあります。

親テーマと同名のテンプレートファイルを子テーマへ置くと差し替えられます。必要な部分だけを子へ置き、親の全ファイルを複製しないほうが更新差分を追いやすくなります。また、サイトエディターで保存したユーザーカスタマイズはデータベース側にあり、子テーマのファイルより優先される場合があります。ファイルを直しても変わらないときは、サイトエディターのカスタマイズをリセットできるか検証環境で確認します。

プラグインで子テーマを作る方法

子テーマ生成プラグインは、テーマ情報の読み取り、フォルダー作成、スタイルの準備を補助します。サーバーへ直接ファイルを作るため、実行前にバックアップを取り、利用中の親テーマを正しく選びます。

生成後は、子テーマのTemplate、読み込まれるCSS、作成されたfunctions.phpを確認してください。生成プラグインを停止しても子テーマが独立して動くかを検証し、作成後に不要なら削除します。ブロックテーマのtheme.jsonやサイトエディター上の変更まで希望どおり移るとは限りません。

style.css・functions.php・テンプレートを編集する

style.cssはテーマ情報とCSS、functions.phpはテーマにひも付くPHP処理、テンプレートはページ構造の変更に使います。PHPの具体的な安全策は「functions.phpの編集」も参照してください。

子テーマのfunctions.phpは親より先に読み込まれ、親のファイルを上書きしません。親の関数を丸ごとコピーすると同名関数の再定義で致命的エラーになることがあります。フックで追加・解除できるか、親関数が差し替え可能な書き方かを確認します。

テンプレートは親から必要な1ファイルだけを同じ相対パスへコピーし、差分を最小にします。変更理由と親テーマの元バージョンをコメントや履歴へ残すと、親更新時に比較できます。秘密鍵やパスワードをテーマファイルへ書かないでください。

子テーマが反映されないときの対処

反映しない原因をファイル、優先順位、キャッシュに分けます。

  1. 子テーマが有効で、親テーマもインストール済みか確認する
  2. style.cssTemplateが親フォルダー名と一致するか見る
  3. ブラウザーの開発者ツールで子テーマCSSが読み込まれているか調べる
  4. CSSセレクターの詳細度と読み込み順を確認する
  5. テンプレートのファイル名と相対パスを親と一致させる
  6. サイトエディターに保存されたテンプレートが優先されていないか調べる
  7. ページ、CDN、ブラウザーのキャッシュを更新する

PHP編集後に白い画面になった場合は、ファイルマネージャーやSFTPなど管理画面外の復旧手段で直前変更を戻し、エラーログを確認します。

子テーマ作成・更新時の注意点

子テーマは親テーマ更新の影響をなくす仕組みではありません。親のHTML構造、関数、テンプレート引数が変われば、古い上書きファイルが新機能やセキュリティ修正を取り込めない場合があります。

更新前に親の変更履歴を読み、ステージング環境で代表ページ、フォーム、モバイル表示を確認します。子テーマをGitなどで管理し、親からコピーしたファイルを一覧化しておくと比較が容易です。使わない古いテンプレートは残さず、親の最新版をそのまま使えるものは子から削除します。

よくある質問

Q
子テーマは後から導入できますか?
A

導入できます。ただし、親テーマを直接編集した差分やカスタマイザー設定が自動移行されるわけではありません。検証環境で差分と設定を移してから切り替えます。

Q
子テーマ使用中に親テーマを削除できますか?
A

削除できません。子テーマは親テーマのテンプレートや機能を引き継ぐため、対応する親テーマをインストールしたままにします。

Q
子テーマを使うとサイトは遅くなりますか?
A

子テーマであること自体より、追加したCSS、JavaScript、PHP処理、重複読み込みが速度へ影響します。開発者ツールと計測で追加分を確認してください。

まとめ

WordPressの子テーマは、親テーマの更新と自分のファイル変更を分離するために使います。小さなCSSなら追加CSS、テーマ非依存の機能ならプラグインと使い分けましょう。手動作成ではstyle.cssTemplateを親フォルダー名に一致させ、クラシックとブロックのファイル構成に合わせます。親更新のたびに上書きテンプレートを検証する運用まで含めて導入することが重要です。

この記事を書いた人

Hara Daizo

Hara Daizo

Web制作会社、Web担当者などを経て独立。19年以上の実務経験で培った制作スキルとSEOノウハウを活かし、現在はSTARRY代表としてWordPressサイト制作・集客サポートを提供。大手クラウドソーシングのWebデザイナーランキング上位受賞多数。