要素の挿入セクション

要素の挿入セクションでは、プロジェクトに含めることができるさまざまなコンポーネントをすばやく視覚的に入力できます。

このセクションは、基本的なグループに分類されています。たとえば、フォント スタイル領域には、テキストに関するすべての要素が含まれます。フォームの別のセクションには、フォームの作成に使用できるすべての構造が含まれます。以下に、すべてのカテゴリとそれに対応する要素の種類を示します。

• レイアウト
• 基本的
• タイポグラフィ
• コンテンツ管理システム
• メディア
• フォーム
• コンポーネント

進行中のページに要素の挿入セクションの要素を含めるには、次の 3 つの方法があります。

• タップしてその場で挿入
• ワークスペースにドラッグ
• アウトラインにドラッグ

知っておいてよかった

さらに、ワークスペースに要素を追加することもできます。 高速検出 (CMD+E/CTRL+E)Rapid Discover の使用方法を理解します。

タップしてその場で挿入

タップによる挿入は、ワークスペースに要素を挿入するための迅速な方法です。

1. ページ上の既存の要素を選択します。
2. 要素の挿入セクションを表示します。
3. 挿入したい要素をクリックします。
4. 新しい要素がページに挿入されます。

組み込まれた要素が最初に表示される場所は、選択された要素に関連付けられます。したがって、選択された要素がテキスト、メディア、またはボタン要素である場合、挿入された要素は選択された要素の横または下に表示されます。

最初に div ブロックやコンテナーなどの親要素を選択した場合は、新しい要素がこの構造要素のベース内に挿入されます。

要素が選択されていない場合、要素を追加するためにタップすると、その要素はページの下部の Body 要素内に挿入されます。

要素を好きな場所にドラッグすることで、いつでも要素の位置を変更できます。

ワークスペースにドラッグ

要素の挿入セクションから要素を挿入する 2 番目の方法は、要素をワークスペースにドラッグして配置することです。

要素をドラッグしている間、オレンジ色のインジケーターは、どの親要素に配置するかを通知します。青色のインジケーターは、親要素内の要素の位置を示します。

右側のアウトライン タブを開いている場合は、ワークスペース上で要素をドラッグして移動するときに、要素を配置する場所を正確に確認することもできます。

アウトラインにドラッグ

ページに要素を挿入する 3 番目の方法は、アウトラインを使用することです。

アウトラインでは、ページの完全なビジュアル プランを確認できます。したがって、要素を [要素の挿入] セクションからアウトラインに正確にドラッグ アンド ドロップできます。

要素のデフォルトの配置

要素をワークスペースに挿入すると、その要素はピア要素との相対位置に配置されます。この標準的な配置は、追加された要素とそのピア要素の両方のデフォルトの表示設定によって決まります。

したがって、デフォルトの可視性設定がブロックである要素を追加する場合、その要素は常に、隣接する要素の上または下の単独の行に表示されます。

インライン ブロックの表示設定を持つ要素を追加すると、それらの要素はブロック要素の下または上、あるいは他のインライン ブロック要素の横に配置されます。[要素の挿入] セクションの要素はすべてブロック要素ですが、インライン ブロックである次の要素は除きます。

• リンクブロック
• ボタン
• 画像
• ライトボックスリンク
• 落ちる
• フォームボタン

表示設定がインラインである唯一の要素は、テキスト リンク要素です。インライン要素の配置は、インライン ブロック要素と同様に動作します。

表示設定の詳細をご覧ください。

スタイル パネルからほとんどの要素の表示設定を変更できます。