子テーマの作り方
ディレクトリ（フォルダ）作成
WordPressファイル themes内に、ディレクトリを新しく作成します。
名前は好きなものを記入します。
作ったディレクトリが子テーマになり、ディレクトリ名が子テーマの名前になります。
themesの場所は、/wp-content/themes/ になります。
ファイル作成
style.cssとfunctions.phpを作ったディレクトリ内に作成します。
他のファイルは親テーマのファイルを記載しなくてもそのまま引き継ぎますが、上記は引き継がれない
ので設定する必要があります。
中身は次に設定するのでとりあえず空で大丈夫です。
style.css編集
作ったstyle.cssファイルを親テーマのCSSを認識させます。
ディレクトリ内に、新しくstyle.cssファイルを作ります。
中身に下記のように記載します。
/*
Template: 親テーマ名
*/
これで親テーマのCSSを認識することができました。
functions.phpファイル作成
作った子テーマディレクトリ内へ、functions.phpファイルを作成します。
よくスペルを間違える人がいるので、気をつけてください。
function.phpではなく、functions.phpになります。
子テーマで作ったCSS JSファイルをエラーなく読み込む方法
親テーマCSS JSファイルの後に読み込む記載をします
WordPressで子テーマを使用する場合、子テーマのfunctions.phpで親テーマのCSSやJSを読み込み、そ
の後に子テーマのファイルを読み込むことで上書きします。
<?php
//親テーマと子テーマのCSSとJSを読み込む
add_action(‘wp_enqueue_scripts’, ‘theme_styles_js’);
function theme_styles_js()
{
//親テーマのCSSを読み込む
wp_enqueue_style(‘style’, get_template_directory_uri() . ‘/style.css’);
//子テーマのCSSを読み込む
wp_enqueue_style(‘style-child’, get_stylesheet_directory_uri() . ‘/style.css’, array(‘style’));
//親テーマのJSを読み込む
wp_enqueue_script(‘functions’, get_template_directory_uri() . ‘/js/functions.js’);
//子テーマのJSを読み込む
wp_enqueue_script(‘functions-child’, get_stylesheet_directory_uri() . ‘/js/functions.js’, array(‘functions’));
}
親テーマのシートの後に、子テーマのシートを記載することで、後から上書きします。
コピペして使用してください。
これで上書きした子テーマのファイルを読み込むことが出来るようになりました。
