WordPress6.2 RC1 が 公開されました。 WordPress6.2 は 2023年03月28日に リリースされる予定なので いろいろチェックをしています。
その中の WordPress6.2 で気がついたところを取り上げていきます。
これから追加・変更があるかもですので、説明や画像等がリリース時と違う場合もありますが随時チェックしていく予定です。
※この記事はブロックテーマ「Twenty Twenty-Three」でテストしています。クラシックテーマでは使えない機能もありますのでご了承ください。
リリースまでのスケジュールは WordPress 6.2 Development Cycle に載っています。
【2023/03/30追記】
WordPress6.2 リリースされました https://wordpress.org/news/2023/03/dolphy/
Gutenberg ブロックエディタ
WordPress6.1では「Gutenbergプラグインver14.1」でしたが WordPress6.2では「Gutenbergプラグイン」ver15.1までが組み込まれました。
これらGutenbergプラグインの過去のバージョンの記事を見る事で 何が変更して追加されたか を見る事ができます。
Gutenbergの新機能 ver14.2 Gutenbergの新機能 ver14.3 Gutenbergの新機能 ver14.4 Gutenbergの新機能 ver14.5 Gutenbergの新機能 ver14.6 Gutenbergの新機能 ver14.7 Gutenbergの新機能 ver14.8 Gutenbergの新機能 ver14.9 Gutenbergの新機能 ver15.0 Gutenbergの新機能 ver15.1
ブロックの追加機能
WordPress6.2では新しいブロックや既存ブロックに新しい機能が追加されています。
但し、クラシックテーマでは反映されていない機能(設定にもよりますが)もありますのでご注意ください。
新しいブロック
テーマカテゴリで以下のブロックが追加されました。
【Post Author Name】 The author name.
ブロックパターン
ブロックパターンカテゴリは、WordPress6.1 では
「Buttons」「Columns」「Featured」「Footers」「Gallery」「Headers」「Text」「Query」でしたが
WordPress6.2 では
「Banners」「Buttons」「Columns」「Text」「Posts」「Featured」「Call to Action」「Team」「Testimonials」「Services」「Contact」「About」「Portfolio」「Gallery」「Media」「Posts」「Footers」「Headers」と増えています。
たくさん増えましたが登録されたブロックパターンのカテゴリの分だけけ出てきます。
また、ブロックパターンのUIが改善されてカテゴリと大きなプレビューが表示されるようになった為、目的のブロックパターンが見つけやすくなっています。(14.4)
【参考】Redesign the main pattern inserter #44028
https://github.com/WordPress/gutenberg/pull/44028
カレンダー(14.2)
カレンダーブロックに 背景、リンク、テキストの色を設定できるようになりました。
背景色と文字色の組み合わせによっては色のコントラスト警告が出るようになっています。
【参考】Calendar Block: Add color supports and polish styles #42029
https://github.com/WordPress/gutenberg/pull/42029
メディア(14.7)
■インサーターではメディアに画像や動画が登録されている場合、メディアタブが利用可能になり、ライブラリからメディアを追加できるようになります。メディアライブラリを直接開くボタンも用意されています。
【参考】[Inserter]: Add media tab #44918
https://github.com/WordPress/gutenberg/pull/44918
■また、WordPressのオープンライセンスの画像を取り込む事もできるようになっています。
【参考】Make Openverse
https://make.wordpress.org/openverse/
【参考】Explore more than 600 million creative works
https://openverse.org/
画像ブロック
■空の段落ブロックに画像を直接ドラッグアンドドロップして、画像ブロックとして画像を設置できるようになりました。(14.3)
【参考】Allow dropping an image on an empty paragraph block to create an image block #42722
https://github.com/WordPress/gutenberg/pull/42722
■ブロックツールバーに画像のキャプションを追加または削除できるボタンが追加されました。14.4)
【参考】[Block Library – Image]: Add toolbar button to add a caption #44965
https://github.com/WordPress/gutenberg/pull/44965
ギャラリーブロックの画像部分も同様です。(15.1)
【参考】Gallery Block: Add toolbar button to add a caption #47325
https://github.com/WordPress/gutenberg/pull/47325
Distraction free(14.4)
「Distraction free」モードが追加されました。
「Distraction free」モードを使うとサイドバーやツールバーが閉じて、コンテンツのみになり執筆しやすくなります。
解除する場合は、マウスカーソルを上にもってくるとツールバーが出てきますのでここで解除できます。
【参考】Introduce distraction free mode #41740
https://github.com/WordPress/gutenberg/pull/41740
タグクラウド(14.4)
タグクラウドにタイポグラフィのサポートを追加されました。
【参考】Tag Cloud: Add typography supports (except font size) #43452
https://github.com/WordPress/gutenberg/pull/43452
リストビューとドキュメント情報(14.5)
エディタのツールバーに「リスト表示」と「詳細」用の個別のアイコンがありましたが、WordPress6.2からは1つになりクリック後「リスト表示」と「Outline」が選択できるようになりました。
「Outline」には、文字数や単語数などの情報の他に見出しのリストが表示されるようになりました。
見出しの順序がおかしいと警告が出るようにもなっています。
【参考】Move document information and outline to list view panel #44788
https://github.com/WordPress/gutenberg/pull/44788
スタイルを貼り付けオプション(15.0)
「スタイルの貼り付け」が導入され、同じスタイルの複数のブロックを簡単に作成できるようになりました
①元のブロックのスタイルをコピーします。
②スタイルの反映させたいブロックに貼り付けます。
【参考】Add paste styles to the block settings #45477
https://github.com/WordPress/gutenberg/pull/45477
グループブロック(14.6)
■グループブロックを設置した際に使用するレイアウトのタイプを指定できるようになりました。
■Sticky Position(15.0)
グループブロックにStickyポジションのサポートが追加されました。
「Position」を「Sticky」にセットするとそのブロックがビューポート内に残るようになり、コンテンツがスクロールされたときに残りのコンテンツと共にスクロールするのではなく、ページの上部に固定されるようになります。
※theme.json で appearanceTools を有効にしてないと使えません。
【参考】Design Tools: Add a Position block support (including sticky), decoupled from layout #46142
https://github.com/WordPress/gutenberg/pull/46142
【参考】Sticky position block support
https://make.wordpress.org/core/2023/03/07/sticky-position-block-support/
■横並びブロックの垂直方向の配置コントロールに「Stretch to fill」オプションを追加されました。
「Stretch to fill」オプションにすると「align-items: stretch;」が設定されます。
【参考】Add missing controls to flex layouts. #47134
https://github.com/WordPress/gutenberg/pull/47134
■Dimensions(寸法) 最小の高さ
「Dimensions(寸法)」では「最小の高さ」がサポートされました。
※theme.json で appearanceTools を有効にしてないと使えません。
【参考】Minimum height dimensions block support
https://make.wordpress.org/core/2023/03/06/minimum-height-dimensions-block-support/
見出しブロック
見出しブロック(h1～h6)に class「wp-block-heading」が付くようになりました。
これは後述の新しいフィルター「WP_HTML_Tag_Processor」を使って追加されるようになっています。
【参考】[Heading block] Add a wp-block-heading CSS class #42122
https://github.com/WordPress/gutenberg/pull/42122
サイトエディタ(フルサイト編集 FSE)
WordPress6.2より サイトエディタの ベータラベルがなくなりました。
そろそろブロックテーマを触る機会が増えてきそうですね。ブロックテーマを使う際に利用する「サイトエディタ」もだいぶん細かい所を設定できるようになりました
サイトエディタの基本的な操作方法はこちらをご覧ください。
「サイトエディタを使用する| WordPress日本語サポート
https://wordpress.com/ja/support/site-editor/
新しいサイトエディター(14.8)
サイトエディターが新しくなりました。この機能に関する作業は進行中であり、新しいGutenbergがリリースされるにつれて改善され続けるようです。
【参考】Reorganize the site editor to introduce Browse Mode. #44770
https://github.com/WordPress/gutenberg/pull/44770
【参考】Site Editor: Try template drill down on shell sidebar (browse mode) #45100
https://github.com/WordPress/gutenberg/pull/45100
【参考】Allow adding new templates and template parts directly from the sidebar #46458
https://github.com/WordPress/gutenberg/pull/46458
スタイルのタイポグラフィコントロール(14.3)
スタイルのタイポグラフィコントロールでは「リセット」ができるようになりました。
一括リセットもできますが個別にリセットする事もできます。
いろいろ設定(試行錯誤)していて、わからなくなった時に「リセット」できるようになるのはありがたいです。
【参考】Use ToolsPanel in Global Styles → Typography #44180
https://github.com/WordPress/gutenberg/pull/44180
ナビゲーション
■ナビゲーションの設定がブロック設定サイドバー内のリスト表示で個々のメニュー項目の配置を変更できるようになりました。(14.6)
リスト表示でできるのであのうっとうしいポップアップ地獄からは開放されそうです。
【参考】Adds a list view to the navigation block #45546
https://github.com/WordPress/gutenberg/pull/45546
【参考】Navigation Link: Add the URL field to the Navigation Link inspector controls #45751
https://github.com/WordPress/gutenberg/pull/45751
■ナビゲーションブロックのロック機能に「編集を制限」が追加されました。(14.4)
【参考】Adds content locking to navigation block #44739
https://github.com/WordPress/gutenberg/pull/44739
追加CSS(14.8)
あの「追加CSS」がサイトエディター上で使えるようになりました。
入力したCSSは「global-styles-inline-css」に追加されます。
※minifyはしてません。
【参考】Global styles: add custom CSS panel to site editor #46141
https://github.com/WordPress/gutenberg/pull/46141
【参考】Custom CSS for global styles and per block
https://make.wordpress.org/core/2023/03/06/custom-css-for-global-styles-and-per-block/
グローバルスタイルのブロックスタイル
■グローバルスタイルの各ブロックスタイル設定に簡単なプレビューが表示されるようになりました。(15.0)
【参考】Edit block style variations from global styles #46343
https://github.com/WordPress/gutenberg/pull/46343
■ブロックスタイル設定ではブロックごとにカスタムCSSを追加できるようになりました。(15.1)
ブロックのセレクタに紐づくので、セレクタは不要です。
例えば、↑参考画像の場合、「見出し」の class「wp-block-heading」に 反映されます。
CSS構文が間違っていると検証アイコンが出て警告してくれます。
【参考】Global Styles: Try per block custom CSS #46571
https://github.com/WordPress/gutenberg/pull/46571
■ボタンブロックにシャドウプリセットをサポートするようになりました。(15.1)
theme.json でシャドウプリセットを追加する事もできます。
【参考】Shadow: Add shadow presets and UI tools in global styles #46502
https://github.com/WordPress/gutenberg/pull/46502
他のブロックにもボックスシャドウのサポートを追加しましたが、現時点ではコード エディターで書き込む必要があるようです。
【参考】Add box shadow support to blocks (using code editor for now). #46896
https://github.com/WordPress/gutenberg/pull/46896
テンプレートのアイキャッチ画像(15.1)
テンプレートのアイキャッチ画像の画像サイズを指定できるようになりました。
【参考】Enable image size for featured images in templates #46848
https://github.com/WordPress/gutenberg/pull/46848
開発者向け
WordPress6.2 ではいろいろな機能やアクションフィルターが追加されています。
そのなかで ぉ! と思ったのを紹介します。
カスタムブロック
■skipBlockSupportAttributes
ServerSideRender に「skipBlockSupportAttributes(prop)」が追加されました。
skipBlockSupportAttributesを適応すると、エディターでは、ブロックラッパーとレンダリングされた要素の両方でスタイルとCSSクラスが重複しなくなります。
【参考】Add new prop to ServerSideRender component
https://make.wordpress.org/core/2023/03/06/add-new-prop-to-serversiderender-component/
【参考】ServerSideRender: add new skipBlockSupportAttributes prop #44491
https://github.com/WordPress/gutenberg/pull/44491
■blockEditor.useSetting.before
エディターがレンダリングされる前に開発者がブロック設定を変更できるフィルターが追加されました。
【参考】Customize settings for any block in WordPress 6.2
https://make.wordpress.org/core/2023/02/28/custom-settings-wordpress-6-2/
■新しいブロックインスペクタータブ
ブロックエディタのインスペクタータブが新しくなりました。
カスタムブロックを制作する場合はちょっとここ読んでみてください。
【参考】Introduction of Block Inspector Tabs
https://make.wordpress.org/core/2023/03/07/introduction-of-block-inspector-tabs/
新しい関数/フィルター
■WP_HTML_Tag_Processor
WP_HTML_Tag_Processor を使うと、既存ブロックのHTMLタグ属性を調整できるようになります。
【参考】WP_HTML_Tag_Processor overview issue #44410
https://github.com/WordPress/gutenberg/issues/44410#issuecomment-1420787816
■search_columnsフィルター
post_search_columns/user_search_columns/site_search_columnsフィルターが追加されました。
キーワード検索の場合、対象はpost_title、post_excerpt、post_content以外に方法がありませんでしたが、post_search_columnsフィルターで調整できるようになりました。
【参考】Introduce the ability to control which fields are searched in a search query
https://core.trac.wordpress.org/ticket/43867
他には、こちらに@AkiHamanoさんが わかりやすくまとめていますので参考にしてください。
【参考】WordPress6.2で追加された関数・クラス・アクション/フィルタ―フックまとめ
https://qiita.com/AkiHamano/items/4f7813af84bea0c2c1ce
ブロックパターン
ブロックパターンを制作する際に、利用できるテンプレートを指定する事ができるようになりました。
register_block_pattern() 内で「template_types」パラメーターを使って指定します。
【参考】Patterns API expanded to include template_types property
https://make.wordpress.org/core/2023/03/07/patterns-api-expanded-to-include-template_types-property/
非推奨になった関数
タイトルを指定してページを取得する関数
get_page_by_title
※WP_Queryを使うようになりました。
【参考】get_page_by_title() deprecated
https://make.wordpress.org/core/2023/03/06/get_page_by_title-deprecated/
PHPMailerを6.7に更新
メールを送信するモジュール「PHPMailer」が v6.7へバージョンアップされました。
特に気にする必要はありませんが、問い合わせ等のメールテストはしといた方がいいです。
【参考】Update PHPMailer to 6.7.0
https://core.trac.wordpress.org/ticket/57281
jQuery
jQueryライブラリをバージョン 3.6.1 から 3.6.3 に更新しました。
【参考】Update jQuery v3.6.1 to v3.6.3
https://core.trac.wordpress.org/ticket/57324
jQuery Migrate をバージョン 3.3.1 から 3.4.0 に更新しまdした。
【参考】Update jquery-migrate to version 3.4.0
https://core.trac.wordpress.org/ticket/56743
おまけ
もっと他にも細かく知りたい場合はこちらのサイトでまとめられていますので御一読してみてください。
【参考】WordPress 6.2 Field Guide
https://make.wordpress.org/core/2023/03/09/wordpress-6-2-field-guide/
【参考】WordPress 6.2 Source of Truth – agm
https://nomad.blog/2023/03/01/wordpress-6-2-source-of-truth/
WorPress6.2で TwentyTwelve ～ TwentySeventeen の各テーマに GoogleFonts をバンドル
WorPress6.2リリースのタイミングで で Googleフォントを、Googleフォントサーバーを使用するのではなく、テーマ自体から提供するようになるもようです。
【参考】Google Fonts are included locally in bundled themes
https://make.wordpress.org/core/2023/03/06/google-fonts-are-included-locally-in-bundled-themes/
どうしてそうしたのかの説明も書いています。
【参考】[Twenty Twelve to Twenty Seventeen]: bundle Google Fonts in each theme
https://core.trac.wordpress.org/ticket/55985
【参考】German Court Fines Website Owner for Violating the GDPR by Using Google-Hosted Fonts
https://wptavern.com/german-court-fines-website-owner-for-violating-the-gdpr-by-using-google-hosted-fonts
将来的にはフォント管理できる「Webfonts API」を使うのかな?とも思っています。
【参考】Webfonts API: Ongoing Roadmap #41479
https://github.com/WordPress/gutenberg/issues/41479
子テーマでフォントを設定していたり、Googleフォントに独自のクエリを設定していたりして うまく動作してない場合は、上記の記事を参考にしてみてください。
Appearance Tools
WordPress6.2からクラシックテーマでも「appearanceTools」が使えるように「add_theme_support」を準備していましたが、一部のブロックでうまくいってないようなので延期になったもようです。
【参考】Bundled themes: opt-in to appearance tools
https://core.trac.wordpress.org/ticket/56487#comment:27
PHP8.1
PHP8.1で動かしてると、WordPress6.1ではまだ Deprecated がいくつか出てましたが WordPress6.2 では完全に出なくなりました。
もう大丈夫かな?
WP Multibyte Patch
毎回 言いますが WordPress5.0から 必須のプラグインで 日本語版パッケージに 付属してた「WP Multibyte Patchプラグイン」は含まれなくなっています。
だいたい いけるようにはなってますが 日本語で使う場合は やっばり必ず 最新版をインストール → 有効化 してくださいね。
【参考】WordPress 5.0 利用開始前に知っておくべきこと
https://ja.wordpress.org/2018/11/04/things-to-know-before-using-wordpress-5-0/
WP Multibyte Patch プラグイン
https://ja.wordpress.org/plugins/wp-multibyte-patch/
WP Multibyte Patch – EastCoder;
https://eastcoder.com/code/wp-multibyte-patch/
本家版、日本語版 WordPress のマルチバイト文字の取り扱いに関する不具合の累積的修正と強化を行うプラグインです。英語圏で作られた WordPress を日本語環境で正しく動作させるために必要となる機能を網羅していますので、なんらかの対策を行っていない場合は導入をおすすめします。
バックアップとってね
メジャーアップデートでは必ずバックアップをとるようにしましょう。ファイルとデータベースのバックアップは必ずとるようにしてください。
【参考】WordPress のバックアップ – WordPress サポート
https://ja.wordpress.org/support/article/wordpress-backups/
できれば 本番のバックアップから テスト環境 を作って動作テストをする事をお勧めします。
ダウングレード
新しいメジャーバージョンのWordPressがリリースされて すぐにバージョンアップしても、今使ってるテーマやプラグインが対応していなくて なんかおかしい場合がよくあります。
こんな時は、対応してくれるまで ひとまず変更前のバージョンのWordPressに戻す という方法もあります。
※今使ってるWordPressのバージョンくらいは覚えといてくださいね。
【参考】WP Downgrade | Specific Core Version
https://ja.wordpress.org/plugins/wp-downgrade/
