制作 小林

【WordPress】子テーマの作り方


WordPress子テーマの作り方

ワードプレスにはデザインや機能を管理するテーマというものがあります。このテーマはフリーのものも非常に多く出回っていますが、見た目や機能を自己流にカスタマイズしてもテーマのアップデートなどが行われるとカスタマイズしたデータも上書きされて消えてしまいます。

今回はカスタマイズしてもデータが維持される方法として、子テーマの使い方について説明したいと思います。

子テーマとは?

子テーマとは既存のテーマ(親テーマ)を流用し、ヘッダー(header.php)のみ変更を加えたい場合などに使用します。
子テーマを設定することにより独自性を追加でき、且つ親テーマがアップデートされた際もカスタマイズ性を維持する事ができます。

※ただしアップデートで親テーマに新しい機能が追加されても、カスタマイズした子テーマには反映されないので注意

子テーマの作り方

今回は標準で入っている「twentyfifteen」テーマの子テーマを作っていきます。
子テーマは分かりやすく「twentyfifteen_child」というディレクトリ名にしました。

子テーマの作成

中身に最低限必要なものは「style.css」「functions.php」のふたつ、たったこれだけ

style.cssには以下を記述し子テーマを定義

/*
 Theme Name:   twentyfifteen Child
 Description:  twentyfifteen Child
 Template:     twentyfifteen
 Version:      1.0
*/

次にfunction.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' );
 
}
?>

管理画面に入り「外観」>「テーマ」を見てみると先ほど作成された子テーマが表示されているので「有効」

子テーマの反映

有効化した後にサイトを確認すると親テーマとまったく同じ内容を表示してくてれいるのがわかる

次に親テーマからカスタマイズしたいPHPをコピーして子テーマにペースト、子テーマの中のPHPを編集すると親テーマより優先して反映される。
(今回は例として子テーマのheader.phpを編集し、「子テーマだよ」という文言を追加しました。)

子テーマ内でテーマの変更

子テーマの内容が反映されました。成功です。
この方法であれば親テーマを汚さずカスタマイズできますし、親テーマがアップデートされてもカスタマイズされた内容が消されてしまう心配もありません。
ただし冒頭でも説明しましたが、親テーマがアップデートされても今回子テーマで変更したheader.phpなどはアップデートが反映されませんのでご利用は計画的にです。

以上、お疲れ様でした。


PAGE TOP

CONTACT

サービスについてのご相談やご質問など、
お気軽にお問い合わせ下さい。