WordPressで子テーマを作る方法と、phpファイルの上書き

WordPressを編集する際には子テーマを作成して、カスタマイズ等は子テーマの方を編集すれば、将来的に親テーマがアップデートが入った際に編集のやり直しをしなくて済む。

ということでWordPressでサイトを運営する時にはほぼほぼ子テーマを作成する事が推奨されています。

子テーマを作成する方法は色んな先輩たちのブログ等に書かれているのですが自分の理解のためにも記しておきます。

WordPressの子テーマを作成する

親テーマと同じ階層に子テーマのディレクトリ(フォルダ)を作る。

例えばWordPressのデフォルトのtwentyseventeenテーマに対して子テーマを作ろうと思えば

/public_html/wp-content/themes
└twentyseventeen
└twentyseventeen-child

こんな感じ。「親テーマ-child」というディレクトリを作る。

次にこのtwentyseventeen-childの中に2つのファイルを配置する。

・style.css
このファイルに以下を記述。Templateのところに親テーマのフォルダ名を入力する。Theme Nameは子テーマの名前を書いておく。

/*
Theme Name: Twenty Seventeen child
Template:   twentyseventeen
*/

・functions.php
このファイルには以下を記述する。

<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}

これで子テーマを有効化すればOKとなる。

themesの中のディレクトリ、ファイル構成はこのようになる。

/public_html/wp-content/themes
└twentyseventeen-child
   └style.css
   └functions.php

子テーマを編集するには

スタイルシートに自分独自のクラス等を書きたい場合は、style.cssに追記していけばよい。

親テーマのphpファイル(例えばheader.phpや、index.phpや、single.php等)を編集したいと思えば、親テーマ内のxxxx.phpファイルを一旦FTPでローカルPCにダウンロードしてきて、それを子テーマの中にアップロードする。

例えば‥

/public_html/wp-content/themes
└twentyseventeen
  └header.php    ←このファイルをダウンロードして
/public_html/wp-content/themes
└twentyseventeen-child
  └header.php    ←この位置にアップロード

そうすれば、WordPressの左側メニューから、外観→テーマ編集で、このheader.phpファイルを直接編集できるようになる。

子テーマのphpファイルを編集すれば、優先的にそちらを上書きするようなイメージになり使用してくれるようになる。

タイトルとURLをコピーしました