unitone v22.0.0 ベータ1の概要

後方互換性に影響を与える可能性があるアップデートになるので、事前のテストを強く推奨します！重大な不具合の報告がなければ、1週間程度時間をおいてから正式リリースしたいと思います。

機能追加

• そのページだけ基本設定を上書きできる機能を追加

変更

• 一部の CSS の詳細度の変更

不具合の修正

• 縦書きブロックに変換しようとするとクラッシュする不具合を修正

そのページだけ基本設定を上書きできる機能を追加 / CSS の詳細度の変更

アクセントカラーや基本の文字サイズ等、サイトエディターやセットアップ画面で設定できますが、これらの設定を任意のページにおいて上書きできる機能を追加しました。具体的には下記の設定を上書きできます。

• アクセントカラー
• 背景色
• 文字色
• 基本の文字サイズ
• ハーフレディング
• フォント
• コンテンツ幅
• 幅広

これらの上書き機能を実装するにあたり、一部の CSS の詳細度を強める必要があり、下記の変更を行いました。

この変更で影響がでる場合が結構ありそうな気がしたので、今回のアップデートはいきなりリリースせずに一旦ベータ版としてだしました。ぜひ一度問題ないか確認してみてください！

body の詳細度の変更

// 詳細度: 0 0 1
body {
  background-color: ...;
  color: ...;
  font-family: ...;
}

// 詳細度: 0 1 0
:root :where(body) {
  background-color: ...;
  color: ...;
  font-family: ...;
}

この変更により、body をセレクタにして背景色・文字色・フォントを独自に追加した CSS でカスタマイズしている場合は、そのカスタマイズが効かなくなる場合があります。

エディター上の、記事直下のブロックの max-width

// 詳細度: 0 2 0
.block-editor-block-list__layout.is-root-container > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: ...;
}

// 詳細度: 0 2 1
:is(div.block-editor-block-list__layout.is-root-container:where(:not(.wp-site-blocks))) > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: ...;
}

この変更により、独自の CSS で max-width が指定されているブロックを記事の直下に配置した場合、その max-width が効かなくなる場合があります。

また、上記にの変更により、プレビューの直下のブロックがコンテンツ幅になってしまうので、それに対処するために下記の CSS を追加。

.block-editor-block-preview__content-iframe .is-root-container > .wp-block {
  max-width: none;
}

unitone v20.0.0 ベータ1のダウンロード

下記からダウンロードしてください。