WordPressは世界で最も人気のあるコンテンツ管理システム（CMS）であり、その強力なカスタマイズ性は主にテーマシステムによるものです。ウェブサイトの外観を個性化したいけれどもコアコードに手をつけたくない開発者にとって、サブテーマ（Child Theme）は理想的な解決策です。サブテーマを使用すると、親テーマ（Parent Theme）のすべての機能を安全に継承しつつ、必要な部分のみを修正することでカスタマイズを行うことができます。これにより、親テーマのアップデートによって自分が作成したカスタマイズが破壊される心配がありません。この記事では、ゼロから完全に機能するWordPressサブテーマを作成する方法を紹介します。
サブトピックとは何か、そしてその主な利点は何か？
サブテーマとは、独立したWordPressテーマのことであり、別のテーマ（親テーマと呼ばれる）に依存して動作します。サブテーマの基本的な考え方は「継承とオーバーライド」です。サブテーマ自体には通常、スタイルシートと機能ファイルが1つずつしか含まれていませんが、これら2つのファイルを使って親テーマを詳細にカスタマイズすることができます。
サブテーマを使用して開発することには、以下のような代替不可能な利点があります。まず第一に、更新の安全性が向上します。これが最も重要な利点です。親テーマのファイルを直接編集すると、親テーマが更新されるとすべてのカスタマイズ内容が上書きされ、ウェブサイトのスタイルが乱れたり機能が失われたりする可能性があります。しかしサブテーマを使用すると、カスタマイズ内容はサブテーマディレクトリ内に隔離されるため、親テーマをいつでもスムーズに更新しても問題ありません。両者は互いに影響しません。
推薦図書 WooCommerceプラグイン入門ガイド：ゼロからオンラインストアを構築する方法。
次に、開発の効率性です。テーマのすべてのテンプレートファイルをゼロから作成する必要はありません。変更したい部分だけをサブテーマ内で作成すればよいのです。例えば、ウェブサイトのヘッダーを変更したい場合、サブテーマ内で必要な部分のみを作成すればよいのです。 header.php ファイル、その他すべてのテンプレート（例：） single.php、page.phpこれらすべてが自動的に親テーマのバージョンを使用するため、開発効率が大幅に向上しました。
最後に、構造の明確さと移植性についてです。すべてのカスタムコードは独立したテーマフォルダにまとめられており、その構造は一目でわかります。ウェブサイトを新しいサーバーに移行したり、チームメンバーとカスタマイズ内容を共有したりする必要がある場合は、このサブテーマフォルダをコピーするだけで済み、管理が非常に簡単です。
最初のサブトピックディレクトリとファイルを作成してください。
技術的には、サブテーマを構築することは簡単です。特定のファイル構造と命名規則に従うだけでよいのです。まず、WordPressのテーマディレクトリ内で作業を開始する必要があります。 /wp-content/themes/ 以下に新しいフォルダを作成します。このフォルダの名前は、あなたのサブトピックの名前となります。小文字、ハイフン（-）、数字を使用することをお勧めします。例えば： my-first-child-theme。
このフォルダ内で作成しなければならない最初で最も重要なファイルは、スタイルシートファイルです。 style.cssこのファイルにはスタイルルールだけでなく、ファイルヘッダのコメントも含まれており、これがWordPressがサブテーマを認識するための鍵となります。このコメントには特定の情報が含まれていなければなりません。
/*
Theme Name: My First Child Theme
Theme URI: https://example.com/my-first-child-theme/
Description: A child theme of the Twenty Twenty-Six theme
Author: Your Name
Author URI: https://example.com
Template: twentytwentysix
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: my-first-child-theme
*/ご注意ください。Template: この行は非常に重要です。親テーマのフォルダ名と完全に一致していなければならず、大文字と小文字も区別されます。例えば、WordPressのデフォルトテーマである「Twenty Twenty-Six」を使用している場合、そのフォルダ名は「twenty-twenty-six」です。 twentytwentysixでは、ここには必ず書かなければなりません。 twentytwentysixこの宣言によって、WordPressはサブテーマとメインテーマの間の継承関係を確立しています。
推薦図書 WordPressテーマ開発の究極ガイド：ゼロからプロフェッショナルなウェブサイトテーマを構築する。
サブトピックがスタイルを正常に読み込めるようにするためには、通常、もう1つのコアファイルを作成する必要があります。それが機能ファイルです。 functions.phpこのファイルの役割は、親テーマのものと同じです。 functions.php 並行して読み込むだけで、元のデータを上書きするわけではありません。そこにカスタムのPHPコードを追加することもでき、最も重要なのは、それを通じて親テーマと子テーマのスタイルシートを正しくキューに追加することです。
機能ファイルを通じてスタイルを正しく読み込む
サブトピックの中で、functions.php ファイルの主な役割は、通常、スタイルシートの読み込みを管理することです。サブテーマについては… style.css WordPressによって自動的に認識されますが、親テーマのスタイルが優先して正しく読み込まれるようにするためのベストプラクティスとしては、WordPressのアクションフックを使用してキューの管理を明示的に行うことです。
あなたはサブトピック内で必要としています。 functions.php ファイル内に関数を記述し、それを使用してください。 wp_enqueue_scripts このアクションフックを使用してそれを呼び出します。この方法により、ページのヘッダー部分でスタイルシートが正しく、効率的に読み込まれることが保証されます。
以下は標準的な実装例です：
<?php
/**
* Enqueue parent and child theme stylesheets.
*/
function my_first_child_theme_enqueue_styles() {
// 首先加载父主题样式表
wp_enqueue_style(
'parent-style',
get_template_directory_uri() . '/style.css'
);
// 然后加载子主题样式表
wp_enqueue_style(
'child-style',
get_stylesheet_directory_uri() . '/style.css',
array('parent-style'), // 声明依赖关系，确保父主题样式先加载
wp_get_theme()->get('Version') // 使用主题版本号作为缓存破坏参数
);
}
add_action( 'wp_enqueue_scripts', 'my_first_child_theme_enqueue_styles' );上記のコードにおいて、get_template_directory_uri() この関数は、親テーマディレクトリのURIを返します。 get_stylesheet_directory_uri() この関数は、現在アクティブなトピック（つまりサブトピック）のディレクトリのURIを返します。サブトピックのスタイルシートを親トピックのスタイルシートに依存するように設定することで、CSSの階層順序が正しくなるようにしています。つまり、まず親トピックのスタイルが適用され、その後でサブトピックのスタイルがその上に重ねられて補完されるのです。
一般的なサブトピックのカスタマイズを実現する
基礎構造が構築されたら、実際のカスタマイズ作業を開始できます。最も一般的なカスタマイズは、スタイルやテンプレートファイルのレベルで行われます。
推薦図書 WordPressプラグイン開発の徹底解説：ゼロからカスタム機能の拡張を構築する。
スタイルのカスタマイズについては、サブテーマ内で必要な設定を行うだけです。 style.css ファイルに新しいCSSルールを追加します。このルールは親テーマのスタイルよりも後に読み込まれるため、（セレクタの特定性が同じである場合）より高い優先順位を持ちます。例えば、サイト全体のリンクの色を変更したい場合は、以下のようにルールを追加できます：
/* 在子主题的 style.css 文件中 */
a {
color: #3498db; /* 覆盖父主题的链接颜色 */
}
.site-header {
background-color: #2c3e50; /* 修改页头背景色 */
}より複雑なレイアウトや機能の変更を行うには、親テーマのテンプレートファイルを上書きする必要があります。これはサブテーマが持つ最も強力な機能の一つです。操作方法は以下の通りです：変更したい親テーマのテンプレートファイルを… header.php、footer.php または page.php）それをあなたのサブテーマディレクトリにコピーしてください。そうすると、WordPressは自動的にサブテーマディレクトリ内のコピーを使用し、親テーマ内の元のファイルは無視されます。
たとえば、フッターをカスタマイズするには、親テーマの設定を変更する必要があります。 footer.php サブトピックフォルダーにコピーし、そのコピーを開いて編集してください。著作権情報の変更や、ツールバー領域の削除・追加などが可能です。注意していただきたいのは、変更が必要なファイルのみをコピーするようにしてください。親トピック全体をコピーする必要はありません。
また、サブトピック内でも同様の操作が可能です。 functions.php 新しい機能を追加することができます。例えば、新しいサイドバーのツール領域を登録したり、カスタムの記事タイプをサポートしたり、特定のページに追加のスクリプトを読み込んだりすることができます。これらのコードは、セキュリティ上の理由からあなたのサブテーマ内にのみ保持されます。
概要
この記事の手順に従っていれば、ディレクトリ構造の作成、必要なスタイルシートのヘッダ情報の記述、機能ファイルを通じたスタイルの正しい読み込み、そして具体的なスタイルやテンプレートのカスタマイズまでの全プロセスをマスターできました。サブテーマ（Subtheme）はWordPress開発において基本的で非常に重要なベストプラクティスの一つであり、カスタマイズ内容をコアテーマのコードから明確に分離することで、ウェブサイトの長期的なメンテナビリティとセキュリティを確保します。単純な色の調整をしたい場合でも、レイアウトの大幅な再構築を行いたい場合でも、サブテーマから始めることが最も賢明でプロフェッショナルなアプローチです。
FAQ よくある質問
どのWordPressテーマにでもサブテーマを作成することはできますか？
理論的には、WordPressのコーディングスタンダードに準拠し、適切な書式規則を持つテーマならば、どのテーマでもサブテーマとして使用することができます。サブテーマを作成する際には、親テーマの構造や機能を正しく継承しているかを確認するだけでよいのです。 style.css の Template: フィールドに親テーマのフォルダ名を正しく入力してください。
しかし、デザインが非常にシンプルすぎるか構造が特殊なテーマ（例えば、そのスタイルが標準的な方法で読み込まれていない場合）では、サブテーマが正常に動作しない可能性があります。親テーマを選ぶ際には、人気があり、継続的に更新され、ドキュメントが整っているテーマを優先することが一般的により安全な選択です。
サブテーマのfunctions.phpは親テーマのfunctions.phpを上書きするのでしょうか？
いいえ。これはサブトピックに関する最も一般的な誤解の一つです。サブトピックについては… functions.php ファイルは親テーマ内の同名ファイルを上書きすることはなく、親テーマの下に新しいファイルとして保存されます。 functions.php その後、読み込まれます。
これは、2つのファイルに含まれるコードが両方とも実行されることを意味します。サブトピック内で… functions.php 新機能を追加したり、WordPressのフックを使用して既存の動作を変更したりする場合、同じ名前の関数を作成して親テーマの関数を直接「上書き」することはできません。そうするとPHPの致命的なエラーが発生します。親テーマの関数の動作を変更するには、通常、アクションフックやフィルターフックを使用する必要があります。
サブトピックを有効にした後にウェブサイトのスタイルが乱れてしまった場合、どう対処すればよいでしょうか？
サブトピックを有効にした後にウェブサイトの外観が完全に異常になる場合、それは通常、スタイルシートが正しく読み込まれていないためです。以下の手順に従って問題を調査してください：
まず、サブトピックを確認してください。 style.css ファイルヘッダ内の Template: その値が親テーマのフォルダ名と完全に一致していることを確認してください。大文字と小文字も含めてです。これが最も一般的な問題の原因です。
次に、ご自身の…を確認してください。 functions.php ファイル内のコード、特に… wp_enqueue_style 関数の呼び出しに際しては、パスや依存関係の設定が正しくなっていること、そしてPHPの文法エラーがないことを確認してください。関連するエラーメッセージがあるかどうかは、WordPressの「ダッシュボード -> ツール -> サイトの健康状態」で確認できます。
最後に、ウェブサイトとブラウザのキャッシュをすべて削除した後、ページを更新して確認してください。
サブトピック内でカスタムページテンプレートをどのように追加するか？
サブテーマにカスタムページテンプレートを追加する方法は、通常のテーマに追加する方法と全く同じです。サブテーマのディレクトリ内に新しいPHPファイルを作成し、そのファイルの冒頭に特定のコメントブロックを追加するだけで、それがページテンプレートであることを宣言できます。
たとえば、`my_project`という名前のプロジェクトを作成するには、次のようにします： my-full-width.php そのファイルの冒頭には以下の内容を含める必要があります：
<?php
/**
* Template Name: 我的全宽页面
* Description: 一个没有侧边栏的全宽页面模板。
*/その後、このファイルにテンプレートコードを記述することができます。作成が完了すると、WordPressの管理画面でページを新規作成または編集する際に、「ページ属性」の「テンプレート」ドロップダウンリストから「My Fullwidth Page」というオプションを選ぶことができるようになります。
次はどうする？
拡大読書と実践的知識
以下は、この記事のトピックに関連しており、さらに深く読むのに適している。あなたの現在の問題に最も近い記事から優先順位をつけ、徐々に周辺のトピックに広げていく方が良い場合が多い。
日本語