2022年1月25日にリリース予定 WordPress 5.9 の一部をご紹介
たくさんある新機能の追加、強化、修正などの中から気になる機能をピックアップしています。Vektorの各種製品でどこまで対応するかはまだ検討・調整中ですので、ご了承ください。
ハイライト
- WordPress 5.9 ベータ 1（日本語公式）
https://ja.wordpress.org/2021/12/11/wordpress-5-9-beta-1/
5.8で搭載された機能と5.9で新たに搭載された機能を組み合わせることにより、「フルサイト編集（FSE、Full Site Editing）」が実現可能となってきました。ノーコードでもタイポグラフィからカラーパレット、ナビゲーションブロックなどの編集が可能となっています。
フルサイト編集機能は、「ブロックテーマ」と呼ばれるフルサイト編集に対応したテーマを有効化した時のみ利用可能となります。このブロックテーマという呼称に対して、ベクトル製テーマの「Lightning」 や「Katawara」はクラシックテーマと呼ばれるものになります。「Lightning」 や「Katawara」をご利用のままWordPress5.9へアップデートしていただいても、フルサイト編集に関連する機能は有効化されません。
受託制作などで、現在運用中の「Lightning」 や「Katawara」をご利用のサイトで、「5.9にアップデートしたらクライアントが自由にフルサイト編集をしてしまってサイトが崩れた！」などということは発生しませんので、その点はご安心いただけたらと思います。
フルサイト編集に対応した新しいブロックテーマ関連製品については現在テスト・開発を開始しておりますが、フルサイト編集機能自体がまだまだ発展途上のため、WordPress 5.9 の状態で実案件でフルサイト編集の機能を使うのは時期尚早という見解です。
ただ、今後リリースするフルサイト編集に関する新製品も G3 Pro Pack のライセンスで利用可能にしますので、現行ユーザー及びご購入を検討されている方はご安心いただければと思います。
そのあたりの情報もオンライン勉強会などでも取り上げていきますので、ぜひconnpassのご登録や、Slackにご参加のうえ情報をキャッチアップしてください！
WordPressテーマの未来を一緒にのぞいてみませんか？
2022年1月21日(金) 20時〜オンライン開催のVWS勉強会で、開発リーダー石川がデモ画面を交えてブロックテーマについてお話しする予定です。これからWordPressテーマ開発や受託開発のフローなどがどうなっていくのか聞いてみたいという方はぜひお気軽にご参加ください。ご参加は無料です。
WordPress5.9の気になる新機能
さて、フルサイト編集の機能以外にも、WordPress本体やブロックエディタ関連でいろんな新機能が追加されています。
- WordPressコアの開発者ノート（英語）
https://make.wordpress.org/core/tag/dev-notes/ - WordPress バージョン5.9に入るGutenbergのバージョンは 10.8 から 11.9 です。ちなみにGutenbergの最新バージョンは12.2.0（2022/01/04現在）です。
https://developer.wordpress.org/block-editor/handbook/versions-in-wordpress/ - WordPress 5.9 Must-Haves のボード（英語）
https://github.com/WordPress/gutenberg/projects/62
Gutenberg バージョンそれぞれの公式ブログ記事がこちら（英語）：
- 10.8 https://wp.me/p2AvED-nff
- 10.9 https://wp.me/p2AvED-nky
- 11.0 https://wp.me/p2AvED-non
- 11.1 https://wp.me/p2AvED-nsW
- 11.2 https://wp.me/p2AvED-nw1
- 11.3 https://wp.me/p2AvED-nz7
- 11.4 https://wp.me/p2AvED-nCd
- 11.5 https://wp.me/p2AvED-nIl
- 11.6 https://wp.me/p2AvED-nLH
- 11.7 https://wp.me/p2AvED-nQd
- 11.8 https://wp.me/p2AvED-nTJ
- 11.9 https://wp.me/p2AvED-nYg
ということで、機能の一部となりますが、気になったポイントをピックアップしてみました！
ログイン画面に言語スイッチャーの導入
- Introducing new language switcher on the login screen in WP 5.9
https://wp.me/p2AvED-o89
WordPress管理画面のログインに言語スイッチャーが追加されています。言語の違うユーザーが想定される場合に、それぞれに合った言語を選択してログイン画面、パスワードリセット画面、登録画面を利用できるようになります。
利用者が日本人だけだと、あまり使う必要はないかもしれません。
言語スイッチャーを完全に削除する login_display_language_dropdown というフィルターも用意されています。
使用例: add_filter( 'login_display_language_dropdown', '__return_false' );
遅延読み込みパフォーマンスの向上
- Enhanced lazy-loading performance in 5.9
https://wp.me/p2AvED-odT
5.5 から実装された画像の遅延読み込み、そして5.7で実装されたiframeの遅延読み込みですが、2021年の調査でファーストビューにこれらの遅延読み込みが含まれていると、「ページの表示速度」や「読み込み時間」を示す指標であるLCP(Largest Contentful Paint)でパフォーマンスへの影響が判明したとのこと。このため、5.9では機能向上の改善点として、シングルページとアーカイブページの最初に出てくる画像とiframeの遅延読み込みはされないように微調整されました。これによりパフォーマンスの向上が見込まれるということです。
Gutenberg 10.8
再利用可能ブロックの省略メニューに「通常のブロックへ変換」が追加（32310）
再利用ブロックを通常のブロックに変換する時のアイコンがあるにはあるのですが、ちょっと分かりずらかったんですよね。3点の省略メニュー内に文字でも「通常のブロックへ変換」と表示されるようになりました。「あれ、ナイぞナイぞ…」となりがちでしたが、これで迷わなくなりそうですね。
Gutenberg 10.9
リッチなURLプレビュー（31464）
編集画面で設置したリンクにカーソルを合わせると、アイキャッチ画像とプレビューが表示されます。
（Googleドキュメントも同様のプレビュー機能がありますね。）
リスト表示：ネストされたブロックの展開と折りたたみを許可（32117）
「リスト表示」で入れ子になっている要素が折り畳めるようになり、開閉して見やすくなりました。
Gutenberg 11.0
再利用ブロック選択時にオーバーレイの効果が追加されました(31109)
再利用ブロックにカーソルを合わせると、うっすらブルーのオーバーレイの効果が出現するようになりました。これで、再利用ブロックかどうかに気付きやすくなったのではないでしょうか。
メディアテキストブロックで、ドラッグアンドドロップでメディア置換が可能に（29710）
すでに画像を設定しても、後から、自分のローカルPCにある画像ファイルをドラッグアンドドロップで置換できます。
Gutenberg 11.1
リスト表示でのドラッグアンドドロップが可能に（33320）
リスト表示でドラッグアンドドロップを使用して、ブロックを直感的に移動および並べ替え可能に。
Gutenberg 11.2
公開パネルに新しいページ/投稿ボタンを追加（33276）
複数の記事を連続して書いている場合、１つ公開が終わると、すぐに「新規投稿を追加」ボタンをクリックして次の投稿画面に移動できるようになりました。
Gutenberg 11. 4
ギャラリーブロックは画像ブロックを使用するようになりました
画像ブロックに用意されていたさまざまな機能やスタイルがギャラリーブロック内の画像でも使えるようになりました。例えば、画像ブロックで用意されていた「流体シェイプ」スタイルなどが、これまではギャラリーブロックでは使えませんでしたが、このバージョンからは使えるようになります。
そして、ギャラリーブロックならではの画像の移動、ドラッグアンドドロップ、コピー、キーボードナビゲーションなどの標準的な機能はそのまま活用できます。
Gutenberg 11. 5
見出しブロック：見出しレベルのメニュー表示が水平から垂直に（32926）
見出しのレベルを変更したい時に表示させるメニュ「H1〜H6」がこれまで水平に表示され、時にはH6まであることに気づかない、なんてことも起きがちでしたが、垂直に表示されることで見やすく、選択しやすくなっています。
Gutenberg 11. 6
非表示のアクティブアイテムの視覚的な手がかり（21892）
テキストに適用している、打ち消し線や下付き文字がある場合、下向きのトグルが黒色になり、視覚的にわかりやすくなりました。
Gutenberg 11. 7
インラインリンクUI から固定ページを作成する機能が有効に（35083）
もともとは、FSEのナビゲーションブロックのための機能でした。このバージョンからは、投稿の段落ブロックでインラインでリンクを設定するときに、新しい固定ページのURLスラッグを設定してページの生成ができるようになりました。ここから生成したページは、一旦下書きとして生成されるので、その後固定ページの一覧から編集可能です。
記事を書いている途中で、さらに追加で固定ページが生成したくなった場合に便利ですね。固定ページを生成する権限のあるユーザーでのみこの機能が有効となります。
Gutenberg 11. 8
子テーマのtheme.jsonを親テーマのtheme.jsonとマージできるように（35459）
theme.json を含む子テーマであれば、親テーマの theme.json で定義されたスタイルの上からスタイルを適用できるようになりました。親テーマの基本のスタイルを維持したまま、自分でカスタマイズしたスタイルを適用できます。もし、子テーマに theme.json が存在しない場合は、親のスタイルが適用され、その逆も同様です。
挿入ポイント、ドロップゾーン、およびその他の要素のアニメーションを追加（33132）
ブロックを追加できる挿入ポイント、画像のドロップゾーン、ブロックをドラッグ移動した時など、操作する際のアニメーションが新しく追加されています。
リスト表示で省略記号メニューを表示します（35170）
リスト表示の際、右端に３つの点が表示され、クリックすると編集メニューが表示され、そこから削除や編集のアクションができるようになりました。
見出し：見出しアンカーを自動生成します（30825）
見出しを設定した場合に、ページ内リンク先の設定として、「高度な設定」＞「HTMLアンカー」の欄に、英数字を設定できるようになっています。これまでは手動で設定するようになっていましたが、見出しの文字を自動で取り入れるようになりました。日本語で入力した見出しの文字がそのままHTMLアンカーに反映されます。同じものが続く場合は、末尾に -2 というようにナンバリングされていきます。
Gutenberg 11. 9
パターン一覧をモーダルで画面に大きく表示（35773）
これまで少し見づらかったパターンの一覧が、モーダルで画面いっぱいに表示されてより見やすくなりました。パターンのタブから [参照] をクリックすると表示されます。
ドラッグアンドドロップ：ドラッグされているブロックを非表示にする代わりに、ドラッグスロットを表示（33950）
ブロックをドラッグアンドドロップすると、ドラッグしているブロックがページから「持ち上げられ」、「元の場所」から削除されて、新しい場所にドロップされます。 この「元の場所」がどこにあったのかがわかるように「スロット」として維持され、ドロップが終了するまで表示されます。
ブロック設定ドロップダウンの「ブロックの削除」メニュー項目でブロックの名前を表示（35872）
これまで「ブロックを削除」と表示されていましたが、該当のブロック名を追加して、例えばカラムブロックを削除しようとしている場合には、「カラムを削除」というように、削除しようとしているブロックの名前が表示されるようになりました。
タイポグラフィツールの機能強化（34064）
段落、見出し、リストブロックなどのほとんどのテキストベースのブロックで、フォントスタイル、文字間隔、テキスト変換をサポートするようになりました。
以上、一部ですが、大きな変更から細やかな変更までご紹介してみました。
実際の画面を見ながらWordPress 5.9 の新機能を見てみよう！
2022年1月21日(金) 20時〜オンライン開催のVWS勉強会では、この記事で紹介したブロックエディタ周りのアップデート機能を実際の画面を見ながら触っていきますので、「どんな感じかな」と気になる方はぜひご参加ください。
また、開発リーダー石川がデモ画面を交えてブロックテーマについてお話しする予定です。これからWordPressテーマ開発や受託開発のフローなどがどうなっていくのか聞いてみたいという方はぜひお気軽にご参加ください。ご参加は無料です。
この記事を書いた人
- Marketer
- 株式会社ベクトルでリモートワークしながら、香港拠点でお仕事しております。北京語と広東語と英語をいずれも中途半端に操ります。VWS 勉強会の賑やかし担当。WordCamp Asia 2020&2023 実行委員。アジアをうろうろ。
最近の投稿
フルサイト編集対応ブロックテーマ
WordPress テーマ X-T9 は、WordPress 5.9 から実装されたフルサイト編集機能に対応した「ブロックテーマ」と呼ばれる新しい形式のテーマです。
ヘッダーやフッターなど、今までのテーマではカスタマイズが難しかったエリアもノーコードで簡単・柔軟にカスタマイズする事ができます。
パターンを使って
よりクオリティの高いサイトに
パターンとは、WordPressのブロックを組み合わせて作ったデザインテンプレートのようなもの。プロのデザイナーが制作したパターンを300以上公開中！コピペしながら高品質なサイトを簡単に作れます。
ブロックエディターで
ABテストを
自由に作成できる VK AB Testing
VK AB Testing は、ABテストを実施するための WordPress 用プラグインです。ブロックエディターでテストパターンを自由に作成でき、ランダム表示とクリック計測が可能です。Webサイトや広告などの施策の改善にぜひご活用ください。