最適化表單範本

製作表單時，您會新增欄位和元件，以在編輯器中定義表單結構、內容和動作。 您可以在表單容器的guideRootPanel中新增欄位和元件。 使用範本編輯器，您可以建立範本，其中包含作者可用來建立表單的基本結構和初始內容。

例如，您希望所有表單作者在註冊表單中都有特定的文本框、導航按鈕和提交按鈕。 您可以使用作者可用來建立與其他註冊表單一致的表單的元件來建立模板。 當作者使用範本建立最適化表單時，新表單會繼承您在範本中指定的結構和元件。 範本編輯器可讓您：

• 在結構層中添加表單的頁眉和頁腳元件。
• 提供表單的初始內容。
• 指定主題、提交動作。

使用範本

您可以導覽至​Adobe Experience Manager >工具>範本，從「工具」功能表存取範本編輯器。 在此，範本會組織在可編輯範本啟用的資料夾中。 AEM提供可組織範本的全域資料夾。 但預設不會啟用。 您可以要求管理員啟用全域資料夾或為範本建立新資料夾。 有關如何建立資料夾的詳細資訊，請參閱模板資料夾。

點選以開啟資料夾後，您會找到「建立」按鈕，供您建立最適化表單的新範本。

建立範本

建立資料夾後，開啟資料夾並執行下列步驟以建立範本：

1. 在範本主控台中，在您建立的資料夾中點選​建立。

2. 在「選擇模板類型」部分，選擇​適用性表單模板​並點選​下一步。

3. 在「範本詳細資料」區段中，提供範本標題，然後點選​Create。

   您可以提供說明和縮圖，以便在表單編寫時選取建立的範本時查看。

4. 點選​Done​以返回主控台，或點選​Open​以在編輯器中開啟範本。

模板編輯器UI

開啟範本進行編輯時，您會看到下列AEM Editor元件：

• 頁面工
  具列包含下列選項：

  • 切換側面板:讓您顯示或隱藏側欄。

  • 頁面資訊:可讓您指定資訊，例如發佈/取消發佈時間、縮圖、用戶端程式庫、頁面原則，以及頁面設計用戶端程式庫。

  • 模擬器:可讓您模擬和自訂不同裝置的外觀。

  • 圖層選取器： 可讓您變更圖層。

    可以選擇「結構」層或「初始內容」層。 結構層可讓您新增及自訂頁首與頁尾。 初始內容層可讓您自訂表單內容。

  • 預覽： 可讓您預覽範本發佈時的外觀。您可以使用「圖層選擇器」和「預覽」切換編輯和預覽模式。

• 側欄： 提供內容、屬性、資產和元件瀏覽器。

• 元件工具列： 選取元件時，您會看到可自訂元件的工具列。

• 頁面:新增內容以建立範本的區域。

請參閱製作最適化表單簡介以了解觸控式UI編輯器。

編輯模板

使用兩個層建立最適化表單範本：

• 結構
• 初始內容

圖層選擇器位於螢幕右上角的「預覽」選項旁。

結構

在「範本編輯器」中選取結構層時，您可以在「最適化表單容器」的上下看到版面容器。 作者可將這些版面容器用於頁首和頁尾。 您可以新增、編輯或自訂頁首與頁尾。 將「適用性表單標題」元件拖放至「適用性表單容器」上方的版面容器，以自訂範本標題。 將「適用性表單頁尾」元件拖放至「適用性表單容器」下方的版面容器，以自訂範本頁尾。

圖： 在結構層中佈局容器

A.頁 首元件的版面容器B.頁 尾元 件的版面容器

將「最適化表單標題」元件拖放至「最適化表單容器」上方的版面容器中。 新增元件後，您可以指定其屬性，讓您新增標誌並提供標題。

同樣地，當您拖放頁尾元件至「適用性表單容器」下方的版面容器時，可以提供版權資訊和公司詳細資訊。

圖： 在「結構」層中添加頁首和頁尾

在結構層中鎖定/解鎖元件

當您編輯已選取結構層的範本時，可以解除鎖定範本的頁首和頁尾。 如果範本中的元件已解除鎖定，表單作者就可以在使用範本的最適化表單中編輯元件。 鎖定元件會防止表單作者以最適化表單編輯元件。 元件工具欄中提供「鎖定」選項。

例如，您可在範本中新增標題元件。 選取元件時，可在元件工具列中看到鎖定選項。 標題通常包含公司名稱和標誌，您不希望表單作者變更範本中的標誌和標題。 在使用範本建立的已鎖定標題元件的適用性表單中，表單作者無法變更標誌和公司名稱。

初始內容

選取「初始內容」選項時，範本的「最適化表單容器」會像最適化表單一樣開啟以供編輯。 與編寫最適化表單一樣，您也可以指定初始設定，例如選取主題和提交動作。

表單作者可以用它來建立表單。 內容流結構是在範本的「初始內容」層中指定。 若要切換到編輯表單範本的初始內容，請在「頁面」工具列的「預覽」之前，點選「> Initial Content」。

