ワードプレスで子テーマを作成する

子テーマって知っているだろうか？テンプレートをカスタマイズする際にバージョンアップで影響されないように、子テーマというものを作成します。

子テーマは、親となるテンプレートファイル群と同じように、ワードプレスのテーマフォルダ(“/wp/wp-content/themes”)に作成したフォルダを指します。通常子テーマには、style.css,functions.phpおよびその他のphpファイル（修正の必要なもののみ）の3種類で構成されます。それでは以下順を追って説明していきます。

子テーマフォルダを作成する

子テーマフォルダは、前述したとおりワードプレスのテーマフォルダに作成します。フォルダ名は何でもかまいませんが、わかりやすくなるように”●●●●●●-child”のように親テーマフォルダ名に”-child”を付加した形になります。フォルダを作成する場合は、親テーマと同じアクセス件を付与してください。

子テーマフォルダ内のファイル構成

子テーマには以下の3種類のファイルで構成されます。

style.css(必須）
functions.php(必須ではありませんが、いづれ必要になると思いますでの空ファイルで作っておきます）
その他のphpファイル(必要な場合のみ）

style.css

style.cssには、子テーマであることを示すヘッダーが必要なります。

ヘッダー形式

style.cssのヘッダーは、以下のような物になります。コピーして必要な部分を書き換えてください


/*
Theme Name: 子テーマ名
Theme URI: 親テーマのサポートページ
Template: 親テーマのフォルダー名
Description: 説明
Author: あなたの名前
Tags:
Version: 子テーマのバージョン情報
*/

この中で、TempleteとTheme Nameは非常に重要となりますので、大文字小文字を間違わずに入力してください。

Templeteに指定するのは親のテンプレート名ではなく、フォルダ名となりますのでご注意を！

style.cssに記述する内容

ここも重要ですのでしっかりと覚えてください。style.cssに記述する内容は、通常のテーマを作る場合と同様で必要なスタイルを全部書きます。とはいっても通常は親テーマの一部のみの書き換えとなるはずですので、先頭に以下の行を追加し、子テーマのstyle.cssで親テーマのstyle.cssをインポートしてください。


@import url("../●●●/style.css");

ここをチェック！使っているテンプレートによっては、子テーマのstyle.cssが読み込まれない場合があります。これは親テンプレートのheader.phpに、どこのstyle.cssを指定しているか確認してください。もしかすると

のような記述がありませんか？
正しくは、

です。子テーマにheader.phpをコピーして該当部分を修正しましょう。

functions.php

ワードプレスの場合、自分独自のカスタム関数を記述しますが特に必要のない場合は空ファイルで構いません。ただし、次に説明するその他のphpファイル群とはふるまいが異なります。それは、functions.phpはまず親テーマのfunctions.phpが読み込まれていますので、ワードプレスのアクションやフック関数は親テーマに記述済みの場合、リムーブもしくは実行するプライオリティを考慮しなければなりません。

その他のphpファイル群

その他のphpファイル群は、例えばheader.php,single.php等の親テーマのphpファイルになりますが、こちらは新規に定義することになりますので、親テーマファイルをコピーしてから必要な部分を修正したファイルになります。以上の3種類のファイルを、子テーマフォルダへ配置すると完成となります。

ここをチェック！組み込んだfunctions.phpが動かない！って悩んでいるあなた。ファイル名functions.phpなので注意しましょう。