VWSオンライン勉強会 #034 「WordPress最新バージョン6.0を触ってみよう」振り返り


  1. Staff Blog
  2. WordPress
  3. VWSオンライン勉強会 #034 「WordPress最新バージョン6.0を触ってみよう」振り返り

5/27(金)にVWSオンライン勉強会 #034「WordPress最新バージョン6.0を触ってみよう」を開催しましたので、振り返ってみたいと思います。リンク情報や動画アーカイブもこちらでご紹介しております。

Lightning やプラグインの新機能、新製品・新サービス紹介

VWS勉強会では、まず最初に、最近追加した機能や仕様変更事項などについて紹介しています。


また、VK Blocksについては、以下の対応・調整をしています。

  • リストブロクのアイコンの色(カスタムカラーパレット)指定対応しました
  • 段落タグからVKボタンブロックへの変換をサポート
  • スライダーブロック(Pro)で高さが自動で揃うように調整

VK Filter Search / VK Filter Search Pro 関連

本編:WordPress最新バージョン6.0を触ってみよう

本編の内容については、この後で紹介する動画でぜひご確認ください。主に以下の変更項目について解説しています。

スタイルのプレビューがかわった

編集画面でスタイルのプレビュー表示方法が変わっています。まず、気づきやすいところだと思います。

グループブロックの縦積み・横並びに変換

通常のグループと違う点

  • Flexになるので、中の要素の margin が効かない
  • 余談 : 縦積みなら縦積みようのCSSクラスが付くわけではなく、ブロックに対して直接flex指定される
  • ブロックのロック(移動と削除の無効化が出来るようになった)

ボタンブロック(コア)

  • ボタングループ内で新規追加した時に、既存のボタンデザインを引き継ぐ
  • (複製でいいのかも?)

その他

  • 公開前のカテゴリーやタグの提案
  • リストビューで「複数選択しての」ドラッグ&ドロップ
  • [[ で既存ページを呼び出せる
  • 段落ブロックをコードブロックに変換

Lightning では現状使えないアップデート

Lightningでも子テーマに theme.json を入れると使えます(ただ、現時点では一部壊れるので注意が必要)

  • グループブロックの margin
  • ギャラリーのギャップ指定が出来るようになった
    • theme.json で Gap 指定が有効になってないと使えない

theme.jsonってどんなもの?という方は、WordPress公式ハンドブック「グローバル設定とスタイル (theme.json)」を参考にしてみてください。

https://ja.wordpress.org/team/handbook/block-editor/how-to-guides/themes/theme-json/

なお、Lightningにtheme.jsonを標準で入れるかどうかについては、ただいま調整中です。

フルサイト編集向けの機能

  • コードエディタが利用可能に
  • カバーブロックの背景でアイキャッチが指定
  • テーマファイル全体がエクスポート可能に
  • テーマに patterns フォルダに入れればパターンが認識されるようになりました
    https://github.com/WordPress/gutenberg/pull/36751
  • 新規テンプレート追加時にテンプレートタイプが指定
    https://github.com/WordPress/gutenberg/pull/39353 → まだ作ってないテンプレートが候補に出てくる
  • クエリーループの追加時の改善(なんとなくプレビューが出るようになった)
  • タグクラウドブロックの文字サイズ指定機能
  • ブロック追加
    • アバター
    • 続きを読む
    • 投稿者の経歴
    • 投稿コメントフォーム
  • ブロック変換
    • カテゴリー(一覧)ブロックがタグブロックに変換
    • カレンダーブロックをアーカイブブロックに変換
  • スタイルセット
    https://gist.github.com/kjellr/1307387f8d97e84662c4b07af873a896

WordPress6.0の変更点をより詳しく知りたい人は、チーム・ベクトルのエンジニアしもむらさんが、Zenn(エンジニア向けの情報共有コミュニティ)でまとめています。ぜひ参考にしてください。

動画アーカイブ

上記でご案内したスライドとともに、本編の動画も合わせてご覧ください。目次となるタイムスタンプを設置しています。

VWS の Slack にご参加いただきますと、過去の動画アーカイブや関連リンクが見れます。無料でどなたでもご参加いただけますので、ぜひお気軽にご参加ください。

オンライン勉強会の動画を一般公開中!

2021年1月〜10月開催分を「VWSオンライン勉強会アーカイブス」で一般公開しています。見逃した回ありませんか? ぜひご覧ください。

次回のVWS勉強会は2022/06/23(木)予定

次回の勉強会は6月23日木曜日に開催予定です。connpassよりお申込みください。すでに多くの方よりお申し込みいただいています!

勉強会の開催は connpass でいち早くお知らせしています

勉強会については connpass やSNSにてお知らせしています。グループ「Vektor,Inc. Web Solutions」のメンバーになると、イベントが作成された時にメール通知が届きますので、ぜひご登録ください。興味ある勉強会を見逃すことなく参加できます。

この記事を書いた人

ササキ カオリ
ササキ カオリ
株式会社ベクトルでリモートワークしながら某レンタルサーバー会社にも時々勤務しているパラレルワーカーです。WordCamp Osaka 2019登壇しました。フジロックが好き。
フルサイト編集に対応したブロックテーマ X-T9

フルサイト編集対応ブロックテーマ

WordPress テーマ X-T9 は、WordPress 5.9 から実装されたフルサイト編集機能に対応した「ブロックテーマ」と呼ばれる新しい形式のテーマです。
ヘッダーやフッターなど、今までのテーマではカスタマイズが難しかったエリアもノーコードで簡単・柔軟にカスタマイズする事ができます。

パターンを使って

よりクオリティの高いサイトに

パターンとは、WordPressのブロックを組み合わせて作ったデザインテンプレートのようなもの。プロのデザイナーが制作したパターンを300以上公開中!コピペしながら高品質なサイトを簡単に作れます。

VK AB Testing は、ABテストを実施するための WordPress 用プラグインです。ブロックエディターでテストパターンを自由に作成でき、ランダム表示とクリック計測が可能です。Webサイトや広告などの施策の改善にぜひご活用ください。

VK AB Testing は、ABテストを実施するための WordPress 用プラグインです。ブロックエディターでテストパターンを自由に作成でき、ランダム表示とクリック計測が可能です。Webサイトや広告などの施策の改善にぜひご活用ください。


このデモサイトは Vektor,Inc. のテーマとプラグインで構築されています。ご購入や詳細情報は下記のリンクもご参考ください。

PAGE TOP