子テーマ使用のメリットと使い方!WordPressのカスタマイズ

更新


ワードプレスには子テーマというシステムがあります。子テーマとは、カスタマイズしたいテーマのうちで改変したいファイルのみをまとめたフォルダーのことです。テーマをカスタマイズするときにとても便利です。

  1. 子テーマを使わないと…
  2. 子テーマを使えば解決
  3. 子テーマフォルダーとstyle.css作成
  4. カスタマイズするファイルを親テーマからコピペ
  5. functions.phpの取り扱いに注意

子テーマを使わないと…

ワードプレスのテーマは意外とバージョンアップされます。特にデフォルトテーマのtwentyelevenの場合はかなり頻度が高いです。

もし、子テーマを作らずにテーマファイルを直にいじっていたら、テーマをアップデートしたときに上書きされるため、今までのカスタマイズが吹っ飛びます。

子テーマを使えば解決

色々いじって改変したファイルを子テーマにまとめておけば、アップデート時に今までのカスタマイズが水泡に帰すことはなくなります。

子テーマの準備

まずは、wp-content/themes/直下に子テーマのフォルダーを作ります。名前は何でもいいですが、私はwebshufu21としました。

次に、以下のようなstyle.cssを作って、今作った子テーマのフォルダーにアップします。

/*
Theme Name: webshufu21
Template: twentyeleven
*/
@import url('../twentyeleven/style.css');

@import url('../twentyeleven/style.css');の部分は、親テーマであるtwentyelevenのstyle.cssの内容をそのまま持ってくるという意味です。

この下に書いたCSSでtwentyelevenのstyle.cssの内容を上書きします。

子テーマのstyle.cssが親テーマのstyle.cssを上書きすることで、カスタマイズが反映される仕組みとなっています。

カスタマイズするファイルを親テーマからコピペ

style.css以外のファイルもカスタマイズするなら、それらのファイルも親テーマからコピペして子テーマのフォルダーの中に置きます。

カスタマイズ時は、それぞれのファイルを直接編集します。

カスタマイズは、子テーマのファイルが親テーマのファイルを上書きすることで反映されます。

ウェブシュフは、とりあえず以下のファイルを子テーマ内に置いています。

  • single.php
  • functions.php
  • content-single.php
  • header.php
  • content.php

functions.phpの取り扱いに注意

ところで、functions.phpだけは、子テーマのファイルが親テーマのファイルを上書きするわけではありません。

子テーマのfunctions.php → 親テーマのfunctions.phpと言う流れで、子テーマと親テーマ両方のfunctions.phpが読み込まれる形式なっています。

そういうわけで、親テーマのfunctions.phpに定義されている関数を、子テーマのfunctions.phpでカスタマイズしても、親テーマの記述が優先されるためうまくいきません。

親テーマのfunctions.phpに定義されている関数は直接ゴリゴリとカスタマイズするほかなさそうです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です