TT3(Twenty Twenty Three)テーマへ移行すべきか考 & 子テーマの配布

公開日:2022(令和4)年10月15日/最終更新日:

WordPress Customize Ideas | Personal WP Customization Notes (PWCN)

【景品表示法に基づく表記】ページ内のコンテンツには、商品プロモーションが含まれています



2022年11月にバージョン6.1へ更新されたWordPress。

毎度のパターンながら、今回は2023年に向けての更新なので、デフォルトテーマがTT3(Twenty Twenty Three)へ変更になりました。

もちろん、トラブル時に強制有効化されるテーマがTT3になるので、不要でも削除することは避けるべきなのですが、すでにFSE対応のテーマとなっているTT2(Twenty Twenty Two)から移行する必要があるのか?というところについて、テーマの違いを含めて考察してみます。

Twenty Twenty Twoは(TT2)とTwenty Twenty Three(TT3)の違い

以下テーマ名がお互い長いので、Twenty Twenty Twoは「TT2」、Twenty Twenty Threeは「TT3」と略しています

style.cssの記述がなくなった

エディタ側とフロントエンド側の調整の記述が入っていたTT2と比べ、TT3ではテーマに必須の情報を除き、スタイルコードは何も記述されなくなっています。

もう完全にコア側(WordPress本体側)、または、theme.json側で調整が付くからTT2で行っていた調整は不要ということだと思われます。

もちろんstyle.cssへ追加した記述は反映されますから必要であれば使えばいいでしょう。

functions.phpがなくなった

TT2では、style.cssに多少の記述があったので、環境によって読み込まれない事態が出ないためなのか、functions.phpにstyle.cssを読み込むための記述があったが、TT3では、functions.php自体がなくなりました。

これは、もうfunctions.phpへガリガリコードを書いて何かをさせるのではなく、プラグインで機能については実装してほしいということなのだろうと思います。

もちろんfunctions.phpファイルを置けば通常通り読み込んで機能します

テンプレートとテンプレートパーツが増えた

TT2と比べてテンプレートとテンプレートパーツが増えました。

ただ、必須のテンプレートとヘッダー・フッターなどのあったほうがいいパーツ以外は、基本的に自身で増やして設定していくのがいいのかな?と感じますので、これについて個人的に恩恵はあまり感じないです。

基本配色の変更が簡単にできるようになった

TT3ではサイトエディターで、サイト全体のカラーが選択できるようになりました。

TT2と比べて、アクセシビリティに配慮した色合いが簡単に選択できて、便利になった感じはしますが、選択した色合いを変更するということができないようなので、結局はCSSで調整したほうが早いかなというのが個人的な印象です。

theme.jsonで設定できる項目が各段に増えた

TT2とTT3のtheme.jsonを比較すると、TT2にはなかった設定項目が増えていることが分かります。

また、文字関係の設定・ブロックの設定に関してはより細かく指定できるようになっています。

テーマ全体のスタイル(グローバルスタイル)の定義はtheme.json(またはサイトエディターのグローバルスタイル設定)で行うという方向性がより明確になっていると思います。

必ずしもTT3へ移行する必要はないかも

ざっくりと前項で紹介したのがTT2とTT3の違いで、やはりどちらもFSE対応のブロックテーマで、テーマコンテンツの作成はWordPress本体のブロックエディタに依存していますから、特に根本的な変更はないと思われます。

また、その時代ごとにリリースされているTwenty Ten以降のデフォルトテーマと同様に、WordPress本体のバージョンアップに際して不具合や不都合があったり、セキュリティ上の問題があったりすれば、TT2テーマも更新されていくと思われますから、前項の項目がどうしても必要だったり、常に最新版にしていたいという方以外は特に切り替える必要はないのかなぁというのが個人的な感覚です。

至って個人的な見解として、ブロックテーマはそれ自体が以前のクラシックテーマのようにすべてをPHPやCSSで固めて提供されているものではないので、多分今後もWordPressのバージョンアップと共にTwenty Twenty-Four(2024年の意)、Twenty Twenty-Five(2025年の意)...などが随時リリースされていくとは思いますが、ブロックテーマとして最初にリリースされたTT2とそれほど変わることはないのかなと想像しています。

さらに、次項の例でも書いていますが、サイト全体の設定を行うtheme.jsonは、各テーマで共通の部分が少ないので、単純に別テーマ間をコピペで移行することは難しいですから、その点においてもわざわざ移行する必要はなさそうに感じます。

TT2からTT3への移行方法(例)

ここまで読んでいただいて、それでもやっぱり最新のテーマにしたい!とお考えの方に、TT2からTT3への移行方法(大きくは3通りあろうかと思います)を紹介しておきます。

TT2に施していたカスタマイズ内容によっては、大掛かりな調整が必要な場合がありますので了承の上作業を行ってください。

前述したように、TT2とTT3のtheme.jsonは全く別物ですし、表示される名前も異なるものが多いので、グローバル設定またはtheme.json自体は真っ新から設定しなおす必要があります。

