TwentyFourteenの子テーマを作ってみた件!カスタマイズの内容によっては『子テーマ』を作りましょう!

いざ!wordpressのカスタマイズ!

さて、どんな風にカスタマイズしたいか。

その内容によっては、『子テーマ』を作った方が良いこともあります。

icons-php

・そもそも子テーマって?

・なんで子テーマを作るの?

・子テーマのメリットは?

といった部分を解説して行きたいと思います。

そもそも子テーマって?

子テーマとは、既存のテーマを親に持つテーマです。
って、そのままですね。。

親・子という関係で表現されていますが、子テーマにあるファイルが優先的に読み込まれます。(同名のファイルが上書きされる)

なんで子テーマを作るの?

カスタマイズの内容によっては、テンプレートファイル(header.phpやpage.phpなど。)に直接手を入れなくてはなりません。

もちろん、テーマ編集から、直接ファイルを編集することも可能ですが、テーマをアップグレードすると、せっかく記述した内容が水の泡になってしまいます。

しかし、テーマのアップグレードにはバグを修正する内容が含まれていることもあるので、アップグレードはしたい!

そんな時に便利なのがこの『子テーマ』なんですね。

子テーマのメリットは?

ズバリ、親テーマをそのままにした状態で、そのテーマをカスタマイズできるという点です。

・親テーマにあるheader.phpだけカスタマイズしたい

・親テーマのCSSを読み込みつつ、上書きしたい

そんな時に導入しましょう。

子テーマのfunction.phpには注意

function.phpに関しては注意が必要です。
エラーがおきる可能性もあります。
こちらの記事が参考になりました。
http://presentnote.com/child-theme-customaize-functions-php/

さて、twentyfourteenの子テーマの作り方ですが、やってみると拍子抜けするくらい簡単です。
ノンプログラマーの僕でも簡単に導入できました。

CSSの上書き用に最低限必要なのは
・子テーマ用のフォルダ(任意の名前でOK)
・style.css
・(screenshot.pngがあれば 外観 > テーマ のアイキャッチ画像にそれが表示されます)
これだけで大丈夫です。

wp-content/themes ディレクトリの中にこれらをUPします。

themes-child

themes-child01

style.cssの記述は

/*
Theme Name:Root-013
Description:Root-013 twentyfourteen子テーマ
Template:twentyfourteen
*/
@import url('../twentyfourteen/style.css');

たったこれだけ!
あとはどんどん上書きしたいCSSを追加していくだけです!

もし、header.phpを変更したいときなどは、親テーマのheader.phpを子テーマにコピーしてそれを編集しましょう!

PHPファイルをカスタマイズしたいなら、子テーマ!と憶えておけば間違いないですね!

スポンサーリンク

コメントをどうぞ

コメントを残す

メールアドレスが公開されることはありません。

スパム対策にご協力ください *

コメントの前にご確認ください。なにか不具合などあればtwitterまでご連絡ください

  • コメントは承認制のため、反映・表示までお時間を頂きます。
  • 具体的なエラー画面などがある場合は画像を添付してください。(1ファイルの上限は2メガバイト・3枚までUP可能です。)
  • メールアドレス等の入力も必須ではありませんので入力の必要はありません。お気軽にどうぞ。(冷やかしは止めてね!)
  • コメントや返信があっても通知は届きませんのでご注意下さい。
  • 忙しい時はレスが遅れることもあります。
  • 実作業は行いません。ご依頼の場合はお問い合わせからお願い致します。
  • コメントの回答による一切の不利益および損害に関し、責任を取ることはできません。(実作業をご依頼いただいた場合は別です。)