使用「版面」模式來調整元件的大小

互動式通訊網頁頻道製作介面可讓您使用版面模式來調整元件大小。 在欄內拖放藍點，以定義要放置元件的起點和終點。 點選回應式格線內的元件後，會顯示藍點。 回應式格線由12個相等的欄組成。 替代欄中的白色和藍色陰影區分了一欄與另一欄。

您可以使用「版面」模式來調整所有裝置類型的元件大小，例如桌上型電腦、平板電腦、手機和其他較小的裝置。 平板電腦會自動從案頭版本衍生版面配置，而較小的裝置則從手機衍生版面配置。 不過，您可以覆寫自動衍生的組態，為每種裝置類型定義不同的組態。

存取配置模式

從顯示在​預覽​選項旁「互動式通訊」製作介面頂端的下拉式清單中，選取​版面。 表單會以「版面」模式顯示。

1. 登入AEM作者例項，並導覽至「Adobe Experience Manager > Forms > Forms & Documents」。

2. 建立新的或開啟現有的交互通信。

3. 從顯示在​預覽​選項頂端的下拉式清單中選擇​版面。 表單會以「版面」模式顯示。

   

調整元件大小

1. 在「版面」模式中，點選元件以調整大小。 藍點顯示在自適應網格的開始和結束處。

2. 拖放藍點以定義元件在回應式格線中的位置。

   

   點選元件後顯示的工具列包含下列選項：

   • 父代： 選擇元件的父代。
   • 浮點到新行： 如果同一行中有多個元件，請將元件移到下一行。

   您可以使用​還原斷點配置（）選項，還原所有調整大小的變更，並將預設配置套用至包含已重新調整大小的元件的面板。 點選已重新調整大小的元件的父項以檢視選項。

   注意

   您無法使用「版面」模式來調整表格欄、工具列、工具列按鈕和目標區域元件的大小。 使用「樣式」模式來調整這些元件的大小。

範例

目標： 要插入表元件和影像元件，並在交互通信中將它們平行放置。

1. 在互動式通訊的Web頻道中，使用編輯模式插入表格和影像元件。 影像元件在表元件後面顯示。

2. 切換至「版面」模式，然後點選「表格」元件。 藍點可調整元件在第1欄和第12欄的顯示大小。

3. 將第12欄的藍點拖放至回應式格線的第6欄。

   

4. 同樣地，選取「影像」元件，並將回應式格線的第1欄處的藍點拖放至第7欄。 表和影像元件彼此平行顯示。

   

   您可以選取「影像」元件，並點選工具列中的「浮點至新行」選項，將「影像」元件移至下一行。​

調整面板大小

如果您想要調整整個面板的大小，而非個別元件，請執行下列步驟：

1. 點選面板中要調整大小的任何元件，選擇「」，並在下拉式清單中選取第一個選項（如果面板是元件的直接父項）。

   藍點顯示在自適應網格的開始和結束處。

2. 拖放藍點，以定義面板在回應式格線中的位置。
   您可以重複步驟1和2，然後選擇「選擇父級

定義面板的多欄版面

執行以下步驟以定義面板的列數：

1. 在​編輯​模式中，點選面板，選擇，然後從​面板配置​下拉式清單中選擇​回應——頁面上的所有項目，而不使用導覽​選項。

2. 點選以儲存屬性。

3. 在​Layout​模式中，點選面板中的任何元件，選擇，然後選擇面板。

4. 點選並從下拉式清單中選取欄數。 欄數範圍從1到12。 面板會分為多欄版面。

停用舊版回應式版面表單的版面配置模式

您可以編輯表單中所用範本的屬性，以停用具有舊版互動式版面的表單的「版面」模式。

執行下列步驟以停用「版面」模式：

1. 選擇「工具 > 一般 > 範本」，並開啟​編輯​模式中使用的範本。

2. 在左窗格中選擇「Document Container（文檔容器）」，然後點選「Policy（策略）」。

   

3. 點選「版面設定」標籤，並選取「停用版面模式​]」。[

4. 點選以儲存範本屬性。