WordPress : 子テーマ (Child Themes)の設定メモ

WordPressでテーマの更新をしたら、設定の変更が上書きされたので、子テーマを使うことにしました。その設定手順。

手順1:子テーマ用のディレクトリを作る

WordPressをインストールしているディレクトリから
wp-content」→「themes」のディレクトリに移動。

[オリジナルのテーマの名前 + -child] のディレクトリを作成する。
(下図:「twentyfifteen」の子テーマ「twentyfifteen-child」を作成)

p010-child

手順2:子テーマのディレクトリ内に空ファイルを作る

手順1で作った子テーマのディレクトリの中に、「functions.php」と「style.css」の空ファイル作成する。文字コードには注意。

p020-child

手順3:「style.css」ファイルの編集

手順2で作った「style.css」のファイルに以下のようなコメントを書きます。
この色の部分は変更必須でしょう。この色の部分は親テーマが「twentyfifteen」以外の場合、変更します

/*
 Theme Name:   Twenty Fifteen Child
 Theme URI:    http://wp.fromkato.com/twenty-fifteen-child/
 Description:  Twenty Fifteen Child Theme
 Author:       Yoshihiko Kato
 Author URI:   http://wp.fromkato.com
 Template:     twentyfifteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-fifteen-child
*/

手順4:「functions.php」ファイルの編集

手順2で作った「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' );

}
?>

手順5:テーマを切り替える

WordPressのダッシュボードから、「外観」→「テーマ」で子テーマ(この例では、手順3の「Theme Name」で指定した「Twenty Fifteen Child」)を「有効化」します。

p030-child

「テーマの詳細」をクリックすると、手順3で指定した値が表示されます。

p040-child

参考URL

  • https://codex.wordpress.org/Child_Themes

サイト内リンク

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA