XWRITE子テーマの作り方備忘録

子テーマの作り方

WordPressをカスタマイズする際に使う「子テーマ」ですが、作り方の備忘録を書いておきます。
XWRITEテーマ向けに書いていますが、基本的な作り方は他のテーマと同じです。

子テーマは必ず作らなければいけないものではないので、タグを追記してカスタマイズをする予定がなければ、わざわざ作る必要はないです。

子テーマに必要なファイルを作る

まずは「xwrite_child」という名前のフォルダを作ります。Macの場合は右クリックで「新規フォルダ」を押して作成します。

xwrite子テーマ

その中にテキストエディタで「style.css」「functions.php」の2つのファイルを作ります。

必要なファイルを作る

style.cssファイルの中身は以下のタグをコピペして貼り付けます。

  1. @charset "UTF-8";
  2. /*!
  3. Theme Name: xwrite child
  4. Template: xwrite
  5. */

Theme Nameは子テーマなので、「xwrite child」と書きます。
Template名は親テーマを指定するので、必ず「xwrite」を記載します。

functions.phpファイルの中身は以下のタグをコピペして貼り付けます。

  1. <?php
  2. add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
  3. function theme_enqueue_styles() {
  4.   wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
  5.   wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style')
  6. );
  7. }
  8. ?>

特に変わったところはなく、他の子テーマを作る時と内容は同じです。

子テーマを作り終わったらテーマを変更するので、先ほどの「xwrite_child」フォルダを右クリックしてzip圧縮ファイルを作ります。これをWordPressにアップロードします。

zipファイルに変換

WordPress管理画面の「外観」→「テーマ」より「新しいテーマ追加」を押します。

新しいテーマを追加

「テーマのアップロード」→「ファイルを選択」から先ほど作ったxwrite_child.zip」フォルダを選びます。

テーマを選択してインストール

「外観」→「テーマ」から先ほど作った子テーマを「有効化」ボタンを押せば完了です。

子テーマを有効化

子テーマを使う時に注意すること

親側のテーマがバージョンアップされる時に、子テーマのファイルをあまりカスタマイズしすぎると、表示が崩れることがあるので、なるべく親テーマからコピーして使うファイルは少ないほうが後々、書き換えの対応が少なくて済みます。

できるだけ長期運用していくことを考えながら、カスタマイズしていくと良いですね。

[公開日] 2024年3月22日 / カテゴリー:WordPress


トップ

この記事を書いた人
ポポデザイン

ポポデザイン
西宮市在住のWEBクリエイター・グラフィックデザイナー・マーケター。 ホームページの制作からディレクション、イラスト、SEOなど制作からユーザーのサポートまで幅広く、初心者のかたも分かりやすい対応を心がけております。(プロフィール)
FacebookXInstagram

同じカテゴリーの記事