「Word Press」子テーマの必要性と設定方法を一挙大公開！

WordPressで「テーマ」を設定して一段落された方も多いのではないでしょうか？

しかし、今度はサイトを運営していくなかで、「子テーマ」というものが必要となってきます。

「子テーマ」を初めて聞かれた方、設定した方が良いのは知っているけど設定方法が分からない方などいらっしゃると思います。

テーマを決めたからそれで終わりではなくサイト運営を長く続けていきたい方には知っておいて頂きたい内容です。

なぜ、「子テーマ」が必要なのか?

ぜひご参考にしていただければと思います。

WordPressの「子テーマ」とは？

「子テーマ」って何？

WordPressのテーマは二つに分けられています。

・親テーマ

・子テーマ

・親テーマ

サイト全体を示すもので、WordPressの既存のテーマです。

・子テーマ

親テーマの中に含まれるもので、編集するためのテーマです。

「子テーマ」の必要性とは？

「子テーマ」を設定しない場合

「子テーマ」を設定しないで親テーマのみでサイト運営するとサイトにとって、とても良くありません。

なぜ良くないかというと、親テーマは基本的には自動的にアップデートされます。

親テーマをアップデートすると最新の状態に戻ってしまい、変更したものは無かったこととなり、全て水の泡になってしまうのです。

「子テーマ」を設定した場合

「子テーマ」を設定することで、先ほど述べた問題点がなくなります。

「子テーマ」上で追加したり、編集することでテーマのアップデートには影響されることなくサイトを運営することができます。

「子テーマ」のメリット・デメリット

メリット

自分の好きなようにテーマをカスタマイズでき、テーマのアップデートに影響されることなく、サイトを作り上げることができます。

デメリット

プログラムコードなどの知識がないと細かいカスタマイズをすることが難しいところがあります。

最低限度のテンプレートファイルは理解しておきたいところです。

「子テーマ」の設定方法

子テーマの設定方法についてご紹介していきます。

初めから子テーマが用意された「テーマ」もあるので、そちらを使用される方は必要ないのですが、ご自身でテーマをカスタマイズしたい方や知っておきたい方などは、参考にして下さい。

知っておくと後々使えることがあると思います。

子テーマのフォルダ作成から書き込みまで

子テーマを作成するには下記のように作っていく段階があります。

今回は、WordPressに元々入っているTwentySixteenという親テーマをもとに作成していきたいと思います。

子テーマのフォルダを作成します。
　　　　　⇓
子テーマにファイルを作成します。
　　　　　⇓
それぞれのファイルにコードを書き込みます。

・子テーマのフォルダを作成します。

wordpres > wp-content > themesの順にフォルダを開いていくと親テーマがあるので、そこに子テーマを作成します。

子テーマのフォルダ名は自分が分かりやすいように設定しておくといいでしょう。

例えば、親テーマが「 twentysixteen」とすると、子テーマのフォルダ名は「 twentysixteen_child」といった感じに設定しておくと分かりやすいですね。

・子テーマにファイルを作成します。

子テーマには必ず使用するファイルがあります。

それが以下の2つです。先程、作成したフォルダの中にこの２つのファイルを作成しましょう。

style.css(スタイルファイル)
functions.php(関数ファイル)

・それぞれのファイルにコードを書き込みます。

これらの２つのファイルは親テーマからデータを引き継ぐために必要となりますので、そのための設定を行っていきます。

先程作成したそれぞれのフォルダに必要なコードを入力していきます。

style.cssへの書き込み

/*
Theme Name:twentysixteen_Child
Theme URI:http://example.com/ twentysixteen_child/
Description:twentysixteen_Child Theme
Author:John Doe
Author URI:http://example.com
Template:twentysixteen
Version: 1.5
License:GNU General Public License v2 or later
License URI:http://www.gnu.org/licenses/gpl-2.0.html
Tags:light, dark, two-columns, right-sidebar, responsive-layout, accessibility-reaText Domain:twentysixteen_child
*/

今回は分かりやすいように子テーマの名前を『親テーマ_child』にしています。

この中でも特に必要な項目は下記の２項目です。
この２項目だけの書き込みでも認識されます。

・Theme Name:twentysixteen_Child(子テーマの名前を入れる。今回は親テーマ+childに設定)
・Template:twentysixteen(親テーマの名前)

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

このようにfunctions.phpのファイルへ書き込むことにより、親テーマのstyle.css(スタイル)が子テーマに引き継がれることになります。

なので、functions.phpのファイルも無くてはならないファイルとなります。