1.TT3用の子テーマを有効化し、TT2の子テーマのカスタマイズ内容をコピーして移行する方法

まずは万が一動かなかった時にTT2の子テーマを有効化すれば即元の状態に戻る..という方法を紹介します。

すべてのテンプレートが問題なく継承できるかは未確認ですが、テンプレートとテンプレートパーツを移行するために、TT2の子テーマを一旦パソコンへエクスポートします。

エクスポートはテーマエディターの三点リーダー(点が縦3つ)のメニューから行えます

次に、TT3用の子テーマをアップロードインストールします

私が作成したTT3用の子テーマでよければ以下のページで配布していますので使ってください。

次に、TT2の子テーマに行っていたスタイルやプログラムなどのコード・ファイルを有効化したTT3用の子テーマへコピー(移行)します。

先ほどエクスポートしたTT2子テーマの「templates」「parts」フォルダをTT3子テーマのルートフォルダ(style.cssと同じ場所)へFTPクライアントツールなどを使って転送します。

TT3用の子テーマを有効化します。

以下移行時の注意事項と本手順の注意事項です

  • この手順では、移行中にサイトの外観が変わってしまうのを最小限にすることができますが、TT2の子テーマから移植したプログラムがTT3では使えなかった場合には、エラーが発生してサイトがストップする可能性があります。
  • より安全にテーマ移行するには、一旦サイトの外観が変わってしまうものの、TT3用子テーマの有効化を先に行ってから、プログラムやスタイルの移行、テンプレートの移行を行うことをおすすめします。
  • どちらもFSEのテーマですので、テンプレートの移行は、上記手順で恐らく問題なく行えるかと思いますが、きちんと検証したわけではありませんので、テンプレートの作り直しなどの作業が必要かも知れません。

2.TT2の子テーマをTT3用として書き換える

TT2の子テーマの情報(style.cssに書かれている情報)を書き換えて、半ば無理やりTT3の子テーマとして移行する方法です。

  1. 子テーマをエクスポート(ダウンロード)する
  2. 一度解凍し、フォルダ名を「twentytwentythree-child」などへ変更
  3. style.cssの「Theme Name」と「Template」を変更
  4. サイトへアップロードして有効化

あとはtheme.jsonの内容に違いがある部分についての調整、独自テンプレートやパーツがきちんと機能しているか?など調整しておしまいという感じだと思います。

子テーマの構造(作り方)自体はどのテーマでもほぼ同じで、私が提供しているTT2とTT3の子テーマもほぼ同じですから、この方法でよいと思いますが、テーマ画像が同じのため、テーマ一覧で見間違うかも知れません

3.管理画面上でTT2の子テーマをTT3用に書き換える方法

もっと手順を省略した方法です(おすすめはしません)。

今まで稼働していたTT2の子テーマをテーマファイルエディターで開き、style.cssの「Theme Name」と「Template」「Textdomain(翻訳の必要がある場合)」を変更します。

  • Theme Name:「Twenty Twenty-two Child」→「Twenty Twenty-three Child」
  • Template:「twentytwentytwo」→「twentytwentythree
  • Textdomain:「Twenty Twenty-two Child」→「Twenty Twenty-three Child」

変更して保存したら、テーマの認識を変えるため、一旦別のテーマを有効化してから再び子テーマを有効にする必要があります

2の方法と比べて、テーマフォルダ名の変更をしないため、サイトの管理画面上で変更が可能ではありますが、一番不確実な方法ですので、できれば1の方法で行うことをおすすめします

補足 子テーマって必要なの?考

完全に本ページの趣旨とは外れてしまいますが、このサイト(TT2を使ってデモを兼ねたサイト)を作る前までは、自作テーマで結構な数のカスタマイズ項目を設けていました。

ただ、ブロックテーマでは、子テーマにPHPやCSSを書いたり追加したりしているうちに、結構な量のプログラムやデザインコードになってしまったため、今後のことを考えてプラグイン化しておいた方が無難なのでは?と思いました。

そして完成したのが以下のプラグイン。

https://habone.biz/hima-art-utility

このサイトで子テーマに追加していたものをプラグインとして動作させるようにしたもので、現状このサイトで稼働しているTT2の子テーマから、ほぼすべての追加コードはない状態になりました。

こうしてプラグインにしておけば、例えば今回のTT3への移行というのも、簡単にできるのでは?と思います。

本サイトでもテーマカスタマイズというよりは、上記プラグインを作った経験を基に、プラグイン作りについていろいろと書いていこうと思いますので、興味があったら読んでみてくださいね。

ただ、たとえプラグイン化することにしたとしても、テスト的にコードを書いてみたりすることはあると思いますし、theme.jsonの上書きなどもすると思うので、子テーマは必要だと思います(私は少なくともどんなテーマでも子テーマを有効化してカスタマイズしています)。



Lolipop ServerMoshimo Ad x-serverMoshimo Ad

Image Of News & Diary
当サイトの動作環境について 使用しているテーマは何?使ってるプラグインは何?