レイアウト要素の使用
Liferay 7.4 U22+/GA22+ の場合
レイアウト要素は、ページまたはテンプレートのレイアウトを設計するためのドロップ ゾーンを定義します。 デフォルトでは、Liferay には 2 つのレイアウト要素が含まれています: コンテナー と グリッド。 追加したら、追加のコンテナーやグリッドを含むウィジェットやその他のフラグメントをこれらのドロップ ゾーンにドラッグ アンド ドロップして、さらに複雑なレイアウトを作成できます。 レイアウトを設計した後、レイアウト構成を保存して、他のページやテンプレートで再利用できます。 詳細については、「 フラグメント構成の保存 」を参照してください。
フラグメントをサポートする新しいページまたはテンプレートを作成すると、デフォルトのドロップ ゾーンが表示されます。 この領域には任意のフラグメントを追加できますが、コンテナ フラグメントをコンポジションの最初の要素として使用すると、重要な利点があります。
- 高度な構成 のフレックス表示プロパティを含む、ページデザインのレイアウト制御が向上しました (Liferay DXP 7.4+)
- 他のページやテンプレートで 構成をすばやく保存して再利用します
- フラグメント構成に URL またはページリダイレクトを追加する
- スタイルブック を活用してサイトの外観を標準化します
コンテナを追加したら、グリッド フラグメントを使用して、さまざまなビューポートのコンテンツ レイアウトをカスタマイズできます。 詳細については、 グリッド フラグメントを使用したレスポンシブ レイアウトの構築 を参照してください。
要素をコンテナまたはグリッドにドラッグ アンド ドロップすると、Liferay はドロップ ゾーンを強調表示して、配置場所を示します。 追加したら、ブラウザのサイドパネル ( 
) で要素をドラッグ アンド ドロップして並べ替えることができます。
最後に、ページ上にさまざまなネストされた要素がある場合、ネストされた階層内の要素の移動を支援するパンくずリストが表示されます。
要素を選択し、ショートカット Shift + Enter を使用してその親を選択することもできます。
コンテナ
以前は パネルと呼ばれていました
コンテナ フラグメントは、コンテンツ ページに構成可能なドロップ ゾーンを追加します。 標準的な構成オプションに加えて、コンテナの HTML タグ、表示構造などを構成することができます。 詳細については、 フラグメントの構成 を参照してください。
グリッド
以前は 行と呼ばれていました
グリッド フラグメントは、ページまたはテンプレートに複数のドロップ ゾーン モジュールを追加します。 これらのモジュールは、水平および垂直に配置できます。 標準の構成オプションに加えて、各グリッドのモジュール数、行あたりのモジュール数、および各モジュールのコンテンツの垂直方向の配置を決定できます。 各モジュールの幅を手動で調整し、モジュール間のパディングを追加または削除できます。 詳細については、 フラグメントの構成 を参照してください。
