WordPressでは、テーマを利用することでプログラミングスキルがなくてもWEBサイトを公開することができます。
WordPressでは毎年提供されるデフォルトテーマだけでなく、有志で公開された無料テーマ、洗練されたデザインで使いやすい有料テーマまで幅広く公開されています。
このテーマのデザインや機能を流用しつつカスタマイズする場合は、“子テーマ”という機能を利用します。今回はこの子テーマについて掘り下げて解説します。
WordPressの子テーマ制作は、WordPressのテーマについての基礎について把握しておくことでより理解が深まります。併せてご覧ください。
目次
子テーマの役割
テーマのコードを編集する際には、子テーマを利用することで安全にテーマのデザインや機能を変更することができます。
親テーマで用意されているPHPファイルの同じ階層、同じ名前であるPHPファイルを子テーマに用意することで、そのファイルだけ上書きすることができます。
themes
|
├—ParentTheme // 親テーマ
| |
| ├—header.php
| └—style.css // 以外のファイルは省略
|
└—ChildTheme
|
├—header.php // 親テーマのheader.phpを上書きする
└—style.css // 子テーマにはstyle.cssが必須
子テーマを利用するメリットとして、親テーマが更新されたことによるテーマのリセットを防ぐ目的があります。
WordPressで公開されているテーマは、WordPressの更新などのタイミングで公開されている状態にリセットや更新されることがあります。親テーマを直接修正していた場合は、このタイミングで修正した内容が全て元に戻ってしまうため、公開されているテーマを編集したい場合は必ず子テーマを利用するようにしましょう。
子テーマの作り方
子テーマは、WordPressのテーマが格納されているthemesフォルダの中に新しくフォルダを作成しその中に、子テーマ用のstyle.cssを用意することで作成できます。
子テーマのフォルダ名は、親テーマのフォルダ名に-childをつけた名称にすることがことがおすすめされています。例えば、“Twenty Twenty-Three”テーマ（テーマのフォルダ名は“twentytwentythree”）を親テーマとして、子テーマを作成する場合は“twentytwentythree-child”と命名します。
作成したフォルダ内にstyle.cssを作成し、以下を記述します。“Twenty Twenty-Three”の子テーマを作成する例です。
/*
Theme Name: Twenty Twenty-Three Child
Template: twentytwentythree
*/この時、Template後方に記述する名前は、テーマ一覧上で表示されている名前ではなく、親テーマのフォルダ名であることが注意しましょう。Templateとして設定する名称を間違えると、「壊れているテーマ」「以下のテーマはインストール済みですが、足りない部分があります。」「The parent theme is missing. Please install the "Twenty Twenty-Three" parent theme.」のようなエラー文が表示されます。
正しく子テーマが作成できた場合、外観→テーマから子テーマ用のテーマが表示されるので有効化することで子テーマを適用することができます。
子テーマを利用しているときの注意点
子テーマを利用する上で、よく間違えるポイントをまとめます。
functions.phpとstyle.cssは上書き（オーバーライド）しない
子テーマで新たに同名PHPファイルを作成した場合、ファイルが上書きされ親テーマで記述されたPHPの内容ではなく、子テーマで記述されたコードが利用されます。
この例外として、style.cssとfunctions.phpは、子テーマの新規ファイルとして扱われます。なので、親テーマでstyle.cssやfunctions.phpに記述されている内容は、子テーマによってオーバーライドされることはありません。
include関数で読み込まれたファイルは上書き（オーバーライド）できない
例えば、page.phpでinc/content.phpのPHPファイルを読み込む方法として、WordPress関数であるget_template_part()を利用する方法と、PHPのファイル読み込み関数であるinclude()やinclude_once()を利用する方法があります。
どれもPHPファイルを読み込むこと自体の挙動は同じですが、子テーマの利用の場合で大きな違いが生じます。
子テーマでinc/content.phpファイルを新しく作成した場合、通常WordPressの"子テーマ"としての挙動では、親テーマのinc/content.phpのオーバーライドされます。この挙動は、get_template_part()関数を利用して読み込んでいることが条件で、include()を利用してファイルを読み込んでいる場合、子テーマでのオーバーライドができません。
子テーマのPHPファイルが効かない場合、親テーマの読み込み方法を確認してみましょう。
テーマのディレクトリの取得方法
通常テーマでは、get_template_directory_uri()関数を利用することで、テーマのフォルダパスを取得することができます。
<?php /* 例（faviconの設定） */ ?>
<link rel="icon" type="image/x-icon" href="<?php echo get_template_directory_uri(); ?>/favicon.ico" >get_template_directory_uri()は親テーマのフォルダパスを取得してしまうため、子テーマに格納されているファイルを取得する場合は代わりにget_stylesheet_directory_uri()を利用する必要があります。
まとめ
今回は子テーマについて解説しました。
子テーマは、親テーマのファイルを触らずデザインや機能の追加や修正ができるため、より安全にテーマを修正することができます。ですが、親テーマの修正箇所が多く子テーマのファイルが膨大になる場合は新たにオリジナルのテーマを作成する方が良いでしょう。
子テーマのファイル数が大きくなると、コードの解読の難易度が向上します。保守性を担保するためにも子テーマについてのドキュメントを用意することも重要です。
