unitone v23.0.0 の概要

機能追加

• オーバーレイメニューをブロックで自由に作成できる機能を追加
• ナビゲーションブロックにハンバーガーボタンとオーバーレイメニュー用の色設定を追加
• メガメニューブロックに幅の設定を追加
• カラーパレットに、inherit・currentColor・transparent を追加
• スライダーブロックのアクセシビリティ対応

変更

• メガメニューの UX 改善
• オーバーレイメニューの CSS を変更

不具合の修正

• 子ページの一覧ブロックでスタイルを「スタック（区切り：ストライプ）」にしたとき、入れ子があると区切り線が重複する
• エディター上でソーシャルアイコンブロックが楕円になってしまう不具合を修正

オーバーレイメニューをブロックで自由に作成できる機能を追加

ナビゲーションブロックのオーバーレイメニューを、テンプレートパーツに置換できる機能を追加しました。それにより、オーバーレイメニューをブロックで自由に組み立てることができるようになりました。

ナビゲーションブロック → オーバーレイメニュー → オーバーレイメニューにテンプレートパーツを使用する、にチェックすると、オーバーレイメニューがオーバーレイメニュー用のテンプレートパーツに置換されます。

オーバーレイメニュー用のテンプレートパーツを追加する

オーバーレイメニュー用のテンプレートパーツはデフォルトで1つ用意されていますが、メニューが複数あるサイトでも対応できるように、複数のオーバーレイメニュー用のテンプレートパーツをつくれるようになっています。

サイトエディターでテンプレートパーツを追加 → エリアで「オーバーレイメニュー」を選択し、テンプレートパーツを追加すると、ナビゲーションブロック → オーバーレイメニュー → 使用するテンプレートパーツに表示されるようになります。

ナビゲーションブロックにハンバーガーボタンとオーバーレイメニュー用の色設定を追加

これまではテキスト色と背景色の設定をすると、通常のメニュー・ハンバーガーボタン・オーバーレイメニュー全てに色が反映されるので、使いにくさがありました。今回のアップデートでハンバーガーボタンとオーバーレイメニュー用の色設定を追加したので、それぞれ違う色にすることができるようになりました。

メガメニューブロックに幅の設定を追加

これまでは全幅だけでしたが、下記から選択できるようになりました。

• 全幅（デフォルト）
• 幅広
• コンテンツ幅

全幅・幅広の場合はメガメニューは画面中央に表示されますが、コンテンツ幅の場合はそのメニュー項目の中央に表示されます。

カラーパレットに、inherit・currentColor・transparent を追加

パターンやテンプレートパーツのメンテナンス性を向上させるために、カラーパレットに inherit・currentColor・transparent を追加しました。

メガメニューの UX 改善

• スクロールしたときにメガメニューが閉じないように変更
• 誤操作を防ぐために、開くタイミング・閉じるタイミングが少し遅れるように変更
• 左ヘッダーのとき、メガメニューを一番上ではなくそのメニュー項目の位置で開くように変更

オーバーレイメニューの CSS を変更

カスタマイズ性を向上させるために、オーバーレイメニューの CSS を一部変更しました。

• オーバーレイメニューの周りの余白を、大外（.wp-block-navigation__container）に持たせるのではなく、ハンバーガーボタン（.wp-block-navigation__responsive-container-close）とメニュー（.wp-block-navigation__responsive-container-content）それぞれに持たせるように変更。
• 上記に伴い、ハンバーガーボタン（閉じるボタン）は position: absolute ではなく、display: block + margin で位置を調整する。