monoの開発ブログ

子テーマを使ってWordPressのテーマを簡単に改造する

子テーマを利用すると、元となるテーマ(親テーマ)のファイルに変更を加えることなくカスタマイズすることができます。子テーマを利用すると、変更点を分かりやすくしたり、親テーマのバージョンアップ時にカスタマイズした内容がリセットされるのを防ぐことができます。

子テーマの作成

子テーマを作成する場合、wp-content/themesにテーマのディレクトリを作成し、style.cssの冒頭で親テーマを指定します。

cd wordpress/wp-content/themesmkdir blog.monoweb.infovi blog.monoweb.info/style.css



/*Theme Name:     blog.monoweb.infoTheme URI:      http://blog.monoweb.info/Author:         monoAuthor URI:     http://monoweb.info/Template:       glossyblueVersion:        1.0*/

子テーマの動作

子テーマは、子テーマのディレクトリにファイルが存在すればそのファイルを、存在しなければ親テーマのファイルを参照するというように、親テーマをファイル単位でオーバライドするような挙動になっています。そのため、変更したいファイルだけを親テーマからコピーしてきて編集したり、親テーマに存在しないファイルを子テーマで定義することができます。

特にCSSの場合は、@importを使うことで親テーマのCSSを生かしたまま変更を加えることができます。

/*Theme Name:     blog.monoweb.infoTheme URI:      http://blog.monoweb.info/Author:         monoAuthor URI:     http://monoweb.info/Template:       glossyblueVersion:        1.0*/@import url('../glossyblue/style.css');a { /* ... */}