教學課程:建立模板

07-apply-rules-to-adaptive-form_small

本教學課程是建立第一個互動式通訊系列中的步驟。 建議您依序依序依序執行系列,以了解、執行和示範完整的教學課程使用案例。

若要建立互動式通訊,您必須在AEM伺服器上提供用於列印和網頁頻道的範本。

列印管道的範本是在AdobeForms Designer中建立,並上傳至AEM伺服器。 然後,這些模板便可在建立互動式通信時使用。

網頁管道的範本是在AEM中建立。 範本作者和管理員可以建立、編輯和啟用網頁範本。 建立並啟用後,這些範本便可在建立互動式通訊時使用。

本教學課程會逐步引導您完成建立列印和網頁頻道範本的步驟,以便在建立互動式通訊時使用。 在本教學課程結束時,您將能夠:

  • 使用AdobeForms Designer為列印管道建立XDP範本
  • 將XDP範本上傳至AEM Forms伺服器
  • 建立和啟用Web通道的模板

建立打印通道的模板

使用以下任務建立和管理互動式通信的打印通道模板:

使用Forms Designer建立XDP範本

根據使用案例anatogy,在XDP範本中建立下列子表單:

  • 帳單詳細資訊:包含檔案片段
  • 客戶詳細資訊:包含檔案片段
  • 清單匯總:包含檔案片段
  • 摘要:包括文檔片段(費用子表單)和圖表(圖表子表單)
  • 逐項呼叫:包括表(佈局片段)
  • 立即支付:包含影像
  • 增值服務:包含影像

create_print_template

上傳XDP檔案至Forms伺服器後,這些子表單會在列印範本中顯示為目標區域。 建立互動式通訊時,所有實體(如檔案片段、圖表、版面片段和影像)都會新增至目標區域。

執行下列步驟為列印通道建立XDP範本:

  1. 開啟Forms Designer,選擇「檔案 > 新建 > 使用空白表單」,點選「​下一步」,然後點選「完成」以開啟用於建立範本的表單。

    確保從​Window​菜單中選擇了​Object Library​和​Object​選項。

  2. 將​Subform​元件從​Object Library​拖放至表單。

  3. 在右窗格的​Object​窗口中,選擇子表單以顯示子表單的選項。

  4. 選擇​Subform​頁簽,然後從​Content​下拉清單中選擇​Fluged。 拖動子表單的左端點以調整長度。

  5. 在​綁定​頁簽中:

    1. 在​名稱​欄位中指定​BillDetails

    2. 從​資料綁定​下拉清單中選擇​無資料綁定

    設計器子表單

  6. 同樣地,選擇根子表單,選擇​子表單​頁簽,然後從​內容​下拉清單中選擇​。 在​綁定​頁簽中:

    1. 在​Name​欄位中指定​TelecaBill

    2. 從​資料綁定​下拉清單中選擇​無資料綁定

    打印模板的子表單

  7. 重複步驟2 - 5以建立下列子表單:

    • BillDetails

    • 客戶詳細資訊

    • BillSummary

    • 摘要 — 選擇​子表單​頁簽,然後從​內容​下拉清單中選擇​定位。 在​Summary​子表單中插入以下子表單。

      • 費用
      • 圖表
    • ItemisedCalls

    • PayNow

    • ValueAddedServices

    為了節省時間,您也可以複製並貼上現有的子表單以建立新的子表單。

    要將​Charts​子表單移到Charges子表單的右側,請從左窗格中選擇​Charts​子表單,選擇​Layout​頁簽,並指定​AnchorX​欄位的值。 值必須大於​Charges​子表單的​Width​欄位的值。 選擇​Charges​子表單並選擇​Layout​頁簽以查看​Width​欄位的值。

  8. 將​Text​對象從​Object Library​拖放到表單中,並在框中輸入​Dial XXXX以訂閱​文本。

  9. 按一下右鍵左窗格中的文本對象,選擇​更名對象,然後輸入文本對象的名稱,作為​訂閱

    XDP範本

  10. 選擇​File > Save As​以在本地檔案系統上保存檔案:

    1. 導覽至要儲存檔案的位置,並指定名稱為​create_first_ic_print_template

    2. 從​另存為類型​下拉清單中選擇​.xdp

    3. 點選​儲存

將XDP範本上傳至AEM Forms伺服器

使用Forms Designer建立XDP範本後,必須將其上傳至AEM Forms伺服器,以便在建立互動式通訊時讓範本可供使用。

  1. 選取​Forms > Forms與檔案

  2. 點選「建立 > 檔案上傳」。

    導覽並選取​create_first_ic_print_template​範本(XDP),然後點選​開啟​以將XDP範本匯入AEM Forms伺服器。

為版面片段建立XDP範本

