0.ワードプレスの子テーマ作成について
1.子テーマ作成の概要
子テーマ作成するのに必要なこと概要は以下の通りです。
-
- ・function,phpの作成
- ・style.cssの作成
私が書いてもよいのですが、既に子テーマの作成について分かりやすく書かれていたものがあったのでそちらを紹介します。
子テーマの作成自体で私がよくやったミスは以下の４点です。
- ・style.cssはコメントアウトされているか(コメントアウトされているのが正しい)
- ・style.cssのTemplateのファイル名を書いているか(テーマ名を書いているのは間違い)
- ・style.cssに書く親テーマのVersionは間違えていないか(意外とこれも作動しない原因になる)
- ・function.phpに余計な空白や改行が存在していないか(最後に?>で閉じた後は忘れがちなので注意)
3つ目の補足として、親テーマのバージョンの確認方法は以下のようにしてすることができます
編集画面の「外観」→「テーマ」→親テーマにマウスを合わせると「テーマの詳細」が出てくるのでそこをクリックすると出てくる
また、4つ目の補足としてfunction.phpに余計な空白や改行が存在していた場合はwordpress内にログインできなくなることがあります。
2.子テーマのカスタマイズ(PHP,CSS)
最低限の子テーマが出来たら、phpファイルやCSSファイルを反映していく。
phpファイルの追加については上記のリンク先にかいてあるが、style.css以外のcssファイルや、Javascriptファイルを追加したときにwebページに反映させる方法についての記載がないのでこちらで補足する。
ここでは追加cssファイル名.cssを追加したときに反映させるためにfunction.phpに以下のコードを追記すればよい(追加cssファイル名.cssは自分で作成したファイル名に変更すること)
<?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')
wp_enqueue_style( '追加cssファイル名', get_stylesheet_directory_uri() . '/追加cssファイル名.css', array('child-style')
);
}
?>