エレメントをドラッグで配置する.
エレメント、ロー、セクションはドラッグで好きな場所に置けます。カラム内で上下に動かすことも、別のカラムやセクションに移すこともできます。新しいエレメントはカラムの一番上に追加されるため、並べ替えにはドラッグが手早くなります。例ではBook a free consultationボタンを、関係するテキストの下にドラッグしています。
エレメントのドラッグ
- エレメントにカーソルを合わせてコントロールバーを表示します。
- ドラッグハンドル(コントロールバー左にあるエレメント名付きの点状グリップ)を押したままにします。
- エレメントを新しい場所までドラッグします。縞模様のプレースホルダーが配置先を示します。
- マウスボタンを離してドロップします。
- ツールバーのSaveをクリックして、ページを保存します。
例では、各エレメントにStyleパネルで48ピクセルの上マージンも付けています。

ドロップできる場所
エレメントは、同じカラム内の2つのエレメントの間、別のカラム、別のセクションのいずれにも置けます。タブやCollapseパネルのようなコンテナエレメントの中にも入れられます。同じページ内のDXPR Builder領域なら、どこでも受け付けます。
セクション、ロー、カラムの移動
セクションとローは、コントロールバーに同じハンドルがあります。セクションはページ内で上下にドラッグし、ローは別のセクションにドラッグします。カラムはロー内に留まります。カラムのハンドルを左右にドラッグして、隣と入れ替えます。
ドラッグなしでの移動
コントロールバーのエレメント名をクリックして選択します。Ctrl+UpキーまたはCtrl+Downキー(MacではCmdキー)を押して1つ分移動します。カラムの場合はCtrl+LeftキーまたはCtrl+Rightキーを押します。Moreメニューにも、Move UpとMove Downとして同じ移動があります。
表示内容
ドラッグ中はエレメントのコピーがポインターに付いてきて、縞模様のプレースホルダーがドロップ位置を示します。ドロップ後はエレメントが新しい場所に収まり、カラムの残りが周りで詰まります。Saveボタンのドットは、変更がまだ保存されていないことを示します。
エレメントが動かない場合
- ドラッグしても何も動かない。 エレメント自体を押しており、ハンドルではありません。エレメント名の付いた点状グリップを押したままにします。
- 置きたい場所が画面外にある。 ページは、ポインターがウィンドウの端に近い間だけスクロールします。ポインターを上端や下端の近くに寄せて待ちます。
- カラムがローから出られない。 カラムはロー内での入れ替えのみです。代わりに、カラム内のエレメントを他のローにドラッグします。
- Positioned layers内のエレメントにプレースホルダーが出ない。 それらのエレメントはキャンバス上に自由配置です。Positioned layersをご覧ください。
- エレメントが違う場所に落ちた。 Ctrl+Zキー(MacではCmd+Zキー)を押してドロップを取り消します。
次のステップ
- エレメントのコピーと貼り付け:動かす代わりにエレメントを繰り返します。
- 編集したい箇所の選択:カラム、ロー、セクションのハンドルにたどり着きます。
- ローとカラム:ローのカラムレイアウトを変えます。