範本編輯器中的「初始內容層」顯示已選取以指定屬性的適用性表單容器。

在「初始內容」層，您可以建立作者以為基礎的最適化表單範本。 製作範本與製作表單類似，您可以使用側欄中的可用選項。 側欄提供內容、屬性、資產和元件瀏覽器。

請參閱側欄。

建立具有標籤和面板的最適化表單範本 

例如，您想要建立包含下列標籤的範本：

• 一般資訊
• 專業資訊

您已在結構層中新增標誌、提供標題，並新增頁尾。 鎖定頁首和頁尾，讓表單作者在使用範本建立表單時，無法加以編輯。

將圖層從「結構」變更為「初始內容」，然後開始將內容新增至表單。 要建立頁簽結構，請在「適用性表單」容器的guideRootPanel中添加子面板。 若要新增面板：

• 選取「將元件拖曳到此處」選項時，點選「+」按鈕即可新增面板。

• 您可以從側欄的元件瀏覽器拖放面板元件。

• 您可以從元件工具欄添加guideRootPanel的子面板。

要建立「一般資訊」和「專業資訊」頁簽，請在guideRootPanel的子面板中添加兩個面板。 選取面板，然後點選以開啟側欄中的屬性。 將元素名稱分別更改為general-info和professional-info，將標題更改為「一般資訊」和「專業資訊」。 在側欄中，點選內容以開啟內容瀏覽器。 在「表單對象」頁簽中，選擇guideRootPanel。 在編輯器中，選取guideRootPanel。 點選元件工具列中的以開啟其屬性。 在「面板佈局」欄位中，選擇Top 上的「​頁簽」，然後點選​Done。 頁簽模板結構被應用。

在標籤中新增內容

新增範本中的欄位

新增面板並將它們建構為標籤後，您就可以在標籤內新增欄位。 在編輯器中選取索引標籤時，您會看到「將元件拖曳到此處​」選項。​您可以拖放元件，例如文字方塊、清單項目和按鈕。 您可以從側欄的元件瀏覽器拖放元件。

每個元件都具有增強資料擷取和操作的屬性。 例如，您可以啟用元件的​必要欄位​屬性。 作者可以指定客戶略過填寫必要欄位時看到的訊息。 在​必要欄位消息​屬性中指定消息。

在示例模板中，「一般資訊」頁簽中添加了「名稱」、「電話號碼」和「出生日期」欄位。 在「專業資訊」頁簽中，添加了「當前聘用」、「雇傭類型」、「教育資格」欄位。

新增欄位後，您可以新增「提交」和「重設」等按鈕。

啟用模板

建立範本時，會將其新增為草稿。 啟用範本，以使用它建立最適化表單。 啟用模板：

1. 導覽至​Adobe Experience Manager >工具>範本，然後開啟您建立範本的資料夾。

2. 已建立的模板標籤為「草稿」。

3. 選取範本，然後點選工具列中的​啟用。

   建立最適化表單時，系統會要求您選擇範本時，您會看到列出的範本。

匯入或匯出範本

表單可與其範本搭配使用。 下載使用自訂範本建立的最適化表單時，不會下載範本。 當您在不同的AEM Forms執行個體匯入表單時，系統會匯入表單而不含其範本。 如果已匯入表單但其範本無法使用，則不會轉譯表單。 您可以從https://<server>:<port>/crx/packmgr中的/conf節點封裝自訂範本，並將其連接至您要上傳表單的AEM Forms執行個體。

使用範本建立最適化表單

建立並啟用範本後，當您建立最適化表單時，可在Forms Manager中使用範本。 若要使用範本並建立最適化表單，請參閱建立最適化表單。

變更現成範本的顯示選項

您可以為最適化表單建立自訂範本，以定義基本結構和初始內容。 AEM Forms也提供一套適用性表單的現成可用範本。 您可以選擇顯示或隱藏範本。

執行下列步驟來顯示和隱藏範本：

1. 登入AEM Forms製作例項，並導覽至​工具>作業> Web Console。

   注意

   AEM Web控制台的URL為https://[server]:[port]/system/console/configMgr

2. 找到並開啟​FormsManager配置​設定：

   • 若要顯示或隱藏現成可用的表單範本，請核取或取消勾選「包含現成可用的AF和AD範本」選項。
   • 若要顯示或隱藏已新增至AEM 6.0 Forms或AEM 6.1 Forms版本中但現已過時的現成可用適用性表單範本，請核取或取消勾選「包含AEM 6.0 AF範本」選項。 如果已核取此選項，則需要啟用​包含現成可用的AF和AD範本​設定，才能生效。

3. 按一下「儲存」。已變更現成範本的顯示選項。

建議

• 在模板編輯器中修改表單的屬性時，請勿使用BindReference屬性。

• 如果要添加斷點，請在編寫最適化表單模板時建立斷點。

  有關斷點的詳細資訊，請參閱響應式佈局。