Word Pressを使ってブログを書いていると、
他の人のように見出しを変えたい！とか思いますよね？
それで検索しまくると、どうも『子テーマ』を作ったほうがいいらしい。
超初心者の私には分かりにくくて苦労したので、私にもできた方法を紹介します。
親テーマを確認する
自分が何のテーマを使っているのか確認します。
【ダッシュボード】⇒【外観】⇒【テーマの編集】
わたしの場合は「Twenty Sventeen」です。
エックスサーバーから子テーマを追加する
子テーマのフォルダを作成する
エックスサーバーを開いて、
【インフォパネル】⇒【ファイルマネージャー】にログインする。
子テーマを追加するドメインをダブルクリック
【public html】⇒【wp-content 】⇒【themes】の順にクリック
開いたところに子テーマのフォルダを作ります。
ファイル名の文字コードを【UTF-8】にして、
分かりやすい名前を入力 ⇒【フォルダ作成】すると新しく子テーマのフォルダができます。
＊親テーマと同じ階層に作ります。
＊私は「twentyseventeen」のテーマを使っているので「twentyseventeen-child」としました。
「style.css」のファイルを作る
作ったフォルダをダブルクリックして、
右下の所に「style.css」と入力し ⇒【UTF-8】を選択 ⇒【フォルダ作成】
【style.css】の左にチェックを入れて ⇒【編集】
【style.css】の編集画面になります。
ここに入力する内容はいろいろありますが、私の場合以下のように入力しました。
/* Theme Name: twentyseventeen-child Template: twentyseventeen Theme URI: https://wordpress.org/themes/twentyseventeen/ */
貼り付けたら下の保存文字コードを【UTF-8】にして【編集】をクリックする。
「functions.php」のファイルを作る
同じように、「functions.php」と入力 ⇒【UTF-8】を選択 ⇒【フォルダ作成】
【functions.php】の左にチェック ⇒【編集】
以下のように入力する。
<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_parent_theme_file_uri() . '/style.css' );
}
?>
貼り付けたら下の保存文字コードを【UTF-8】にして【編集】をクリックする。
子テーマを有効化する
作った子テーマを有効化してみます。
【ダッシュボード】⇒【外観】⇒【テーマ】に
作った子テーマが増えているので【有効化】する
サイトを表示してみると今まで通り表示されるはずです。
【外観】⇒【テーマ編集】には、子テーマの【スタイルシート】が追加されています。
今後デザイン等を変更する時は、
CSSコードをこの中に追加するだけで、変更が適用されます。
スタイルシート以外にも
「header.php」や「single.php」などを子テーマに追加する場合も同じ手順で行います。
ただ、作成したファイルに書き込む内容は、
親テーマの同じファイルの中身をコピーして貼り付けます。
まとめ
これで、安心してカスタマイズができますね！
見出しやリストのデザインを変えたりして楽しんでください。
コメント