トップページ > WordPressサイト修正・更新ブログ > 子テーマの正しいファイル構成とstyle.cssの書き方

子テーマの正しいファイル構成とstyle.cssの書き方

  • この記事を書いた人
  • Kazuha Tokita
  • 2026.10.24
  • WordPress

子テーマとは、親テーマの機能やデザインを継承しつつ、安全にカスタマイズを行うための仕組みです。

親テーマを直接編集することなく、アップデートの影響を受けずに独自の変更を反映できるため、WordPressサイトを運営するうえで非常に重要な手法となります。

WordPressでサイトを運営していると、デザインを少しだけ変更したい、あるいは特定の機能を調整したいという場面に必ず遭遇しますよね。

そんなとき、多くの初心者が陥りやすい罠が、有効化しているテーマのファイルを直接編集してしまうことです。

私もWordPressを使い始めた当初、親テーマのCSSを直接書き換えてしまい、テーマのアップデート後にすべての変更が消えてしまった苦い経験があります。

あのときの絶望感は今でも忘れられません!

この記事では、そのような失敗を未然に防ぐために、WordPress子テーマの正しい作成方法とファイル構成、そして安全なカスタマイズの手順を詳しく解説します。

子テーマを活用すれば、親テーマのアップデートを恐れることなく、安心してサイトのカスタマイズを楽しめるようになりますよ。

ぜひ最後まで読んで、あなたのサイト運営に役立ててくださいね。

WordPress子テーマの役割と重要性

WordPressにおいて、子テーマはカスタマイズの安全性を担保するための必須ツールです。

親テーマを直接編集してはいけない最大の理由は、テーマのアップデート機能にあります。

WordPressのテーマは、セキュリティ向上や機能追加のために定期的に更新されますが、アップデートを実行するとテーマフォルダ内のファイルはすべて最新版に上書きされてしまいます。

つまり、直接編集したコードはすべて消滅してしまうのです。

子テーマを使うことで、親テーマのファイルを一切触らずに、独自のスタイルや機能を追加できます。

これにより、親テーマのアップデートを適用しても、子テーマに記述したカスタマイズ内容はそのまま保持されるというわけです。

この仕組みを理解しておくことは、長期的にサイトを運営するうえで非常に重要です。

子テーマの主なメリットを以下にまとめました。

  • 親テーマのアップデートでカスタマイズが消えない。
  • 元のテーマファイルを汚さずに安全に修正できる。
  • 必要なファイルだけを作成するため管理が容易。
  • いつでも親テーマの状態にすぐ戻すことができる。

このように、子テーマはWordPressの柔軟性を最大限に活かすための賢い選択肢といえます。

もしあなたがまだ親テーマを直接編集しているなら、今すぐ子テーマへの移行を検討することをおすすめします。

子テーマの正しいファイル構成

子テーマを作成する際は、WordPressが正しく認識できるように適切なディレクトリ構成を守る必要があります。

まず、WordPressのインストールディレクトリ内にある「wp-content/themes/」

フォルダに移動してください。

ここに、子テーマ専用の新しいフォルダを作成します。

フォルダ名は、親テーマの名前の末尾に「-child」

などを付けるのが一般的で分かりやすいでしょう。

例えば、親テーマが「twentytwentyfour」

であれば、「twentytwentyfour-child」

といった具合です。

このフォルダの中に、最低限必要なファイルとして「style.css」

を配置します。

これだけで、WordPressの管理画面から子テーマとして認識されるようになります。

子テーマ作成時のルールを整理しました。

  • フォルダは「wp-content/themes/」の直下に作成する。
  • フォルダ名は半角英数字とハイフンのみを使用する。
  • 必須ファイルは「style.css」の1つだけである。
  • サブディレクトリの中に配置してはいけない。

この構成さえ守れば、WordPressは自動的に子テーマを認識し、テーマ一覧画面に表示してくれます。

非常にシンプルですが、このルールを外れるとテーマとして認識されないため、作成時には必ず確認するようにしてくださいね。

style.cssの正しい書き方と記述例

子テーマの「style.css」

には、そのテーマがどの親テーマを継承しているのかを伝えるための「テーマヘッダー」

を記述する必要があります。

この記述がないと、WordPressは子テーマとして正しく認識できません。

ファイルの冒頭に、以下の形式でコメントを記述してください。

「Theme Name」

には子テーマの名前、「Template」

には親テーマのフォルダ名を正確に入力します。

特に「Template」

の値は、親テーマのフォルダ名と完全に一致させる必要があります。

ここが1文字でも異なると、親テーマとの紐付けが失敗してしまいます。

style.cssの記述例を参考にしてください。

/*

Theme Name: Twenty Twenty-Four Child

Template: twentytwentyfour

*/

この記述を終えたら、ファイルを保存してWordPressの管理画面からテーマを有効化しましょう。

なお、以前はCSSの「@import」

ルールで親テーマのスタイルを読み込む方法が一般的でしたが、現在はパフォーマンスの観点から非推奨となっています。

現在は、次に解説する「functions.php」

を使用してスタイルを読み込むのが公式の推奨手法です。

