Divi 5 パブリックベータ 6 が公開されました。

記事
IT・テクノロジー
Divi 4 よりも使いやすくなった Divi 5 をご利用の方は、すぐにご利用いただけます。Divi 5 をご利用の方は、パブリックベータ 6 のアップデート通知をご確認いただけます。Divi 5 は 2 週間ごとに新しいバージョンをリリースしており、各バージョンは前バージョンよりも改良されております。


パブリックベータ 6 の新機能は何ですか?

パブリックベータ 6 では、104 件のバグ修正と改善を実施し、Semantic Elements & HTML Wrappers という新機能をリリースいたしました。

ここ数ヶ月、Divi 開発チームはバグ修正と細かな改善に注力してまいりました。Divi 5 の正式リリースに向けて、開発チームが一丸となってユーザーからのフィードバックに引き続き対応してまいります。約 1 年間の公開テストと機能強化を経て、Divi 5 は安定版となり、ベータ版のステータスを解除し、正式リリースに向けて準備を進めております。

それまでの間、Divi 4 よりも Divi 5 をご利用いただくことができます。ぜひ試してみて、Divi の未来を今すぐ体験してください。開発チームは、ユーザーから最もリクエストが多かった機能の開発にも取り組んでおります。最新情報をいち早く入手したい方は、Divi テーマユーザー Facebook グループで開発チームが進捗状況を頻繁に投稿しておりますので、ぜひご参加ください。

セマンティック要素と HTML ラッパー


パブリックベータ 5.2 でセマンティック要素と HTML ラッパーをリリースいたしました。あらゆるモジュールの要素タイプを変更し、ナビゲーション、セクション、ヘッダー、ボタンなどのセマンティックタグを活用して、それぞれに固有の意味を与えることができるようになりました。これは、スクリーンリーダーやボットがページの構造を理解できるようになるため、アクセシビリティと SEO にとって重要でございます。

たとえば、Divi 要素を使用して独自のメニューを作成し、セマンティックタグを「nav」に変更して、スクリーンリーダーにその目的を通知することができます。

また、任意の要素の前後にカスタム HTML を追加する機能も追加され、より自由にカスタムラッパーを作成し、コードモジュールがアクセスできないページの特定の領域にコードを挿入できるようになりました。

修正と改善


このアップデートに含まれるすべての修正と改善のリストを以下に示します。

サポートされている 32 言語すべてで D5 Visual Builder UI の翻訳サポートが追加されました。ホストされた MP4 ビデオでビデオスライダーオーバーレイと再生アイコンが表示されない問題を修正いたしました。サイト全体のレスポンシブブレークポイントで有効になっているカスタムブレークポイントがモジュールの表示オプションに表示されず、ユーザーがカスタムブレークポイントでモジュールを非表示にできない問題を修正いたしました。

プリセットを適用したときに、モジュール設定パネルに「Circle Counter」、「Circle Background Color」、「Circle Background Opacity」のプリセット値が表示されない問題を修正いたしました。保存失敗モーダルの「バックアップのダウンロード」ボタンを修正し、ポータビリティエクスポートシステムを使用して現在のページの JSON バックアップを実際にダウンロードできるようにいたしました。

モジュールロック機能を修正し、ビジュアルビルダーでロックされたモジュールに適切なスタイルのビジュアルロックインジケーターを追加いたしました。視差背景画像でグローバルカラーを使用するときに、Visual Builder でグラデーションがレンダリングされない問題を修正いたしました。

Divi ライブラリの移植性において、複数のレイアウトファイルを同時にインポートするためのサポートが追加されました。Woo 通知モジュールのデザインタブで、商品ページとカートページタイプの「本文テキスト」オプショングループが、適用されない場合に表示される問題を修正いたしました。このグループは、ページタイプが「チェックアウト」に設定されている場合にのみ表示されるようになりました。

ACF リピーターフィールドにループビルダーでアクセスできない問題を修正いたしました。また、Divi 5 モジュールでカスタムフィールドコンポーネントを登録するためのドキュメントを更新いたしました。

