將Forms入口網站新增至AEM Sites頁面 publish-forms-on-portal

Adobe 建議使用新式且可擴充的資料擷取核心元件,用來建立新的最適化表單將最適化表單新增到 AEM Sites 頁面。這些元件代表最適化表單建立方面的重大進步,可確保令人印象深刻的使用者體驗。本文會介紹使用基礎元件編寫最適化表單的舊方法。

版本
文章連結
AEM 6.5
按一下這裡
AEM as a Cloud Service
本文章

在以表單為中心的典型入口網站部署情境中,表單開發和入口網站開發是兩個分離的活動。 當表單設計人員將表單設計和儲存在存放庫時,網頁開發人員會建立網站應用程式以列出表單並處理表單提交。 Forms會複製到Web層,因為Forms存放庫和Web應用程式之間沒有通訊。

這類案例通常會導致管理問題和生產延遲。 例如,如果存放庫中有較新的表單版本,您需要取代Web層上的表單、修改Web應用程式,並重新部署公用網站上的表單。 重新部署Web應用程式可能會造成伺服器停機時間。 通常伺服器停機時間是計畫的活動,因此變更無法即時推送至公用網站。

AEM Forms提供入口網站元件,可減少管理間接成本及生產延遲。 這些元件讓網頁開發人員能夠在使用Forms (AEM)編寫的網站上建立和自訂Adobe Experience Manager入口網站。

Form Portal元件可讓您新增下列功能:

  • 以自訂版面配置列出表單。 隨附立即可用的清單檢視和卡片檢視版面配置。 您可以建立自己的自訂版面配置。
  • 可讓您在列出自訂中繼資料和自訂動作時顯示它們。
  • 列出由AEM Forms UI在使用Forms Portal元件的發佈執行個體上發佈的表單。
  • 允許一般使用者以HTML和PDF格式轉譯表單。
  • 啟用根據標題和說明的表單搜尋功能。
  • 使用自訂CSS來自訂入口網站的外觀。
  • 建立表單連結。
  • 列出與使用者建立的最適化Forms相關的草稿和提交內容。

Forms Portal頁面的元件 forms-portal-components

AEM Forms提供下列立即可用的入口網站元件:

  • 搜尋與清單製作程式:此元件可讓您從表單存放庫將表單列出至入口網站頁面,並提供設定選項,以根據指定條件列出表單。

  • 草稿和提交:當搜尋和清單元件顯示由Forms作者公開的表單時,草稿和提交元件顯示儲存為草稿以供稍後完成和提交表單的表單。 此元件可為任何登入使用者提供個人化體驗。

  • 連結:此元件可讓您建立頁面上任何位置的表單連結。

您可以從AEM專案原型匯入現成的Forms Portal元件。 匯入後,執行下列設定:

匯入Forms Portal元件 import-forms-portal-components-aem-archetype

若要在AEM Forms as a Cloud Service上匯入現成可用的Forms Portal元件,請執行以下步驟:

  1. 在本機開發執行個體上複製Cloud Manager Git存放庫: ​您的Cloud Manager Git存放庫包含預設的AEM專案。 它以AEM Archetype為基礎。 從Cloud Manager UI使用自助Git帳戶管理功能來複製您的Cloud Manager Git存放庫,以將專案引進您的本機開發環境中。 如需存取存放庫的詳細資訊,請參閱存取存放庫

  2. 將Experience Manager Forms建立為[Cloud Service]專案: ​根據AEM Archetype 27或更新版本,將Experience Manager Forms建立為[Cloud Service]專案。 原型可協助開發人員輕鬆開始開發AEM Formsas a Cloud Service。 其中也包括一些範例主題和範本,可幫助您快速入門。

    若要建立Experience Manager Formsas a Cloud Service專案,請開啟命令提示字元並執行以下命令。 若要包含Forms特定組態、主題和範本,請設定includeForms=y

    code language-shell
    mvn -B archetype:generate -DarchetypeGroupId=com.adobe.aem -DarchetypeArtifactId=aem-project-archetype -DarchetypeVersion=30 -DaemVersion="cloud" -DappTitle="My Site" -DappId="mysite" -DgroupId="com.mysite" -DincludeForms="y"
    

    此外,請變更上述命令中的appTitleappIdgroupId,以反映您的環境。

    專案準備就緒後,請更新Archetype專案最上層pom.xml中的<core.forms.components.version>x.y.z</core.forms.components.version>屬性,以反映您AEM Archetype專案中最新版本的core-forms-components

  3. 將專案部署到您的本機開發環境: ​您可以使用以下命令部署到您的本機開發環境

    mvn -PautoInstallPackage clean install

    如需完整的命令清單,請參閱建置和安裝

  4. 將程式碼部署到您的 AEM Forms as a Cloud Service環境

為最適化Forms設定Azure儲存體 configure-azure-storage-adaptive-forms

Experience Manager Forms 資料整合提供Azure儲存設定,以將表單與Azure儲存服務整合。 表單資料模型(FDM)可用來建立與Azure伺服器互動的Adaptive Forms,以啟用業務工作流程。

建立 Azure 儲存體設定 create-azure-storage-configuration

在執行這些步驟之前,請確定您擁有Azure儲存體帳戶和存取金鑰,以授權存取Azure儲存體帳戶。

  1. 導覽至​ 工具 > Cloud Service > Azure儲存體
  2. 選取資料夾以建立組態,並選取​ 建立
  3. 在​ 標題 ​欄位中指定組態的標題。
  4. 在​ Azure儲存體帳戶 ​欄位中指定Azure儲存體帳戶的名稱。

為Forms入口網站設定統一的儲存聯結器 configure-usc-forms-portal

