ワードプレスには子テーマというシステムがあります。
テーマをカスタマイズするときにとても便利なものです。
…と言うより、子テーマを使わないと、カスタマイズは難しいです。
子テーマを使わないと、テーマアップデート時に大惨事になります
ワードプレスのテーマは、意外とアップデート頻度が高いです。
Twenty Twenty など、WordPress デフォルトテーマは、アップデートの頻度が高いです。
アップデートの頻度が高いことは、本来は喜ばしいことです。
常にテーマが改善されている、ということですからね。
しかし、テーマファイルを直接編集している場合、アップデートが来ると困ります。
テーマファイルを直接カスタマイズすると、アップデート時に、今までのカスタマイズが水泡に帰してしまいます。
テーマファイルを直接改変するようなカスタマイズをするなら、子テーマを作ってカスタマイズするようにしましょう。
子テーマ作りの準備
子テーマを作る!!と考えている人には馬耳東風かも知れませんが。
子テーマを作る作業には、FTPソフトが欠かせません。
次のようなFTPソフトを導入しておいて下さい。
以下、FTPソフトを使ってアップロードするくらいは朝飯前だという皆様向けに説明いたします。
子テーマを作る
子テーマの作り方は、子テーマ – WordPress Codex 日本語版 に詳しく書かれています。
私もこれを見て子テーマを作りました。しかし、詳しすぎてわかりにくいとはこの事かも知れません。結構、苦労しました。
Twenty Twenty をこれからカスタマイズする方のために、先輩としてなるべく分かりやすく説明します。
子テーマフォルダを作る
まずは、wp-content/themes/直下に子テーマのフォルダを作ります。テーマフォルダー名は何でもいいです。
テーマフォルダーには、取り敢えずは、次の2つのファイルのみを作ります。
- style.css
- functions.php
それぞれのファイルに書き込む内容は次のとおりです。
style.css
子テーマのstyle.css には、次の4行を書けば十分です。
/* Template:(親テーマ名) Theme Name:(子テーマ名) */
WordPressの公式テーマ Twenty Twenty の子テーマとして child-01を作るとすれば次のように書きます。
/* Template: Twenty Twenty Theme Name: child-01 */
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' ); wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style') ); }
ファイルの最後がPHPで終了するので、閉じタグ?>
は省略します。
と言うより、省略しないと、不具合のもとを自分で作り出す感じになります。
このことは、以下などに詳しく書かれています。
子テーマフォルダをサーバーにアップロード
子テーマ内に style.css・functions.php を作ったら、 FTPソフトで /wp-content/themes の直下に 子テーマフォルダごとアップロードしましょう。
次に、WordPress管理画面→外観→テーマ で、子テーマを有効化します。
カスタマイズの考え方
子テーマを作って有効化したら、いよいよカスタマイズに着手します。
カスタマイズは全て、子テーマフォルダ内のファイルを編集して行います。
style.css・functions.php のカスタマイズ
子テーマのstyle.css・functions.php は、親テーマのstyle.css・functions.php 末尾に付加されます。
それを前提として、子テーマのstyle.css・functions.php を、適宜編集しましょう。
その他のファイルのカスタマイズ
style.css・functions.php 以外のファイルは、子テーマ内に親テーマと同名のファイルがあれば、子テーマのファイルが親テーマのファイルを上書きします。
style.css・functions.php 以外でカスタマイズしたいファイルがあるなら、 まず、それをコピーして子テーマフォルダ内に貼り付けましょう。
そして、子テーマ内のファイルを、適宜変更してカスタマイズします。
カスタマイズ準備完了!!
これでカスタマイズ準備完了です。
少しずつカスタマイズしていこうと思います。