カルーセルの境界に到達したときに、グループカルーセルの自動回転でスライドの遷移タイミングが一貫していない問題を修正いたしました。カスタム属性およびインタラクションビルダーモーダル内のドロップダウンフィールドの外側をクリックすると、モーダルが予期せず閉じる問題を修正いたしました。モーダル全体を閉じることなく、ドロップダウンが個別に閉じるようになりました。

ランダム順序ループを修正し、ページの再読み込み時に注目の画像が正しく更新されるようにいたしました。Divi 4 から Divi 5 に移行した後に不要な下余白を追加するコードモジュールを修正いたしました。カテゴリとタグの条件を処理する際の表示条件に関する問題を修正いたしました。

グリッドレイアウトの単位ピッカーを修正し、fr(分数)単位を選択可能なオプションとして表示することで、CSS グリッドレイアウトの発見性と使いやすさが向上いたしました。テーマビルダーテンプレートに表示されるときにメディアライブラリのメタデータから自動的に入力することにより、ループビルダーの注目画像で欠落していた alt 属性と title 属性を修正いたしました。

ループ構成に関する問題を修正し、ループ変数が正しく表示されるようになりました。Divi 4 でコンテンツを編集した後、互換性チェックを再実行したときに移行ツールが誤ったモジュール数を表示する問題を修正いたしました。

スライドインヘッダーサブメニューの拡張機能を修正いたしました。Visual Builder の空の列を修正し、デフォルトの空の列インジケーターによって上書きされることなく、カスタム境界線スタイルが正しく機能するようにいたしました。

D5 で透明なヘッダーが Hero モジュールに正しく重ならなかった問題を修正いたしました。パディングはセクションラッパーではなくモジュールに適用され、D4 の動作と一致するようになりました。レイアウトスタイルフィールドを手動で「flex」(既定値)に設定すると、変更された値が暗いテキストとリセットアイコンとともに誤って表示される問題を修正いたしました。

ライブラリポータビリティ後にページポータビリティを開いたときにタブの表示が失われ、インポートルーティングが正しく行われない問題を修正いたしました。タブレットと電話のブレークポイントで視差が有効になっている場合に、背景のグラデーションがデスクトップのブレークポイントから継承されない問題を修正いたしました。

数値関数の値がデフォルト値と異なる場合に、ブレークポイントの入力フィールドに表示されない問題を修正いたしました。親モジュールにレスポンシブコンテンツがある場合にフロントエンドでネストされたモジュールが消える問題を修正いたしました。

Visual Builder の視差背景画像のあるセクションでホバー時に境界線の半径が消える問題を修正いたしました。開発者向けのドキュメントを追加し、Divi 4 から Divi 5 への移行に関する情報を充実させました。

「ボタンアイコンを表示」を有効にしてデフォルトのアイコンを使用すると、WooCommerce カート合計、チェックアウト支払い、およびカート通知モジュールでボタンアイコンの垂直配置の問題を修正いたしました。WooCommerce 製品カートに追加モジュールのボタンアイコン間隔の問題を修正し、他のモジュールおよびカスタムアイコン間隔と一致するようにいたしました。

WooCommerce モジュールでテーマビルダーテンプレートを使用するときに、WooCommerce ズームアイコンとスタイルがアーカイブページに読み込まれない問題を修正いたしました。取得した幅と高さの属性をモジュール属性に保持することで、Hero モジュール内のロゴ画像が誤ったサイズで読み込まれ、その後 Visual Builder でサイズが変更される問題を修正いたしました。

ロックされたモジュールのカーソルポインターの誤りを修正いたしました。ロックアイコンには、ロックされたすべての要素(セクション、行、モジュール)のポインターカーソルが常に表示されるようになりました。また、ロックされたモジュール自体には、移動できないことを示すために「移動不可」カーソルが表示されます。

列レイアウト方向を使用するときに、アイコンリスト項目のスタイルがデフォルトのスタイルによって上書きされる問題を修正いたしました。PHP 8.4 との互換性を向上させました。

