この記事では、WordPressテーマのカスタマイズに欠かせない子テーマの、役割と重要性、作り方について解説します。
子テーマとは
親テーマのすべての機能、デザインを継承しながら、PHPやCSSのカスタマイズをするためのテーマです。
子テーマのファイルは親テーマのアップデートに影響されないので、親テーマにアップデートがあった場合でも、変更したPHPやCSSの内容が失われずに使用することができます。
逆に、親テーマのファイルを直接変更すると、テーマのアップデートがあった際に変更内容がすべて失われてしまいます。
テーマにはデザインなどの表面上の情報だけでなく、ショートコードやその他の機能なども含まれます。
これから追加するショートコードがアップデートで消えてしまわないよう、子テーマを作っておきましょう。
子テーマを作る
この記事ではWordPressに最初から入っている「Twenty Seventeen」というテーマを使っていきますが、どのテーマを使用しても大丈夫です。
Twenty Seventeen | WordPress Theme Directory
Twenty Seventeen は、没入感のあるアイキャッチ画像と繊細なアニメーションを用いて、サイトに命を吹き込みます。ビジネスサイトにフォーカスをあて、ウィジェット、ナビゲーション、ソーシャルメニュー、ロゴ等はもちろんフロントページの...
ja.wordpress.org
手順
- PC上の適当なところに子テーマ用のフォルダを作成する
※ディレクトリ名は半角英数であればなんでもOK。今回は「beginner-twentyseventeen」としました
- 以下のファイルを作成する
※screenshot.pngは必須ではないが、あるとテーマ一覧でわかりやすい（サイズ: W880px × H660px）
functions.phpstyle.cssscreenshot.png
functions.phpに以下のコードを記述する
<?php
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );- style.cssに以下のコードを記述する
- Theme Name: 子テーマ名 なんでもOK
Template: 親テーマのディレクトリ名 他のテーマを使用する場合は親テーマを確認してここに記述
/*
Theme Name:Twenty Seventeen child
Template:twentyseventeen
Version: 1.1.0
*/子テーマをインストールする
手順
テーマのインストールが完了したら、子テーマを有効化してください。
この段階では何も修正を加えていないので、有効化すると「Twenty Seventeen」のレイアウトが表示されます。
