長く使うサイトなら、WordPressの子テーマが便利！その使い方やメリットとは？

WordPressのテーマは、ふたつの階層に別れています。親テーマは、基盤となるテーマのことです。それに対して、子テーマは、親テーマに従属する形で機能やスタイルなどを引き継ぎます。開発者がWordPressのテーマをカスタマイズすると、子テーマをよく使います。

今回、子テーマとはどのようなものか、子テーマを使うメリット、使いから、設定するためのポイントをご紹介します。

WordPressの子テーマとは？

子テーマはどんなふうに表示されるのでしょうか？

はじめに、親テーマを土台として考えましょう。従来、親テーマに入っているファイルを通してブラウザにサイトが表示されます。しかし、子テーマを作成すると、親テーマとは別レイヤーに子テーマが設置されます。

親テーマと子テーマに同様の機能が含まれている場合は、子テーマのファイルが使われ、インターフェイスで表示されます。親テーマにしか入っていないファイルであれば、そのファイルが使われます。

なぜWordPressに子テーマを使うべきなのか？3つのメリット

インターネット上にはあらゆるWordPressテーマがあるにもかかわらず、あえて子テーマでカスタマイズするメリットは何でしょうか？子テーマを使うメリットをまとめました。

1. 親テーマを更新しても、子テーマは変更されない

WordPressでは、テーマを更新すると、書き換えた情報が全て失われてしまう場合があります。子テーマを使えば、一度書き換えた情報を維持したまま親テーマを更新できます。

2. ゼロからテーマを作成しない

ゼロからWordPressテーマを作成する場合、テーマの機能や見た目なども一から構築しなければいけません。一方では、親テーマをサイトのベースにする上に子テーマを使うと、親テーマの基本設計や機能を使えます。

よって、親テーマを基に子テーマを使いながらWebサイトを作成すると、親テーマの機能などを使えるため、Webデザインの開発期間を短くできます。

3. 親テーマをベースにアレンジができる

いちからWordPressのテーマを作成するのとは違い、親テーマもあるため、親テーマのデザインを生かしながら自分なりのアレンジを加えられるので、ゼロの状態からデザインする必要がなくなるのです。

親テーマを更新した場合も、子テーマへのコード記述がなくても更新された機能はそのまま残ります。

子テーマの設定方法＆使い方

子テーマは簡単に導入できます。子テーマを導入するためのプロセスをご紹介します。

1.ディレクトリにフォルダーを作成する  

/wp-content/themes/のディレクトリにフォルダーを作成します。WordPress社のオススメは、twentyseventeen-childのように、「（テーマ名）-child」というフォルダー名をフォルダーにつけること。

2. スタイルシートを作成する

フォルダーの中に、style.cssというスタイルシートを作成してください。

そのスタイルシートの中、下記に記載しているようなヘディングをつけてください。

/*
 Theme Name:    Twenty Seventeen Child
 Description:   My Twenty Seventeen Child Theme
 Author:        Your Name
 Author URI:    http://www.your-site.com
 Template:      twentyseventeen
 Version:       1.0.0
*/

上記のヘディングに記載する必要のある情報は、テーマ名とテンプレート名です。「Template」のテンプレート名が、親テーマのフォルダー名に一致しないと、子テーマが使えなくなります。

このヘディングの下位に、子テーマにカスタマイズしたいスタイルの情報を記載できます。

3.  functions.phpを作成する

フォルダーの中に、親テーマと子テーマを呼び出すfunctions.phpを作成してください。スクリプトは下記に記載します。

<?php
add_action(  'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function  my_theme_enqueue_styles() {
 
    $parent_style = 'parent-style'; // This is  'twentyseventeen-style' for the Twenty Seventeen theme.
 
    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 ),
        wp_get_theme()->get('Version')
    );
}
?>

4. 親テーマのフォルダーにあるテンプレートを子テーマのフォルダーに移動する

元のファイルを移動せず、親テーマのテンプレート経由のファイルを子テーマのフォルダーにコピーし、カスタマイズしてください。

5. 子テーマを有効化する 

WordPressの管理画面から「外観」を選択、「テーマ」という副項目をクリックしてください。子テーマの設定の上位に画像を表示させたいのなら、 screenshot.png という1200×900の画像を子テーマのルートディレクトリに入れてください。

設定のポイント

子テーマを設定しても、確認しないといけない点はいくつかあります。

1. 親テーマの更新による問題はあるかどうか
   本来、子テーマは更新されないにもかかわらず、親テーマが新しい機能や構成を幅広くアップデートするときもあるため、問題が発生する場合もあります。よって、再度子テーマをカスタマイズしなければいけないときもあります。
2. 精度が高い親テーマを使っているかどうか
   子テーマは親テーマをカスタマイズするための形態になるのに、もし親テーマを大きく変更しなければいけないのなら、よりふさわしい親テーマを選定しなければいけません。
3. 親テーマに関連しているドキュメンテーションを使っているかどうか
   上記の設定方法は多くの場合に通用する中、各テーマによって特徴が異なるため、そのテーマのドキュメンテーションもチェックしてください。