自動マージンの競合により、CSS グリッドレイアウトで画像モジュールの justify-self 配置が機能しない問題を修正いたしました。ヒストリー操作中にグローバルカラーを復元すると、やり直しが機能しなくなる問題を修正いたしました。この修正により、グローバルカラーを含むプリセットを適用する場合にも同じ問題が解消されます。

入力時にすべてのブレークポイントが誤って更新されていたレスポンシブエディターのリッチテキストフィールドを修正し、レスポンシブエディターでリッチテキストフィールドにフォーカスしたときに自動的にブレークポイントが切り替わる機能を追加いたしました。開発者向けのドキュメントを追加いたしました。

PHP のエラーを修正し、より安定した動作を実現いたしました。

親モジュールと子モジュールのスタイルが競合している場合に、ネストされたテキストモジュールのデザインスタイルが Visual Builder で正しく適用されない問題を修正いたしました。両方が変更されている場合でも、変更されたフィルターで上部と下部のセクション区切りフィールドが両方表示されない問題を修正いたしました。

モジュールおよびグループプリセットスタックの変更がグローバルモジュールインスタンス間で同期されない問題を修正いたしました。また、すべてのグループプリセットを削除すると、ページの更新後に新しいプリセットを追加できなくなる問題も修正いたしました。セクションで「上に要素を追加」を使用するときに、一貫性のない自動モーダル開きを修正いたしました。

キャンバスグリッドビューからエクスポートしたときにメインキャンバスのメインステータスが失われる問題を修正いたしました。ブログモジュールでオーディオ、リンク、または引用投稿形式の投稿を表示する際の問題を修正いたしました。

カスタム CSS クラスに先頭のドットやその他の無効な構造が含まれている場合にモジュールのドラッグアンドドロップが失敗する問題を修正いたしました。特にグラデーションの長さが設定されている場合に、背景グラデーションを有効にした後に無効にできない問題を修正いたしました。

ギャラリーモジュールボックスの影がスライダーレイアウトの境界線の半径に従わなかった問題を修正いたしました。ワイヤーフレームモードを修正し、デスクトップビューで列が正しく表示されるようになりました。

モジュール間でアイテムスタイルをコピーして貼り付けるときにレイアウト属性が含まれない問題を修正いたしました。ビデオスライダーモジュールがタブモジュール内にネストされている場合、最初のタブの後のタブにビデオスライダーのサムネイルが表示されない問題を修正いたしました。

D5 に永続的に移行した後に D4 要素プリセットを削除できない問題を修正いたしました。背景を無効にした状態で Divi 4 から移行された CTA モジュールに、元の Divi 4 レイアウトには存在しなかった不要なパディングが表示される問題を修正いたしました。

グループカルーセルの自動回転速度単位変換を修正し、秒単位設定が正しく有効になるようにいたしました。テーマビルダーの製品テンプレートに WooCommerce モジュールが存在する場合に、投稿コンテンツモジュールが製品コンテンツをレンダリングしない問題を修正いたしました。

テーマビルダーテンプレートで投稿コンテンツモジュールの表示を改善いたしました。「必須ではない」とマークされた連絡フォームのドロップダウンフィールドが、フォームの送信時に選択されていない場合に誤って検証エラーを表示する問題を修正いたしました。

テーマビルダーレイアウトで透明なコンテンツ領域の背景色が機能しない問題を修正いたしました。開発者向けドキュメントを更新いたしました。

アイコンリストモジュールのアイコンの間隔が、モジュール設定でカスタマイズしても適用されない問題を修正いたしました。ドキュメントのフィードバック脚注を更新して、Discord 参照を削除し、すべてのドキュメントページで一貫したフォーマットを確保いたしました。

お問い合わせフォームモジュールの reCAPTCHA v3 統合を修正し、reCAPTCHA v3 が有効になっているフォームが正常に送信できるようになりました。Divi 4 から Divi 5 への移行中に、Person モジュールのレイアウトがブロックからフレックスに変更される問題を修正し、元の Divi 4 ブロックレイアウトの外観を維持いたしました。

