【Twenty Twenty-Five】ブロックテーマは子テーマ必要?作成手順とメリット・デメリット

WordPressの標準テーマ「Twenty Seventeen」から「Twenty Twenty-Five」に移行するにあたって、まず最初に検討したいのが「子テーマ(Child Theme)を作るべきかどうか」です。

従来のクラシックテーマ(古いテーマ)では、「カスタマイズするなら絶対に子テーマを作るべき!」というのが常識でした。しかし、最新のブロックテーマ(フルサイト編集:FSE)であるTwenty Twenty-Fiveでは、その常識が少し変わっています。

この記事では、技術者目線で「そもそも子テーマは必要なのか?」という疑問に答え、実際にTwenty Twenty-Fiveの子テーマを作成して有効化するまでの手順を分かりやすく解説します!

Twenty Twenty-Fiveに「子テーマ」は必要?

 結論から言うと、「多くの人にとっては、子テーマは不要(作らなくても大丈夫)」になりました。

なぜなら、Twenty Twenty-Fiveのようなブロックテーマでは、サイトエディター(FSE)を使って行ったデザインの変更やテンプレートの編集が、テーマのファイルではなく**「データベース」に直接保存されるから**です。親テーマがアップデートされても、エディターで行ったカスタマイズが消えることはありません。

子テーマを作らなくてよいケース(不要)

  • サイトエディターで色やフォントを変更するだけ
  • ヘッダーやフッター、テンプレートのレイアウトを編集するだけ
  • ブロックの配置を変更するだけ

子テーマを作った方がよいケース(必要)

  • `theme.json` ファイルを直接編集して、テーマ独自の標準カラーパレットやフォント設定を定義したい
  • `functions.php` を使って、PHPによる高度な機能追加やフック処理を行いたい
  • 親テーマのアップデートで上書きされたくない独自のアセット(画像やフォントファイルなど)をテーマフォルダ内に保持したい

もし上記のような高度なカスタマイズを行う予定があるなら、以下の手順で子テーマを作成しましょう。

Twenty Twenty-Fiveの子テーマ作成に必要なファイル

 子テーマの作成に必要なファイルは、最小構成で以下の2つだけです。クラシックテーマの時に必要だった `functions.php` やスタイルシートの読み込み処理(`wp_enqueue_style`)は、最初は不要です。

  1. style.css:子テーマであることをWordPressに認識させるためのファイル。
  2. theme.json:ブロックテーマの設定ファイル。親テーマの設定を引き継ぎつつ、カスタマイズを行います。

【図解】子テーマを作成する具体的な3ステップ

 それでは、実際に子テーマを作成して適用してみましょう。

ステップ1:ローカルPCでファイルを用意する

パソコンのデスクトップ等に、新しいフォルダを作成します。フォルダ名は twenty-twenty-five-child`とします。

     説明: フォルダとファイルの配置を視覚的に分かりやすく示します。 –>

フォルダの中に、以下の2つのファイルを作成します。

① style.css

テキストエディタで新規ファイルを作成し、以下の内容を貼り付けて `style.css` という名前で保存します。

“`css

/*

 Theme Name:   Twenty Twenty-Five Child

 Template:     twentytwentyfive

 Description:  Twenty Twenty-Five の子テーマです。

 Version:      1.0.0

*/

*※ `Template: twentytwentyfive` の部分は、親テーマのフォルダ名と完全に一致させる必要があります(大文字小文字を区別します)。*

② theme.json

同様に新規ファイルを作成し、以下の最小限のコードを貼り付けて `theme.json` という名前で保存します。

“`json

"$schema": "https://schemas.wp.org/trunk/theme.json",

{

  "version": 3

}

※ ブロックテーマでは、子テーマの `theme.json` に何も書かなくても、自動的に親テーマの `theme.json` の設定がすべて継承されます。変更したい部分だけを後からここに追記していくことになります。*

ステップ2:作成したフォルダをWordPressにアップロードする

作成した `twenty-twenty-five-child` フォルダを、以下のいずれかの方法でWordPressのテーマディレクトリ(`/wp-content/themes/`)にアップロードします。

方法A(初心者向け):ZIP化して管理画面からアップロード

  ローカルの `twenty-twenty-five-child` フォルダを右クリックしてZIP圧縮し、`twenty-twenty-five-child.zip` を作ります。WordPress管理画面の 「外観」 > 「テーマ」 > 「新規追加」 からZIPファイルをアップロードします。

方法B(中級者向け):FTPツールでアップロード

  FileZillaなどのFTPソフトを使い、サーバーの `/wp-content/themes/` ディレクトリ直下にフォルダごとアップロードします。

     説明: フォルダをWordPressにインストールする操作を示します。 –>

ステップ3:子テーマを有効化する

アップロードが完了したら、WordPressの管理画面から 「外観」 > 「テーマ」 を開きます。

テーマ一覧に 「Twenty Twenty-Five Child」 が表示されていることを確認し、「有効化」 ボタンをクリックします。

有効化した後、ブログのフロント画面を確認し、デザインが崩れずに親テーマと同じように表示されていれば、無事に子テーマの作成は成功です!

ブロックテーマの子テーマ作成における注意点

functions.php は必要になってから作る

  PHPでのカスタマイズが必要ない段階では、`functions.php` を作成する必要はありません。後からフック処理や独自関数の追加が必要になった時点で、子テーマフォルダ内に新規作成すれば問題なく動作します。

theme.json の強力な継承ルール

  親テーマの `theme.json` は自動的に読み込まれるため、子テーマの `theme.json` に親テーマの中身をすべてコピーする必要はありません。自分がカスタマイズしたい色(カラーパレット)やフォントの設定のみをピンポイントで記述するようにしましょう。これによって、ファイルの管理が非常にスマートになります。

まとめ

ブロックテーマ「Twenty Twenty-Five」における子テーマの作成は、クラシックテーマに比べてファイル構成がとてもシンプルです。

一般的なブログ運営であれば、サイトエディターの進化によって子テーマが不要なケースも増えていますが、「将来的にPHPやtheme.jsonで高度なカスタマイズを行いたい」という場合は、移行の最初の段階で子テーマを用意しておくと、後々の作業がスムーズになります。

あなたのブログのカスタマイズ規模に合わせて、導入を検討してみてください!

<スポンサーリンク>
野島 祐慈 (著), 菱川 拓郎 (著), 杉田 知至 (著), 細谷 崇 (著)

コメント

コメントを残す

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