WordPressの子テーマってなに???

WordPressの子テーマってなに???|アフィリエイト主婦

WordPressの子テーマってなに???|アフィリエイト主婦

WordPressの子テーマってなに???|アフィリエイト主婦

先日WordPressを開いたら、なにやら更新するものがあるとお知らせマークがついていました。
何かプラグインに更新があったのかなと思ったのですが、テーマに更新があったようです。

なるほど。
何かバグが修正されたとか、便利な機能が追加されたとかそんな感じならやっておいて損はないだろうと思いました。
が!!!

いや待てよ、コレ本当に更新していいの?大丈夫なやつ?
と野生のカンが働いたので、ググってみると…。

「テーマを更新すると、カスタマイズが消える」的なことが書いてあるじゃないですか。
いやいやいやいや、結構時間かけてカスタマイズしたよ?消えちゃったら面倒すぎる…。

ということで解決策を探ったところ、「子テーマ」を作ればいいらしいと判明しました。

子テーマとはなんぞや?

ここでWordPress初心者のネコ、初めて聞くワードが出てきました。
子テーマ?いったいなんなの???
どうやら、WordPressのテーマにはそのようなシステムがあるらしいです。

私たちが普通にテーマをインストールし有効化した状態が、いわゆる「親テーマ」の状態です。
この親テーマのソースコードをカスタマイズすると、アップデートがあったときにカスタマイズした部分が消えちゃうというわけです。

そこで登場するのが件の子テーマ

子テーマとは。
簡単に言うと、カスタマイズ専用テーマのこと。
親テーマはそのまま触らずに、カスタマイズしたいところだけ子テーマで編集するという感じです。
子テーマで編集したカスタマイズ内容はきちんとサイトに反映されるけど、おおもとのテーマは親テーマのまま、というわけです。

子テーマの作成は簡単です!
サーバー上に「sample」というテーマフォルダがあるとします。

  1. 同じ場所に「sample_child」というテーマフォルダを作成します。これが子テーマになります。
  2. 「sample_child」内に特定のソースコードを保存した「functions.php」ファイルをアップロード。
  3. 同じく「sample_child」内に特定のソースコードを保存した「style.css」ファイルをアップロードする。
  4. テーマ設定画面で子テーマを有効化する。

これで子テーマの設定は完了です。簡単ですね。
ちなみにフォルダの名前は何でも良いのですが、「子」テーマなので既存のフォルダ名に「_child」を付け足すのがわかりやすくていいと思います。
そうしている方が多いみたいなので。

フォルダを作ったりファイルを編集するには?

サーバー上のファイルを編集するには、FTPソフトを使います。
私はFFFTPを使っています。むかーーーーーしホームページを作っていたときに使っていたので使いやすくて。

私が借りているレンタルサーバーロリポップ!なら、ウェブ上でファイル操作ができるFTPツールがあるので、そこで操作ができます。
他のサーバーの方は…ごめんなさい。わかりません…。

テーマのフォルダは、

サイトのメインフォルダ

wp-content

themes

の中にありますので、このフォルダの中に「テーマフォルダ名_child」フォルダをつくることになります。

functions.phpとstyle.cssの設定は?

では、新しく作った子テーマフォルダの中に置く、functions.phpとstyle.cssに記述するソースコードとはどのようなものでしょうか?
初心者にとってはちょっと難しいので、ここはサクッとコピペでいきましょう。

まずはfunctions.phpから。
これはまるっとコピペでOKです。

【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’)
);
}

style.cssに関しては、まるっとコピペというわけにはいきませんが、基本的にはコピペで大丈夫。

【style.css】

/*
Theme Name: 子テーマ名(「親テーマ名 Child」とかでいいと思います)
Template: 親テーマ名(親テーマのstyle.cssからコピペ)
Theme URI: テーマURI(親テーマのstyle.cssからコピペ)
Author: テーマ作者名(親テーマのstyle.cssからコピペ)
Author URI: テーマ作者URI(親テーマのstyle.cssからコピペ)
Version: バージョン(親テーマのstyle.cssからコピペ)
Tags: タグ(親テーマのstyle.cssからコピペ)
License: ライセンス(親テーマのstyle.cssからコピペ)
License URI: ライセンスURI(親テーマのstyle.cssからコピペ)
*/

※アンダーライン部分を自分の設定しているテーマに沿って変更してください。

それぞれ子テーマフォルダにファイル保存しましょう。

これでWordPressに子テーマが認識されるようになります。
WordPressのメニューからテーマを選択する画面に行くと、子テーマが追加になっているハズです。
子テーマを有効化すれば子テーマの設定は完了です。

もし選択画面に子テーマが無かったら、どこかでやり方を間違えている可能性が高いです。

子テーマでカスタマイズしよう!

ここまで設定できたら、あとは子テーマでカスタマイズをするだけです。

CSSを編集したいときは、子テーマのstyle.cssに追加すればOKです。
phpファイルを編集したいときは、親テーマのphpファイルを子テーマにコピーして編集します。

私はいきなり親テーマでCSSとphpファイルを編集してしまったので、親テーマの編集済みファイルを子テーマフォルダにコピーしました。
それから心置きなく親テーマのアップデートを実施して、なんとか事なきを得ました。

今回のように、「えっ…子テーマ????なにそれおいしいの?」となっても、ネットを探せば答えが出てくるのもWordPressのよいところです。
自由度が高くユーザーが多いので、困ったときでも答えを教えてくれるサイトがいくつもあるので。

しかし、いきあたりばったりでやると後々困りますね~。
今までの編集内容が消えるって見たときめっちゃ焦りました…。