エディターV4 アルファは、以下のオプションから始めることができる。 カスケーディングスタイルシート 再利用可能なクラスとステート、パフォーマンスの向上、統(tǒng)一されたスタイル?システム、完全なレスポンシブ?スタイル?コントロールを提供するコア?フレームワークで、ウェブサイト構(gòu)築の効率と一貫性を向上させるように設(shè)計(jì)されています。

ウェブデザインが年々進(jìn)化するにつれ、ウェブサイト制作者が直面する課題も大きくなり、多くの人が同じような問題に直面しています：

• ウェブサイト內(nèi)の複數(shù)の要素を一貫してスタイリングする際の問題
• 複數(shù)の場(chǎng)所で同じスタイルを更新する際の作業(yè)の重複
• カスタムCSSの使用や要素の非表示を強(qiáng)制することで、応答性を制限する。
• 複雑なレイアウトによるパフォーマンス低下
• ウィジェット間のインターフェイスの違い

エディターV4は、CSSを中心とした強(qiáng)力なフレームワークにより、1行もコードを書くことなくプロ級(jí)の機(jī)能を提供し、これらの問題に対処します。

エディターV4の最初のアルファバージョンは、現(xiàn)在オプショナル?エクスペリエンスとしてご利用いただけます。これらの新機(jī)能をテストし、フィードバックを提供し、私たちがV4エクスペリエンスの拡張と改良を続ける間、使い慣れたV3の機(jī)能を使い続けることができます。

エディターV4アルファを使い始めるには、次のようにアップデートしてください。 エレメンタ 3.29の場(chǎng)合は、Elementor > Settings > Editor V4に移動(dòng)し、アクティベーション手順に従ってください。これは初期のアルファバージョンであり、ステージングまたはテストサイトでのみ使用することに注意してください。

一度スタイリングすれば、どこにでも適用できる。

同じデザインのボタンがたくさんあるウェブサイトを作ることを想像してみてください。以前は、ボタンを1つ1つスタイリングするか、別の方法に頼る必要がありました。しかし、Editor V4のクラスシステムでは、以下のことが可能になりました：

• 複數(shù)の要素に適用できる再利用可能なスタイル?コレクションを作成する。
• ある場(chǎng)所でスタイルを更新すると、そのスタイルを使用しているすべての場(chǎng)所に変更が即座に反映されます。
• サイト全體のデザインの一貫性を保つ

クラス制度では、2種類のクラスを?qū)毪筏皮い耄?/p>

• ローカルクラス 各要素は、スタイルの優(yōu)先順位が最も高く、削除できない一意のローカル?クラス（ピンクで表示）を自動(dòng)的に取得します。要素固有のスタイルが他のクラスによってオーバーライドされないようにします。
• グローバルクラス これらのスタイルを共有する必要がある要素に適用するために、獨(dú)自のグローバル?クラス（緑色で表示）を作成し、名前を付けることができます。グローバルクラスを更新すると、それを使用するすべての要素が同時(shí)に更新されます。クラス自體を削除することなく、要素からグローバルクラスを削除することができるので、デザイン時(shí)にさまざまなデザインを簡(jiǎn)単に試すことができます。

コードを書かずにインタラクティブなスタイルを定義する - Statesを使う

ステート（擬似クラス）を使用して、サイトをよりインタラクティブにしましょう。ホバー、フォーカス、アクティベートなどのステートを作成することで、ユーザーが要素とインタラクトしたときに要素がどのように見えるかを定義できます。こうすることで、コードを書くことなく、魅力的なインタラクティブ體験をデザインすることができます。

狀態(tài)を追加するには、狀態(tài)を適用したいクラスの橫にある3つの點(diǎn)をクリックし、Hover、Active、またはFocusの狀態(tài)を選択するだけです。定義した変更は、選択したステートにのみ適用されます。1つのステートへの変更は他のステートに影響しないので、インタラクティブ要素を正確にコントロールすることができます。何よりも、グローバルクラスを持つステートを使用することで、サイト全體で一貫したインタラクション體験を適用することができます。

クラスマネージャーでクラスを管理?運(yùn)営する

クラス?マネージャーは、ウェブサイトのスタイルを一貫したものに保つためのコマンド?センターを提供します：

• 一元化された場(chǎng)所からクラスの削除や名前の変更が可能
• ドラッグ＆ドロップでクラスの優(yōu)先順位と階層を変更
• すべてのグローバルクラスの組織ビューを見る
• クラス?インジケータを使用してスタイルのカスケードを理解する

クラスとステートを扱うとき、色分けされたインジケータはスタイルのカスケードを理解するのに役立ちます。それぞれの色は異なる機(jī)能を持っています：

• ピンクのドット：地元の教室のスタイル
• 緑の點(diǎn)：グローバルクラスのスタイル
• オレンジの點(diǎn)：注意すべき相反するスタイル
• 灰色の點(diǎn)：他のクラスから継承されたスタイル

これらの視覚的な合図は、作業(yè)中に即座にフィードバックを提供し、スタイルがどこから來て、どのように相互作用するかを理解するのに役立つ。

ワークフローを簡(jiǎn)素化する統(tǒng)一されたスタイルタブ

エディターV4では、各ウィジェットが個(gè)別のスタイルパネルを持っていたV3とは異なり、すべての要素に統(tǒng)一されたスタイルタブが導(dǎo)入されています。

ユニフォーム?スタイル」タブの主な利點(diǎn)：

• コンテンツと機(jī)能の設(shè)定は「全般」タブのまま
• すべてのビジュアルスタイルオプションはスタイルタブにあります。
• 一度システムを?qū)Wべば、どこでも応用できる
• すべての要素で、強(qiáng)力なスタイリング機(jī)能への一貫したアクセス

