建立表單入口網站頁面

Forms Portal元件為網頁開發人員提供元件,讓他們在使用Adobe Experience Manager(AEM)製作的網站上建立和自訂表單入口網站。 如需表單入口網站的快速概觀,請參 閱在入口網站上發佈表單簡介

必備條件

Forms Portal元件預設無法使用。 請確定下清單單入口元件類別已啟用,如啟用表單入口元 件中所述

檔案服務 (Document Services)包含Search & Lister、Link、Drafts和Submissions元件。

Document Services Predicates Includes Date Predicate、Full Text Predicate、Properties Predicate和Tags Predicate元件。 這些元件用於在Search & Lister元件中配置搜索。

在AEM網站頁面上啟用這些類別後,這些元件類別就可供元件瀏覽器使用。

AEM Forms Portal元件在元件瀏覽器中​圖: Forms Portal元件類別

Search & Lister元件

Search & Lister元件位於「檔案服務」元件類別下,可用來列出頁面上的表單,並在列出的表單上實作搜尋。 此元件包含兩個窗格:

  • 列出表單的清單窗格。
  • 新增搜尋功能的搜尋窗格。

您可以將Search & Lister元件從元件瀏覽器的「檔案服務」元件類別拖放至頁面上。 新增元件時,其外觀類似下列。

頁面圖中的Search & Lister組​件: 使用格線版面配置的頁面中的Search & Lister元件

清單窗格

「清單」窗格是列出表單的區域。 Search & Lister元件提供多種設定選項,您可用來控制「清單」窗格中表格的顯示。

若要設定「清單」窗格,請點選「搜尋與清單器」元件,然後點選 settings_icon。 「編 輯元件 」(Edit Component)對話框開啟。

清單窗格在編輯模式下​圖: 清單窗格處於編輯模式

「編 」對話框包括幾個頁籤,這些頁籤提供下表中所述的配置選項。 完成 ,點選「確定」以儲存設定。

索引標籤 設定 說明
資產資料夾 新增項目 設定使用AEM Forms UI上傳資產的檔案夾。 依預設,會列出所有已上傳的資產。 如需AEM Forms UI的詳細資訊,請參閱「管 理表單的簡介」

顯示

標題文字 Search & Lister元件的標題。 預設標題為 Forms Portal。
版面範本 資產的版面配置。
停用進階搜尋 啟用後,隱藏進階搜尋圖示。
停用文字搜尋 啟用後,隱藏全文搜索欄。
結果 每頁結果數 設定您要在頁面上顯示的表單數量上限。
結果文字

設定結果文字(例如,601個結果的1-12 )。 預設值為「 結果」

例如,如果您在此欄位中 定表單,而且總共有601個表單,則結果文字會變更為601個表單中的1-12 個。

頁面文字

