WordPressには子テーマという機能があります。
子テーマは親となるテーマのCSSなどの設定を引き継ぎながら独自のカスタマイズなどを行う際に非常に便利な機能です。
また、親テーマのバージョンアップ時に独自に行ったCSSなどのカスタマイズが無効にならないというメリットもあります。
子テーマを使わずにテーマをバージョンアップすると「style.css」が上書きされ、これまでに行った独自のカスタマイズがリセットされてしまいます。
そのようなことを避けるためにも必ず子テーマを利用してカスタマイズしましょう。
WordPressの子テーマの作り方
WordPressの子テーマの作り方は簡単で「style.css」と「functions.php」を用意するだけです。
style.cssを作成する
まずはCSSを設定するための「style.css」を作成します。
style.cssには以下の２つの項目を最低限設定する必要があります。
今回はWordPressにデフォルトで導入されているテーマ「Twenty Seventeen」の子テーマを作成します。
/* Template:twentyseventeen Theme Name:twentyseventeen-child */
ここで注意が必要なのはTemplateはテーマ名ではなくテーマフォルダー名です。
子テーマの名前はわかりやすものをつけましょう。
ファイルの文字コードは「UTF-8」にしておきます。
functions.phpを作成する
次にfunctions.phpを作成します。
functios.phpにはデフォルトで親テーマのCSSを読みむ処理を記述しておきます。
<!--?php add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' ) ; function 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' )) ; } ?-->
ファイルの文字コードは「UTF-8」にしておきます。
子テーマをWordPressへアップロードする
ここまでで準備は完了なので、子テーマをWordPressに登録します。
登録する方法は２つあり、１つはFTPでサーバへ２つのファイルをアップロードします。
アップロード先は「WordPressをインストールしたディレクトリ/wp-content/themes」に子テーマの名前でフォルダーを作成し、そこへstyel.cssとfunctions.phpをアップロードします。
もう一つは作成した２ファイルをzipで圧縮して、WordPressの管理画面のｎ「外観」→「テーマ」で新規追加で子テーマを登録します。
子テーマが認識されない時
作成した子テーマがうまく認識されない時は以下のことを確認してみてください。
- ファイルの文字コードが「UTF-8」になっているか？
- style.cssの記述内容が正しいか？
- functions.phpで親テーマのCSSを読み込んでいるか？
まとめ
これで子テーマを無事WordPressに登録することができました。
最近では多くのテーマが子テーマを準備してくれているので自作する機会は減ったかもしれませんが、自分で作るも難しくはないのでやり方を覚えておくことをお勧めします。
以上、「WordPressの子テーマの作り方」でした。
