複数列のセクション・レイアウトを使用して、レイアウトに追加するコンポーネントの間隔や配置が自動的に決定されるようにすることができます。
ページにレイアウトを追加するには:
レイアウトが、実線の枠線および「アイテムの追加」と表示されるバナーで強調表示されます。
図GUID-01FF01BB-7DB2-47CE-BEC2-EF46C1A8056F-default.pngの説明
レイアウトにさらにアイテムを追加でき、レイアウトによってそれらが適宜フォーマットされます。他のセクション・レイアウトを追加して、高度なレイアウトを作成したり、コンポーネント・グループを追加することもできます。
イメージ・コンポーネントがプレースホルダになった2列レイアウトを次に示します。
アイテムを追加すると、そのアイテムは追加の行に表示されます。それぞれに最大2つのアイテムが入ります。
最初の列の幅(%): 列の幅を、レイアウトに使用可能な領域のパーセントで指定します。
2番目の列の幅(%): 列の幅を、レイアウトに使用可能な領域のパーセントで指定します。
3番目の列の幅(%): 列の幅を、レイアウトに使用可能な領域のパーセントで指定します。
レスポンシブ・ブレークポイント(ピクセル): 使用可能な表示サイズが変わるとコンテンツが自動的に再フォーマットされるレスポンシブ・ページ設計の場合、セクション・レイアウトが標準の2列レイアウトと次で指定する「レスポンシブ動作」オプションの間で切り替わる幅(ピクセル)を指定します。
レスポンシブ動作: 使用可能な表示サイズがレスポンシブ・ブレークポイントの値より小さいときにレイアウトをどのように変更するかを選択します。
アクションなし: レイアウトの動作を調整しません。
列の積上げ: 1列目のすべてのアイテム、2列目のすべてのアイテム、それ以降の列のアイテムの順に、アイテムを上から下に1つの列内に配置します。
最初の列を非表示: 他の列の領域が大きくなるように、最初の列のコンテンツを非表示にします。
2番目の列を非表示: 他の列の領域が大きくなるように、2番目の列のコンテンツを非表示にします。
3番目の列を非表示: 他の列の領域が大きくなるように、3番目の列のコンテンツを非表示にします。
両方の列を非表示: レイアウト内のすべてのコンテンツを非表示にします。
2番目の列を最初の列の下に移動: 1列目のすべてのアイテム、2列目のすべてのアイテムの順に、アイテムを1つの列内に配置します。
最初の列を2番目の列の下に移動: 2列目のすべてのアイテム、1列目のすべてのアイテムの順に、アイテムを1つの列内に配置します。