設定頁面文字(例如, 1頁(共51頁)。 預設值為 Page

例如,如果您在此欄位中 指定「應 用程式表單」,且有51個頁面,則頁面文字會變更為「應用程式表單 1」(共51頁)。

Of 文字

以指定的 文字 (第1頁,共 51頁)取代。 預設值

例如,如果您在此欄位 中指 定「超出」,文字會變更為「第1頁 超過 51頁」。

表單連結 呈現類型 根據指定的渲染類型控制表單清單。 可用的選項有PDF和HTML。 例如,如果您只選擇HTML作為演算類型,則會篩選掉PDF表格。
HTML設定檔 設定要用於轉譯的HTML描述檔。 下拉式清單中會列出所有可用的描述檔。
提交URL

配置提交表單資料的servlet。

注意: 表單的提交URL可在數處指定,其優先順序如下:

  1. 內嵌在表單中的提交URL(在「提交」按鈕中)具有最高優先順序。
  2. AEM Forms UI中提及的提交URL具有第二高的優先順序。
  3. 表單入口網站中提及的提交URL的優先順序最低。
HTML Render Action工具提示 設定工具提示的文字,此工具提示會顯示在將指標暫留在 (HTML5圖示)上。
PDF Render動作工具提示 設定工具提示的文字,此文字會在將指標暫留在(PDF 圖示)上顯示。
樣式 樣式類型 允許您指定「無 樣式」、「預設樣式」或「 自定義樣 式」來列出表單。
自訂樣式路徑 如果您選取「自訂」作為「樣式類型」,請瀏覽以指定自訂CSS的路徑,否則選取「預設」。

搜尋窗格

「搜尋」窗格可讓您在AEM Sidekick中,從「檔案服務謂語」類別新增「日期謂語」、「完整文字謂語」、「屬性謂語」和「標籤謂語」元件。 這些元件會實作搜尋功能,讓使用者在列出的表單上執行搜尋。

提示: 您可以根據預設准則控制表單入口網站上顯示的表單清單,並隱藏使用者的搜尋功能。 要控制表單清單,請使用Predicate元件來應用搜索篩選器。 您也可以指定預設篩選值,並停用「編輯元件」對話方塊的「顯示」索引標籤中的搜尋。

Search Panel with Date、Full Text、Properties和Tags Predicate​Figure: Search Panel with Date、Full Text、Properties和Tags Predicate

日期述詞

Date Predicate元件在添加時,可對在指定持續時間內修改的列出表單啟用搜索。

要配置Date Predicate元件:

  1. 點選元件,然後點選 settings_icon。 「編輯」(Edit)對話框開啟。

  2. 指定下列項目:

    • 類型: 唯一可用的選項是「上次修 改日期」
    • 文字: Date Predicate Component的標籤或標題。 預設值為「上次修 改日期」
    • 開始日期標籤: 開始日期欄位的標籤或標題。
    • 結束日期標籤: 結束日期欄位的標籤或標題。
    • 隱藏: 若要強制執行預設日期篩選以列出表單。
  3. 點選「 確定」。

Full Text Predicate

Full Text Predicate元件實現對表單資料的全文搜索,如名稱和說明。 使用者可以搜尋任何文字字串,以傳回名稱或說明中包含文字的表單。

要配置Full Text Predicate元件:

  1. 點選元件,然後點選 settings_icon。 「編輯」(Edit)對話框開啟。
  2. 在「主標題」欄位中 指定標題
  3. 點選「 確定」。

屬性謂詞

Properties Predicate元件實現基於表單屬性(如標題、作者和說明)搜索表單。

要配置Properties Predicate元件:

  1. 點選元件,然後點選 settings_icon。 「編 輯」(Edit )對話框開啟。

  2. 在「一 」標籤中,指定搜尋標籤。 預設值為 Properties

  3. 在「選項 」標籤 ,點選「 新增項目」

  4. 從下拉式清單中選取屬性,並在下拉式清單下方的欄位中指定其搜尋標籤。

  5. 重複步驟4以新增更多屬性。 您也可以指定預設篩選值,以根據指定的准則列出表單,並隱藏屬性以供使用者搜尋。 選取屬性的「隱藏」核取方塊,並指定預設篩選值。

    例如,如果您想要顯示其標題中包含"Travel"的表單,請選取「標題」屬性旁的「隱藏」。 此外,指定「在預設篩選值中傳送」文字方塊。

  6. 點選「 確定」。

標記述詞

Tags Predicate元件實現基於在Forms Manager中定義的標籤搜索表單。

要配置Tags Predicate元件:

  1. 點選元件,然後點選 settings_icon。 「編 輯」(Edit )對話框開啟。
  2. 點選「標籤」欄位旁的向下箭頭按鈕。
  3. 選擇適當的標籤。
  4. 點選「 確定」。

選取的標籤會與選取的核取方塊一起顯示在「搜尋」窗格中。 使用者現在可以根據標籤縮小搜尋範圍。

列出頁面上的表單

若要在頁面上列出表單,請將 Search & Lister元件新增至頁面並設 定「清單」窗格 。 若要讓使用者使用日期、文字和標籤來搜尋表單,請新增「搜尋窗格」 元件

若要從頁面上的任何位置連結表單,請使用連結元件。 如需連結元件的詳細資訊,請參 閱頁面中的內嵌連結元件

要列出處於草稿狀態的表單和已提交的表單,請使用「草稿和提交 」元件 。 如需詳細資訊,請參 閱自訂草稿和提交元件

行動裝置友好性

Forms Portal Search & Lister元件適合行動裝置使用,並可據以調整。 所有三種預設檢視: 格點、卡片、面板會根據開啟網站的裝置重新開啟,而網頁也會隨之調整。 簡單的事實是,Search & Lister僅是元件,不管控頁面層級樣式。

下圖顯示在行動裝置上開啟的Search & Lister元件:

Search and Lister元件圖的螢幕擷取: Search & Lister元件

自訂表單入口網站頁面

您可以自訂表單入口網頁,為頁面提供不同的外觀。 您也可以新增中繼資料來改善搜尋體驗、變更頁面的版面配置,以及新增自訂CSS樣式。 如需詳細資訊,請參 閱自訂Forms Portal元件的範本

AEM Forms UI可讓您將自訂中繼資料新增至表單。 自訂中繼資料對於提供清單及搜尋表單體驗給使用者十分有用。 如需自訂中繼資料的詳細資訊,請參 閱自訂Forms Portal元件的範本

現成可用的表單入口網站提供演算動作。 您可以自訂表單入口網站,以新增更多動作。 如需詳細資訊,請參 閱「新增對表單清單項目的自訂動作」。

本頁內容