ユニフォーム?スタイル?タブには、完全なコントロールを提供する包括的なセクションがあります：

• オープニングディスプレイの動(dòng)作と構(gòu)造を定義する
• スペーシング：マージンとパディングのリンクコントロールを設(shè)定します。
• サイズ：幅と高さを定義し、制約を設(shè)定する
• ポジショニング：ポジショニング方法を選択し、Z-インデックスをコントロールする。
• タイポグラフィ：重要なテキスト?スタイリング?オプションへのアクセス
• コンテキスト：無限の可能性を秘めたリッチなレイヤーデザインの作成
• ボーダー：一貫した、または異なるボーダースタイルを適用
• エフェクト：複數(shù)のシャドウレイヤーやその他のエフェクトを追加

DIVラッパー1つでサイトパフォーマンスを改善

エディターV4は、大幅にクリーン化された DOM この構(gòu)造はサイトのパフォーマンスに直接影響します。各要素は、以前のバージョンのように複數(shù)のDIVを入れ子にするのではなく、1つのDIVラッパーだけを使用するようになりました。 HTML 出力が削減され、ページサイズが小さくなり、ページをレンダリングする際のブラウザの複雑さが軽減される：

• よりクリーンなコードと高速レンダリング
• 改良型 SEO ランキング
• より良いビジター?エクスペリエンス

アルファ版はすでにパフォーマンスの向上を示しているが、エディターV4が成熟するにつれ、新たに最適化された要素をウェブサイトで使用する場(chǎng)合、これらの利點(diǎn)はさらに大きくなるだろう。

各デバイスの各スタイル屬性を制御する

エディターV4はレスポンシブデザインの面で完全に改善され、これまでにないコントロールを提供し、特定のコントロールオプションのみがレスポンシブ機(jī)能を持つというV3のウィジェットの制限に対処している。

エディターV4では、すべてのスタイル?プロパティは例外なくすべてのデバイスで調(diào)整できます。トップバーでデバイスを切り替えるだけで、特定のスクリーンサイズにのみ影響する調(diào)整を行うことができます。つまり、一行も書くことなく、モバイルとデスクトップでまったく異なるスタイルを設(shè)定できるのです！ カスケーディングスタイルシート.

スタイルリピーターでリッチなレイヤーデザインを作成する

エディターV4では、スタイルリピーターが導(dǎo)入され、背景やエフェクトの階層構(gòu)造を作成できるようになりました：

• 複數(shù)の背景畫像、グラデーション、色の追加
• 複雑なシャドウエフェクトを作成し、それらを重ねる。
• レイヤーをドラッグして優(yōu)先順位を調(diào)整
• コンテキスト操作によるレイヤーの複製、非表示、削除

強(qiáng)化されたグラデーションツールは高度なコントロールを提供し、必要な數(shù)のカラーストップを追加して、見事な視覚効果を生み出すために正確に配置できます。

スタイル?リピーターは現(xiàn)在、背景とボックス?シャドウに対応しており、將來的にはさらに多くのスタイル?オプションに対応する予定です。

エディターV4の新要素

エディターV4アルファは7つの新しい原子元素を?qū)耄?/p>

• DIVブロック
• フレックスボックス
• キャプション
• 通路
• イメージ
• ボタン
• エスブイジー

シンプルなマークアップ、一貫したスタイリング?パターン、パフォーマンスの向上など、各要素がV4の哲學(xué)を示しています。このモジュール式アプローチにより、サイト全體のデザイン更新がより速く、よりスケーラブルになります。

V3との完璧な互換性

Elementorはすでに1,800萬以上のウェブサイトを持っていることを考慮し、エディタV4を段階的に展開しています。

エディターV4はV3と完全に互換性があります：

• 同じページでV3エレメントとV4エレメントの両方を使用することができます。
• 使い慣れたV3ウィジェットを使い続けながら、V4の機(jī)能を徐々に探求していく！
• V3ウィジェットは完全に機(jī)能し、V4レイアウトに配置することができます。
• 既存のワークフローへの影響なし

V4入門

重要な注意事項(xiàng)このアルファバージョンは、テストおよび探索的な使用を目的としています。ステージングまたはテストサイトでのみ使用することをお?jiǎng)幛幛筏蓼埂?/p>

このアルファバージョンは始まりに過ぎません。今後數(shù)ヶ月の間に、より多くの機(jī)能が導(dǎo)入され、既存の機(jī)能が改善され、エディターV4が最もパワフルで直感的なウェブサイトビルダーとなるよう、私たちのフィードバックに基づいて改良される予定です。

今後のリリースでは、変數(shù)、カスタムプロパティ、CSS IDなどが追加される予定です！

概要

エディターV4の導(dǎo)入でエレメンタ 大幅な刷新が行われる。新機(jī)能はデザインの柔軟性と効率を向上させるだけでなく、より強(qiáng)力なレスポンシブデザインコントロールとより良いパフォーマンスをユーザーにもたらします。再利用可能なクラス、インタラクティブなスタイル、簡(jiǎn)素化されたDOM構(gòu)造など、Editor V4はすべてのウェブサイトビルダーに、より効率的なワークフローと洗練されたデザイン體験を提供します。

お問い合わせ
チュートリアルが読めない？無料でお答えします！個(gè)人サイト、中小企業(yè)サイトのための無料ヘルプ！	カスタマーサービス WeChat
① 電話：020-2206-9892
② QQ咨詢：1025174874
三 Eメール：info@361sale.com
④ 勤務(wù)時(shí)間: 月～金、9:30～18:30、祝日休み