執行以下步驟,為AEM Workflow設定統一的儲存聯結器:

  1. 導覽至​ 工具 > Forms > 整合式儲存聯結器
  2. 在​ Forms入口網站 ​區段中,從​ 儲存體 ​下拉式清單中選取​ Azure
  3. 在​ 儲存設定路徑 ​欄位中指定Azure儲存體設定🔗的設定路徑。
  4. 選取「Publish」,然後選取「儲存」以儲存設定。

啟用Forms Portal元件 enable-forms-portal-components

若要在Adobe Experience Manager (AEM)網站中使用任何核心元件(包括現成可用的入口網站元件),您必須建立Proxy元件並為您的網站啟用它。 若要建立Proxy元件及啟用入口網站元件,請參閱使用核心元件

啟用入口網站元件後,您即可在網站頁面的製作例項中加以使用。

新增和設定Forms Portal元件 configure-forms-portal-components

您可以透過新增和設定入口網站元件,在使用AEM編寫的網站上建立和自訂Forms入口網站。 在Forms入口網站中使用元件之前,請確定元件已啟用

若要新增元件,請從[元件]窗格將元件拖放到頁面上的配置容器,或選取配置容器上的新增圖示,然後從插入新元件對話方塊新增元件。

設定草稿和提交元件 configure-drafts-submissions-component

草稿和提交元件會顯示儲存為草稿以供稍後完成和提交表單的表單。 若要設定,請選取元件,然後選取 設定圖示 。 在草稿和提交對話方塊中,指定標題以指示表單清單為草稿或已提交的表單。 同時選取元件是否應該以卡片或清單格式列出草稿表單或已提交的表單。

草稿圖示

提交圖示

設定搜尋與清單元件 configure-search-lister-component

「搜尋與清單製作程式」元件可用來列出頁面上的最適化表單,以及在列出的表單上實施搜尋。

搜尋和製表器圖示

若要設定,請選取元件,然後選取 設定圖示 。 搜尋與清單製作者對話方塊開啟。

  1. 在顯示索引標籤中,設定下列專案:

    • 在​ Title ​中,指定Search & Lister元件的標題。 指示性標題可讓使用者在表單清單中執行快速搜尋。
    • 從​ 配置 ​清單中,選取配置以卡片或清單格式表示表單。
    • 選取​ 隱藏搜尋 ​和​ 隱藏排序 ​以隱藏搜尋並按功能排序。
    • 在​ 工具提示 ​中,提供將游標停留在元件上時顯示的工具提示。
  2. 在資產資料夾索引標籤中,指定提取表單並列在頁面上的位置。 您可以設定多個資料夾位置。

  3. 在結果索引標籤中,設定每頁要顯示的表單數目上限。 預設為每頁八個表單。

連結元件可讓您在頁面上提供最適化表單的連結。 若要設定,請選取元件,然後選取 設定圖示 。 編輯連結元件對話方塊開啟。

  1. 在顯示索引標籤中,提供連結標題和工具提示,以方便識別連結所代表的表單。
  2. 在資產資訊索引標籤中,指定儲存資產的存放庫路徑。
  3. 在查詢引數索引標籤中,以索引鍵值配對格式指定其他引數。 按一下連結時,這些額外的引數會與表單一起傳遞。

使用Adobe Sign設定非同步表單提交 configure-asynchronous-form-submission-using-adobe-sign

您可以將設定為僅在所有收件者完成簽署儀式時提交最適化表單。 請依照下列步驟,使用Adobe Sign進行設定。

  1. 在作者執行個體中,以編輯模式開啟調適型表單。
  2. 從左窗格中,選取[內容]圖示並展開​ 電子簽章 ​選項。
  3. 選取​ 啟用Adobe Sign。 會顯示各種組態選項。
  4. 在送出表單區段中,選取​ 每位收件者完成簽署儀式後 ​選項,以設定送出表單動作,其中表單會先傳送給所有收件者進行簽署。 所有收件者簽署表單後,才提交表單。

將最適化Forms另存為草稿 save-adaptive-forms-as-drafts

您可以將表單儲存為草稿,以便稍後完成。 有兩種方式可將表單儲存為草稿:

  • 在表單元件上建立「儲存表單」規則,例如按鈕。 按一下按鈕時,規則會觸發,而表單會儲存草稿。
  • 啟用「自動儲存」功能,依指定的事件或設定的時間間隔儲存表單。

建立規則以將最適化表單儲存為草稿 rule-to-save-adaptive-form-as-draft

若要在表單元件(例如按鈕)上建立「儲存表單」規則,請遵循下列步驟:

  1. 在作者執行個體中,以編輯模式開啟調適型表單。
  2. 從左窗格中,選取 元件圖示 並將Button元件拖曳至表單。
  3. 選取按鈕元件,然後選取 設定圖示
  4. 選取編輯規則圖示以開啟規則編輯器。
  5. 選取「建立」以設定及建立規則。
  6. 在When區段中選取「已點按」,然後在Then區段中選取「儲存表單」選項。
  7. 選取​ 完成 ​以儲存規則。

啟用自動儲存 enable-auto-save

您可以為最適化表單設定自動儲存功能,如下所示:

  1. 在作者執行個體中,以編輯模式開啟調適型表單。
  2. 從左窗格中,選取 屬性圖示 並展開自動儲存選項。
  3. 選取​ 啟用 ​核取方塊以啟用表單的自動儲存。 您可以設定下列專案:
  • 根據預設,最適化表單事件設為「true」,這表示表單會在每個事件後自動儲存。
  • 在觸發器中,設定為根據事件發生或特定時間間隔後觸發自動儲存。

另請參閱 see-also

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab