カスタムレスポンシブブレイクポイントは、デバイス毎の表示においてデザインを切り替える幅の境界値を設定できる機能だ。
従来のDiviではデスクトップ, タブレット, スマートフォンの3種類に分かれていた。
Divi 5ではさらに細かく、スマホ縦/スマホ横/タブレット縦/タブレット横/デスクトップ(標準)/ワイドスクリーン/ウルトラワイド の最大7種類の設定が可能となる。
それぞれのデバイス毎のブレイクポイントの値も自分で設定することができる。
Elegant Themes公式の新機能紹介動画がこちら。
設定したブレイクポイントはDiviビルダーの上部にアイコンで表示されるようになる。
このブレイクポイントの設定は、作業ページのみではなくDiviビルダーで制作しているWebページ全体に適用される。
設定したブレイクポイント間の表示はスライダーを操作することで逐一確認できる。
ウルトラワイドの画面サイズに関して、自分の作業環境が設定する画面よりも小さい場合でも、プロポーションを保ったまま縮小されて表示されるため、問題なく作業が進められる。
この機能が実装されるのを待ち望んでいたDiviユーザーも多く、賞賛のコメントが多く見られた。
同様にDivi 5 の新機能であるアドバンスユニットと組み合わせて使用すると、レスポンシブデザインの制作がよりスムーズに行えるだろう。
Divi 5 新機能紹介 : アドバンスユニット
幅広いCSSの単位系や関数・変数に対応した多機能フィールドが利用可能に
詳細情報
Divi 5
リリース時期 : 未定
価格 : $89(年間プラン), $249(買い切りプラン)
Divi 5がリリースされた場合、Diviの既存ユーザーであれば無料でアップデートができ利用できる。
リリース前のアルファ版 Divi 5のデモが公開されており、web上で使用感を体験することが可能だ。
Divi 5公式ページはこちら
新着記事
ElementorがAllyを発表 無料のWebアクセシビリティ向上を補完するプラグイン
当記事は広告を含みますElementorElementor(エレメンター)は3月26日、WordPress用無料プラグイン"Ally"のリリースを発表した。 Webのアクセシビリティ向上を補助してくれる機能が盛り込まれている。ElemantorはWordPress用無料プラグイン"Ally(エーライ)"をリリースした。 コントラスト調整やテキストサイズの変更などのWebのアクセシビリティ向上に関する機能を有している。 基本無料で、一部機能が有料プランにて開放される。...
Divi 5の新機能 : 列のネスト 列を入れ子構造にしたエレメントの配置構成が可能に
当記事は広告を含みますDivi 5Elegant Themesは3月28日、Divi 5 の新機能として、列のネスト(Nested Row)を実装することを発表した。 よりデザインを組みやすくなる、待ち望まれていた機能の一つだ。Divi 5に列のネストが実装される。 機能としては至ってシンプルで、列(Row)の中に更に列を配置できるというもの。 Elegant Themes公式の列のネスト、新機能紹介動画がこちら。従来のDivi 4までは、列の中にはテキストや画像などのモジュールを入れる事しかできなかった。...
Diviが大幅に進化 Divi 5とは? 特徴や公開時期、価格について解説
当記事は広告を含みますDiviWordPressテーマ及び、WebサイトビルダーのDiviは2025年で発売から17年目を迎えるロングセラーの人気テーマです。 そんなDiviが、Divi 5となって大幅に進化するので詳しく説明していきます。CONTENTS Divi 5とは Divi 5の特徴 Divi 5の進行状況 公開時期や価格は? まとめDivi 5 パブリックベータ版 近日公開予定 2024.9.27 Divi 5 パブリックアルファ版 公開Divi Anniversary...