こんな人にオススメ!
- WordPressをカスタマイズしたい。
- 子テーマをのことを知りたい・作りたい!
WordPressのカスタマイズをはじめるのなら、子テーマは絶対に作っておくべきです。
なぜなら、WordPressのテーマは、とても頻繁にアップデートが行われます。
子テーマを作っておかないと、アップデートの度に、それまでのカスタマイズ内容が上書きされてしまい、もとのオリジナルテーマ(親テーマ)にリセットされてしまうからです。
せっかくの努力と費やした時間が、一瞬にして水の泡になってしまわぬよう、必ず、子テーマを作ってからカスタマイズを始めましょう。
ちなみに、カスタマイズ全般にいえることですが、管理画面の「外観」→「テーマの編集」からカスタマイズを行うのは、オススメできません。
必ず、FTPソフトを使って作業をしてください。
コピペでOK!子テーマ制作の全手順
子テーマの制作は、手順通りに行えば、決して難しくありません。
新たに「1つのディレクトリ」と「2つのファイル」を作成するだけです。
コピペできるように、コードも掲載してあります。WordPress初心者のかたも、是非チャレンジしてみてください。
(ディレクトリとは、パソコンでいうところのフォルダと同じです。空のフォルダの中にファイルを作る、といったイメージで作業を進めましょう。)
以下は、これからの作業手順です。
- 子テーマのディレクトリを作成
- ファイルを作る(style.css)
- 子テーマだと認識させる
- ファイルをもう一つ作る(functions.php)
- 親テーマのスタイルシートを呼び出す
- スクリーンショットの追加
今回は、ワードプレス2017年公式テーマである、Twenty Seventeenを親テーマとし、その子テーマを作成します。
それでは、子テーマのディレクトリから作ってみましょう。
①子テーマのディレクトリを作成
親テーマTwenty Seventeenディレクトリと同じ階層に、子テーマのディレクトリを作成します。
wp-content / themes / twentyseventeen
と同じ階層です。
ディレクトリ名は任意ですが、今回は、twentyseventeen-child とします。
②ファイルを作る(style.css)
作成したディレクトリ、twentyseventeen-child の中に、空のファイルを作ります。
ファイル名は、style.css です。これは、他のファイル名であってはなりません。
③子テーマだと認識させる
親テーマTwenty Seventeenの子テーマであると認識してもうため、先ほど作った、空のstyle.cssに次の記述を書き込みます。
たったの2行を記述するだけです。
/*
Theme Name: Twenty Seventeen Child
Template: twentyseventeen
*/
④ファイルをもう一つ作る(functions.php)
作成したstyle.cssと同じ階層に、もう一つ空のファイルを作ります。ファイル名は、functions.phpです。
⑤親テーマのスタイルシートを呼び出す
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' );
}
?>
これで、子テーマの設定が完了しました。
管理画面の「外観」→「テーマ」を見てみましょう。
Twenty Seventeen Child が表示されているはずなので、テーマを有効化してあげれば作業は完了です。
どうですか?意外と簡単だったと思います。
けれど、他のテーマと比べて、スクリーンショットがありません。なんだか寂しいですね。
せっかくですから、スクリーンショットを加える手順もご紹介しておきます。
⑥スクリーンショットの追加
style.css と functions.php と同じ階層に、screenshot.png ファイルを作ります。
screenshot.png ファイルに、以下の画像をドラッグ&ドロップで放り込んでください。
(Twenty Seventeen以外のテーマの場合は、ご自身で画像を用意してください。サイズは、880px × 660px以上です。)
うまく反映されれば、次のようになるはずです。
これで、子テーマに変更したい内容を書き込めば、親テーマの内容を上書きできるようになりました。今後は、親テーマの更新があっても安心して作業が進められますね。
以上、「WordPressの子テーマを超簡単に作る方法」でした。