WordPress6.7 新デフォルトテーマ Twenty Twenty-Five をチェックしています

Posted on Update by admin


WordPress6.7 RC1 が 公開され、いよいよ WordPress6.7 のリリース（2024年11月12日予定）が近づいてきました。

WordPress6.7では新しいデフォルトテーマ「Twenty Twenty-Five」が搭載される予定です。
※「Twenty Twenty-Five」は WordPress6.7以降で使えます。

https://nendeb.com/1420

【参考】Introducing Twenty Twenty-Five
https://make.wordpress.org/core/2024/08/15/introducing-twenty-twenty-five/

【参考】GitHub – WordPress/twentytwentyfive
https://github.com/WordPress/twentytwentyfive

　
ということで、「Twenty Twenty-Five」はまだリリース前ですので今後 変わっていくと思いますが「Twenty Twenty-Five」をチェックしていきたいと思います。
「Twenty Twenty-Five」は「Twenty Twenty-Four」「Twenty Twenty-Three」や「Twenty Twenty-Two」と同様に ブロックテーマで WordPress5.9 からの機能「サイトエディタ」でサイト全体を編集する事ができます。

　

Twenty Twenty-Five

Twenty Twenty-Five」の readme.txt には以下のように概要説明が書いてあります。

Twenty Twenty-Fiveは、シンプルさと適応性を重視しています。 サービスやランディングページなど、さまざまなページタイプに対応する多様なパターンに支えられた柔軟なデザインオプションを提供し、個人ブログ、プロのポートフォリオ、オンラインマガジン、ビジネスウェブサイトの構築に理想的です。 テンプレートは、テキスト中心のものから画像を多用したレイアウトまで、様々なブログスタイルに対応しています。 さらに、国際的なタイポグラフィと多様なカラーパレットをサポートし、世界中のユーザーのアクセシビリティとカスタマイズ性を保証します。

説明の通り 構成がシンプルにできており、後述の豊富なパターンを使い分ける事でいろいろなサイトに対応できるようになっています。
　
　

サイトエディタ

「Twenty Twenty-Five」テーマの特徴はブロックテーマになっていて、サイト全体を「サイトエディタ」で編集できるようになっています。

　

管理者はphpの知識が無くてもサイト全体のデザイン・レイアウト等を「サイトエディタ」で構成させる事ができます。
また、WordPess5.8から採用された theme.json を利用する事で更に詳細なブロック用CSS設定やブロックオプションを設定する事ができます。

【参考】Block Theme
https://developer.wordpress.org/block-editor/how-to-guides/themes/block-theme-overview/

　
　

外観

「Twenty Twenty-Five」は WordPress6.7以降で動作します。

１カラムになっています。標準ではサイドバーはありません。
ヘッダー/フッター幅は1340pxになってます。
ウィジェットエリアはありません。すべてブロックでまかなうようになっています。
　

コンテンツ部分

コンテンツ標準幅は 645px で幅広は 1340pxになっています。
これは「theme.json」に以下のように layout の指定があるからです。

	"settings": {
		"layout": {
			"contentSize": "645px",
			"wideSize": "1340px"
		},
	}

　

Font


以下のフォンが選べるようになっています。

Beiruti
Fira Code
Fira Sans
Literata
Manrope
Platypi
Roboto Slab
Vollkorn
Ysabeau Office

フォントは対応しているブロックで個別に設定できるようになっています。
※ブロックを選択後タイポグラフィ横の3点リーダーをクリックしてみてください。

「デフォルト」は Manrope になっています
theme.json (v3)

		"typography": {
			"fontFamily": "var:preset|font-family|manrope",
			"fontSize": "var:preset|font-size|large",
			"fontStyle": "normal",
			"fontWeight": "300",
			"letterSpacing": "-0.1px",
			"lineHeight": "1.4"
		},

※代替フォントには sans-serif が指定されています。

　

フォントサイズはtheme.jsonで以下の様に設定されています。

Small 0.875rem
Medium 1rem(1rem～1.125rem)
Large 1.38rem(1.125rem～1.375rem)
Extra Large 1.75rem(1.75rem～2rem)
Extra Extra Large 2.15rem(2.15rem～3rem)

M,L,XL,XXLは「流体タイポグラフィ(Fluid typography)」を採用しています。
「流体タイポグラフィ(Fluid typography)」はブラウザの表示領域 に応じてフォントサイズを変化させる事ができます。
TT5の場合は デフォルトの 最小320px ～ 最大1600pxの間で変化します。

　

レスポンシブ

テーマとしてのCSSブレイクポイントはありません。ブロック次第となります。
　
　

管理画面

ブロックテーマを選択している時だけ以下のようにメニュー部分が変更されています。
WordPress サイトエディタ 管理画面
サイトのデザインは 外観→「エディタ」で行います。

　

ブロックパターン


「Twenty Twenty-Five」では オリジナルのブロックパターンが、たくさん付属しています。
それぞれカテゴリ内にありますのでチェックしてみてください。

　

表示スタイル

表示スタイルでは予め用意されているテーマスタイルを選択する事でサイトのカラーを変更する事ができます。

　
　

テンプレート

サイトエディタのテンプレートは従来のテーマとは違います。
テンプレートは テーマの partsフォルダ や templateフォルダ に入っています。

partsフォルダ
　header.html *
　footer.html *
　footer-newsletter.html
　right-aligned-sidebar.html
　sidebar.html
　vertical-header.html
　footer-writer.html

※すべてのテンプレートは「header.html」「footer.html」で設定されています。

templateフォルダ
　404.html
　archive.html
　home.html
　index.html
　page.html
　page-no-title.html (テンプレート変更で利用可)
　search.html
　single.html

　
　

theme.json

theme.json は バージョン3 を使うようになっています。
これは　WordPress6.6以降で動作します。

theme.json Version 3 リファレンス

theme.json Version 3 リファレンス (最新)

　
　

子テーマ

子テーマも従来の方法どおりに作れます。
templates や partsフォルダ を作ってオリジナルテンプレートを置くだけで 子テーマのを読むようになります。
※サイトエディタで編集したら、このテンプレート(テンプレートパーツ)ファイルは読まなくなります。

theme.json も設置すると親テーマのtheme.jsonとマージしてくれます。

　

…という事で リリースまでに更新された部分は、また追って追記していきたいと思います。




スポンサードリンク