【WordPress】子テーマでGoGo!

こんにちは。tetlabのヤマウチです。
webサイト制作において今は、wordpressなど簡単に作れるものが増えてきました。みなさんもそういった自作のwebサイトを運営している方も多いのではないでしょうか？
今回は、１段階上のカスタマイズするうえで、更新の際に問題が起きないようにするため、子テーマを使おうってお話です。

色々な方がこの子テーマについて説明しているのでわかりやすい方の記事を参考にしてもらって構わないんですが、できる限りわかりやすくいってみようと思いますのでよろしければ最後までお付き合いください。

子テーマって？

子テーマってそもそも何って思う方もいるかと思います。
wordpressでブログなどと作る際に様々なテーマを選び、それをカスタマイズして使っているかと思います。
テーマはセキュリティやブラウザの新機能に対応していけるようにアップデートが入ります。ダッシュボードの「外観」→「テーマエディター」を開いて直接テーマを改変している場合、テーマのアップデートで更新すると全て初期のテーマに戻されてしまいます。
綺麗に作ったサイトも一瞬でなかったものになっちゃいます。
これは痛い。そこで子テーマの登場です。

子テーマは基本親テーマに従います。修正や改変したいところだけが、子テーマになります。
親の方針が変わっても子の個性は変わらない。ということです。

テーマといわれても・・・

面倒でしょ。そんな言葉が聞こえますが、これを手間と言っては何も始まらない。いや、むしろ手間なんて言わせないのです。

子テーマという下準備さえしておけば後々、大変な状態にならずむしろオススメです。いや、最初からオススメです。

何はともあれちょっとやってみましょう。

1.子テーマフォルダ

テーマとしてデータをまとめるフォルダがまずは必要です。
フォルダを作り名前をつけましょう。
どんな名前でも構いませんが、付ける名前はわかりやすい方がいいですね。
親テーマの名前にたとえば「-child」とか「-ch」なんて追加した名前にするとどの親テーマの子なのかがわかりやすくていいとおもいます。
わたしは、「-child」派です。

例）twentyfifteen-child

2.functions.php

<?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')
);
}
?>

テキストエディタで、上の記述をコピペ。
functions.php
と名前をつけて最初に作ったフォルダの中に保存してください。

ここまでやればほぼ終わったも同然です。（準備が・・・）

3.style.css

/*
 Theme Name:   Twenty Fifteen-child
 Template:     twentyfifteen
 Version:      1.0.0
*/

そんでもって、上の記述をテキストエディタにコピペ。
これは少し書き換えが必要。

theme Name:
ここには（１）で作ったフォルダの名前を入れる。

例）Theme Name: twentyfifteen-child

Template:
ここは親テーマのフォルダ名を入れます。

例）Template: twentyfifteen

Version:
ここは親テーマの最新バージョンナンバーを書き込みます。

例）Version: 1.0.0

この3箇所を修正してください。
style.css
の名前でこちらも最初に作ったフォルダに保存。

これで最低限ですが一応の準備は万全です。

あとは思う存分修正しちゃってください。
親テーマのバージョンアップの通知が来ても心配することなくバージョンをあげられます。