正しい方法で記述することで、サイトの表示速度を落とさずにカスタマイズが可能になります。

functions.phpで親テーマを読み込む

子テーマの「functions.php」

は、親テーマの機能を拡張したり、スタイルを適切に読み込んだりするために使用します。

先ほど触れた通り、現在は「wp_enqueue_style()」

関数を使ってスタイルシートを読み込むのがベストプラクティスです。

これにより、親テーマのスタイルを読み込んだ後に子テーマのスタイルを適用するという、正しい順序を制御できます。

「functions.php」

を作成し、以下のコードを記述してください。

<?php

add_action( ‘wp_enqueue_scripts’, ‘theme_enqueue_styles’ );

function theme_enqueue_styles() {

wp_enqueue_style( ‘parent-style’, get_template_directory_uri() . ‘/style.css’ );

}

?>

このコードを記述することで、親テーマのスタイルが確実に読み込まれるようになります。

もし子テーマ独自のCSSを反映させたい場合は、この関数内にさらに「wp_enqueue_style」

を追加するか、あるいは親テーマの読み込み後に自動的に読み込まれる仕組みを利用します。

記述時の注意点として、PHPの開始タグ「<?php」

を忘れないこと、そしてファイルの末尾に不要な空白や改行を入れないことが挙げられます。

これらが原因でエラーが発生することがあるため、慎重に作業を進めてくださいね。

子テーマ作成時のよくあるトラブルと解決策

子テーマを作成したのにスタイルが反映されない、あるいはサイトが真っ白になってしまうといったトラブルは、初心者の方によく見られる現象です。

まず確認すべきは、style.cssの「Template」

項目が正しいかどうかです。

ここが間違っていると、親テーマのスタイルが正しく継承されません。

次に、ブラウザのキャッシュを疑ってみましょう。

CSSを更新してもブラウザが古い情報を保持していると、変更が反映されていないように見えることがあります。

シークレットモードで確認するか、キャッシュをクリアしてみてください。

また、functions.phpの記述ミスでサイトが表示されなくなることもあります。

その場合は、FTPソフトやサーバーのファイルマネージャーを使用して、functions.phpを一時的にリネームすることで復旧可能です。

トラブル解決のチェックリストを以下に示します。

  • Template項目は親テーマのフォルダ名と一致しているか。
  • ブラウザのキャッシュをクリアしたか。
  • functions.phpに構文エラーはないか。
  • 親テーマが正しくインストールされているか。

これらのポイントを一つずつ確認すれば、ほとんどのトラブルは解決できるはずです。

焦らずに、一つずつ原因を切り分けていくことが大切ですよ。

よくある質問

Q. 子テーマを作成しないとどうなりますか?

A. 親テーマを直接編集することになり、テーマのアップデート時にカスタマイズ内容がすべて消えてしまいます。

Q. style.cssに何を書けばいいですか?

A. テーマ名と親テーマを指定するTemplate項目を含むヘッダーコメントを記述し、その後にCSSを追記します。

Q. functions.phpは必ず必要ですか?

A. スタイルを正しく読み込むために必要です。

現在はwp_enqueue_style関数を使うのが公式の推奨です。

まとめ:安全なカスタマイズでWordPressを使いこなそう

いかがでしたでしょうか。

子テーマの作成は、WordPressでサイト運営を行ううえで避けては通れない、非常に重要なステップです。

最初は難しく感じるかもしれませんが、一度仕組みを理解してしまえば、これほど便利な機能はありません。

親テーマを直接編集するリスクを避け、アップデートのたびに冷や冷やすることなく、安心してサイトを成長させることができます。

私自身、子テーマを導入してからというもの、カスタマイズに対する心理的なハードルが大きく下がりました。

失敗を恐れずにいろいろなデザインを試せるようになったことで、サイト運営がより一層楽しくなったと感じています。

もし、より効率的にサイトを構築したいとお考えであれば、WordPressの機能を拡張するプラグインや、最新のブロックテーマの活用も検討してみてください。

例えば、WordPress公式プラグインディレクトリには、カスタマイズを補助する便利なツールが数多く公開されています。

これらを組み合わせることで、さらに自由度の高いサイト作りが可能になりますよ。

今回紹介した手順を参考に、ぜひあなたも子テーマを作成して、自分だけの理想のサイトを作り上げてみてください!

あなたのWordPressライフが、より快適で充実したものになることを心から応援しています。

何か分からないことがあれば、いつでも公式ドキュメントを確認しながら、一歩ずつ進んでいきましょう。

最後までお読みいただき、本当にありがとうございました!


WordPressのトラブルはWP.復旧センターに

WP.復旧センターは「ハッキングされた」「表示がおかしい」「ログインできない」などのWordPressのトラブルをスピーディに修復します。

WP.復旧センターにご相談ください >

この記事を書いた人

この記事を書いた人

Kazuha Tokita

WordPress専門ライター

ITテクノロジー学科の大学卒業後、デジタルマーケティングを専門で行う企業にて約10年間WEBディレクターとして活躍する。同時期に、WordPressでWEBサイト制作やWEBメディア運営を行う。
現在は、WordPressの専門ライターとして多方面で活動中。