WordPressの子テーマとは？作り方と使うべき理由

ブログ運営
Picsum ID: 549

※当サイトはアフィリエイトプログラムに参加しています

子テーマを使わないと、カスタマイズが全部消える

WordPressのテーマをアップデートしたら、CSSの変更やfunctions.phpに書いたコードが消えた——これは子テーマを使っていなかった人が必ず通る道だ。

子テーマとは、親テーマ（元のテーマ）の機能を引き継ぎつつ、自分のカスタマイズだけを別管理できる仕組みのこと。親テーマがアップデートされても子テーマのファイルは上書きされないので、カスタマイズが消えない。

子テーマの仕組みをざっくり理解する

WordPressのテーマは複数のテンプレートファイル（header.php、single.phpなど）で構成されている。子テーマに同名のファイルを置くと、そちらが優先的に読み込まれる。これが子テーマの基本原理だ。

読み込み順：

  1. 子テーマにファイルがあれば → 子テーマのファイルを使う
  2. 子テーマになければ → 親テーマのファイルを使う

つまり、変更したいファイルだけ子テーマに置けばいい。全ファイルをコピーする必要はない。

子テーマの作り方【3ステップ】

ステップ1：子テーマ用フォルダを作る

wp-content/themes/の中に子テーマ用のフォルダを作る。親テーマが「flavor」なら「flavor-child」のように命名するのが一般的だ。

ステップ2：style.cssを作成する

子テーマに最低限必要なのはstyle.cssとfunctions.phpの2ファイル。まずstyle.cssから。

/*
Theme Name: Flavor Child
Template: flavor
*/

Templateには親テーマのフォルダ名（テーマ名ではない）を正確に記述する。ここを間違えると子テーマが動かない。

ステップ3：functions.phpを作成する

親テーマのスタイルシートを読み込むためのコードを書く。

<?php
add_action( 'wp_enqueue_scripts', function() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(), array('parent-style') );
});

これで親テーマのCSSが先に読み込まれ、その後に子テーマのCSSが適用される。上書きしたいスタイルはstyle.cssに追記すればOKだ。

子テーマを有効化する

FTPまたはファイルマネージャーで子テーマフォルダをアップロードしたら、管理画面の「外観→テーマ」に子テーマが表示される。子テーマを有効化すれば完了。親テーマは有効化せず、インストールされた状態のまま残しておくこと（削除すると子テーマが動かなくなる）。

子テーマでよくやるカスタマイズ

CSSの追加・変更

子テーマのstyle.cssに書くか、管理画面の「外観→カスタマイズ→追加CSS」に書く。少量の変更なら追加CSSのほうが手軽だ。

functions.phpへのコード追加

ショートコードの追加、ウィジェットの登録、アクションフックの追加など。子テーマのfunctions.phpに書けば親テーマのアップデートで消えない。

テンプレートファイルの上書き

例えば記事ページのレイアウトを変えたい場合、親テーマからsingle.phpを子テーマにコピーして編集する。ただし、親テーマの大規模アップデートでテンプレート構造が変わると、古いファイルのまま残って不具合が出ることもある。テンプレートの上書きは最小限に留めよう。

子テーマを使うべき理由

  • アップデートでカスタマイズが消えない：最大のメリット。セキュリティパッチのために安心してアップデートできる
  • 変更履歴がわかりやすい：自分が何を変えたか、子テーマを見ればすぐわかる
  • 元に戻しやすい：子テーマを無効化すれば、親テーマの初期状態に即座に戻せる
  • テーマ開発の練習になる：WordPressのテーマ構造を理解する第一歩として最適

子テーマが不要なケース

すべての場面で子テーマが必要なわけではない。

  • テーマを一切カスタマイズしない場合
  • カスタマイズがCSS数行だけで「追加CSS」で済む場合
  • テーマ側が子テーマを同梱している場合（AFFINGER6、SWELLなどは最初から子テーマが用意されている）

よくあるトラブルと対処法

子テーマが認識されない

style.cssのTemplateが間違っている可能性大。親テーマのフォルダ名を正確に確認しよう。

デザインが崩れる

functions.phpで親テーマのスタイルを正しく読み込んでいない場合に起こる。wp_enqueue_styleの記述を見直そう。

親テーマの機能が動かない

子テーマのfunctions.phpでremove_action等を使って親テーマのフックを外してしまっていないか確認。

まとめ

子テーマは「WordPressを安全にカスタマイズするための保険」だ。作成は5分もかからない。面倒に感じるかもしれないが、一度やっておけばアップデートのたびにヒヤヒヤしなくて済む。まだ子テーマを使っていないなら、次のテーマアップデートの前に作っておこう。

これからWordPressを始めるなら、エックスサーバーかConoHa WINGのクイックスタートで環境を用意すれば、子テーマの練習もすぐに始められる。

🚀 OneTapClaw で作業を自動化する

コメント