テーマビルダーのキャンバスプレビューでアイコンリスト項目のレイアウト方向が正しく表示されない問題を修正いたしました。イメージモジュールと全幅イメージモジュールのオーバーレイオプショングループがプリセットモードで表示されない問題を修正し、オーバーレイグループと配置グループのオプショングループプリセット機能を有効にいたしました。

アコーディオンモジュールの最初の項目の後の項目にビデオスライダーのサムネイルが表示されない問題を修正いたしました。「おすすめ画像の表示」、「ギャラリー画像の表示」、または「セールバッジの表示」オプションを切り替えても、Visual Builder で Woo 製品画像モジュールのプレビューが更新されない問題を修正いたしました。

VB ライブラリインポートで、ライブラリからレイアウトをインポートするときに複数のファイルを選択できない問題を修正いたしました。境界線のスタイルを明示的に設定せずに境界線の幅を設定すると、Woo Checkout Payment モジュールおよびデフォルトの境界線スタイルを持つその他のモジュールで境界線が表示されない問題を修正いたしました。

Divi 5 でスライダーレイアウトを使用するときに Woo 製品ギャラリーモジュールの画像が切り取られる問題を修正いたしました。移行に関するドキュメントを更新いたしました。

新しい HTML オプショングループを追加いたしました。任意の要素のセマンティックタグを選択するための新しい要素タイプオプションが追加されました。すべての要素に新しい HTML Before および HTML After オプションを追加いたしました。

テーマビルダーテンプレートを使用したページで 2 回目のページ読み込み時に発生していたスタイルの問題を修正いたしました。範囲フィールドのスピナー矢印が小数点以下の値を正しく表示するように修正いたしました。

カスタム値が設定されている場合に、タブレットおよびモバイルのブレークポイントで列の下余白が適用されない問題を修正いたしました。開発者向けのドキュメントを追加し、カスタムモジュール開発に関する情報を充実させました。

グローバルカラーを含むレイアウトをインポートした後、モジュール設定にグローバルカラーラベルが表示されない問題を修正いたしました。CSS グリッドレイアウトを修正し、最大 12 列に制限されるのではなく、任意の数の列を使用できるようになりました。

Divi 4 から Divi 5 への移行に関する詳細なドキュメントを追加し、テキストシャドウ、ボックスシャドウ、境界線、フィルターなどの設定をマッピングする方法を説明いたしました。開発者向けの包括的なチュートリアルドキュメントを追加いたしました。

Divi 4 から Divi 5 に移行するときに、一部のサードパーティ製プラグインのショートコードが属性値を失う問題を修正いたしました。暗い背景のスライド内にネストされている場合にトグルモジュールのタイトルの色が適用されない問題を修正いたしました。

WooCommerce 製品の重複によって Divi 5 コンテンツが破損する問題を修正いたしました。ビジュアルビルダーとフロントエンド間のループ抜粋の省略記号の書式設定の一貫性を修正いたしました。

ウェブサイトにグローバルテーマビルダーフッターテンプレートのみが適用され、他のテンプレートが適用されていない場合にビルダーが読み込まれない問題を修正いたしました。ページで同じキャンバス上の要素をターゲットとするインタラクションが使用されていた場合に、複数のページが読み込まれた後にフロントエンドで壊れたスタイルを修正いたしました。

ループ検出に関する問題を修正いたしました。

まとめ

本記事では、Divi 5 パブリックベータ 6 の新機能と改善点について詳しく解説いたしました。104 件のバグ修正と改善により、Divi 5 はより安定し、使いやすくなっております。セマンティック要素と HTML ラッパーの新機能により、アクセシビリティと SEO の向上が期待できます。

Divi 5 は、コードを書くことなく、視覚的な操作だけでプロフェッショナルなウェブサイトを構築できる強力なツールでございます。ぜひ、実際に試してみて、その柔軟性と使いやすさを体験していただければと存じます。

本稿が、皆様のウェブサイト構築・運用の一助となれば幸いでございます。

サービス数40万件のスキルマーケット、あなたにぴったりのサービスを探す ココナラコンテンツマーケット ノウハウ記事・テンプレート・デザイン素材はこちら