若要為互動式通訊的列印通道建立版面片段,請使用Forms Designer建立XDP,並將其上傳至AEM Forms伺服器。

  1. 開啟Forms Designer,選擇「檔案 > 新建 > 使用空白表單」,點選「​下一步」,然後點選「完成」以開啟用於建立範本的表單。

    確保從​Window​菜單中選擇了​Object Library​和​Object​選項。

  2. 將​​元件從​對象庫​拖放到表單中。

  3. 在「插入表」(Insert Table)對話框中:

    1. 指定列數​5
    2. 將內文行數指定為​1
    3. 選中「在表​中包括標題行」複選框。
    4. 頁簽​OK
  4. 點選​+ ,在​ 1旁的左窗格中,按一下右鍵​Cell1​並選擇​將對象​更名為​Date

    同樣,將​單元2單元3單元4​和​單元5​分別更名為​時間數字持續時間​和​費用

  5. 按一下​設計器視圖​中的「標題」文本欄位,然後將其更名為​TimeNumberDuration​和​Charges

    版面片段

  6. 從左窗格中選擇​行1,然後選擇​對象 > 綁定 > 每個資料項的重複行

    為佈局片段重複屬性

  7. 將​文本欄位​元件從​對象庫​拖放到​設計器視圖​中。

    版面片段的文字欄位

    同樣,將​文本欄位​元件拖放到​時間數字持續時間​和​費用​行。

  8. 選擇​File > Save As​以在本地檔案系統上保存檔案:

    1. 導覽至要儲存檔案的位置,並指定名稱為​table_lf

    2. 從​另存為類型​下拉清單中選擇​.xdp

    3. 點選​儲存

    使用Forms設計工具為版面片段建立XDP範本後,您必須上傳至AEM Forms伺服器,讓範本可在建立版面片段時使用。

建立Web通道的模板

使用以下任務建立和管理互動式通信的Web通道模板:

為模板建立資料夾

若要建立Web管道範本,請定義資料夾,以儲存已建立的範本。 在該資料夾內建立模板後,請啟用該模板以允許表單用戶根據模板建立互動式通信的Web通道。

執行下列步驟為可編輯的範本建立資料夾:

  1. 點選​工具 槌子圖示 > 配置瀏覽器

  2. 在「設定瀏覽器」頁面中,點選​Create

  3. 在​建立配置​對話框中,指定​Create_First_IC_templates​作為資料夾的標題,檢查​可編輯的模板,然後點選​建立

    配置Web模板

    建立​Create_First_IC_templates​資料夾並在​配置瀏覽器​頁面上列出。

建立範本

根據使用案例解剖學,在Web範本中建立下列面板:

  • 帳單詳細資訊:包含檔案片段
  • 客戶詳細資訊:包含檔案片段
  • 清單匯總:包含檔案片段
  • 費用匯總:包含檔案片段和圖表(雙欄配置)
  • 逐項呼叫:包括表
  • 立即支付:包含​立即支付​按鈕和影像
  • 增值服務:包含影像和​Subscribe​按鈕。

create_web_template

建立互動式通信時,將添加所有實體,如文檔片段、圖表、表、影像和按鈕。

執行以下步驟為​Create_First_IC_templates​資料夾中的Web通道建立模板:

  1. 通過選擇​工具 > 模板 > Create_First_IC_templates​資料夾,導航到相應的模板資料夾。

  2. 點選​建立

  3. 在​選擇模板類型​配置嚮導中,選擇​互動式通信 — Web通道​並點選​下一步

  4. 在​模板詳細資訊​配置嚮導中,將​Create_First_IC_Web_Template​指定為模板標題。 指定可選的說明,然後點選​Create

    顯示​Create_First_IC_Web_Template​的確認消息。

  5. 點選​開啟​以在範本編輯器中開啟範本。

  6. 從​預覽​選項旁的下拉式清單中選取​初始內容

    範本編輯器

  7. 點選「根面板」,然後點選「+」以檢視可新增至範本的元件清單。

  8. 從清單中選擇​面板​以在​根面板​上添加面板。

  9. 在左窗格中選擇​Content​頁簽。 步驟8中新增的新面板會顯示在內容樹狀結構的​根面板​下。

    內容樹

  10. 選取面板,然後點選configure_icon(Configure)。

  11. 在「屬性」窗格中:

    1. 在「名稱」欄位中指定​billdetails

    2. 在「標題」欄位中指定​清單詳細資訊

    3. 從​列數​下拉清單中選擇​1

    4. 點選以儲存屬性。

    面板的名稱會更新為內容樹中的​清單詳細資訊

  12. 重複步驟7 - 11將具有下列屬性的面板新增至範本:

    名稱 標題 欄數
    customerdetails 客戶詳細資訊 1
    帳單摘要 清單匯總 3
    摘要費用 費用匯總 2
    itemiedcalls 逐項呼叫 3
    paynow 立即支付 2
    vas 增值服務 3

    將所有面板新增至範本後,下列影像會描繪內容樹狀結構:

    所有面板的內容樹

啟用模板

建立Web模板後,必須啟用該模板以在建立交互通信時使用該模板。

執行下列步驟以啟用Web模板:

  1. 點選​工具 槌子圖示 > 範本

  2. 導覽至​Create_First_IC_Web_Template​範本,選取該範本,然後點選​啟用

  3. 頁簽​再次啟用​以進行確認。

    範本已啟用,其狀態會顯示為已啟用。 在為Web通道建立互動式通信時,可以使用此模板。

啟用互動式通信中的按鈕

根據使用案例,您必須在互動式通訊中包含​立即支付​和​訂閱​按鈕(最適化表單元件)。 要在互動式通信中啟用這些按鈕,請執行以下步驟:

  1. 從​預覽​選項旁的下拉清單中選擇​結構

  2. 使用內容樹選擇​Document Container​根面板,然後點選​Policy​以選擇允許在交互通信中使用的元件。

    配置策略

  3. 在​屬性​區段的​允許的元件​標籤中,從​適用性表單​元件中選擇​按鈕

    允許的元件

  4. 點選done_icon以儲存屬性。

本頁內容