建立表單入口網頁

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

必備條件

Forms入口網站元件預設無法使用。 確保以下表單門戶元件類別已啟用,如啟用表單門戶元件中所述。

文檔 服務包括Search & Lister、Link、Drafts和Submissions元件。

文檔服 務謂詞包括日期謂詞、全文謂詞、屬性謂詞和標籤謂詞元件。這些元件用於在Search & Lister元件中配置搜索。

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

元件瀏覽器中的AEM Forms入口網站元件

Forms入口網站元件類別

Search & Lister元件

「文檔服務」元件類別下提供的Search & Lister元件用於列出頁面上的表單,以及對列出的表單實施搜索。 元件包含兩個窗格:

  • 列出表單的清單窗格。
  • 添加搜索功能的搜索窗格。

您可以將「Search & Lister」元件從元件瀏覽器的「Document Services」元件類別拖放到頁面上。 新增元件後,看起來類似下列。

頁面中的搜尋與清單元件

在具有網格佈局的頁面中搜索和清單元件

清單窗格

「清單」窗格是列出表單的區域。 Search & Lister元件提供了各種配置選項,可用於控制「清單」窗格中表單的顯示。

若要設定「清單」窗格,請點選「搜尋」和「清單」元件,然後點選settings_icon。 將開啟「編輯元件」對話框。

以編輯模式顯示的清單窗格

以編輯模式顯示的清單窗格

Edit​對話框包括幾個頁簽,這些頁簽提供下表中描述的配置選項。 點選​OK​以儲存設定,完成時。

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

顯示

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

配置結果文本(例如,601 Results的1-12)。 預設值為Results

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

頁面文字

配置頁面文本(例如,頁面1,共51頁)。 預設值為Page

例如,如果在此欄位中指定「應用表單」,且有51頁,則頁面文本將更改為「應用表單1/51」。

Of 文字

將的取代為指定的文字(51的第1頁)。 預設值為of

例如,如果您在此欄位中指定out of ,則文字會變更為out out 51頁。

表單連結 呈現類型 根據指定的呈現類型控制表單清單。 可用的選項有PDF和HTML。 例如,如果僅選擇HTML作為渲染類型,則會過濾掉PDF forms。
HTML設定檔 設定用於呈現的HTML設定檔。 下拉式清單中會列出所有可用的設定檔。
提交URL

配置提交表單資料的Servlet。

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

  1. 表單中內嵌的提交URL(在「提交」按鈕中)具有最高優先順序。
  2. AEM Forms UI中提及的提交URL具有第二高的優先順序。
  3. 表單入口網站中提及的提交URL優先順序最低。
HTML呈現操作工具提示 配置工具提示的文本,該文本顯示在將指針懸停在上(HTML5表徵圖)上。
PDF轉譯動作工具提示 配置工具提示的文本,該文本顯示在將指針懸停在上(PDF表徵圖)上。
樣式 樣式類型 可指定無樣式、預設樣式自訂樣式以列出表單。
自訂樣式路徑 如果選擇「自定義」作為「樣式類型」,請瀏覽以指定自定義CSS的路徑,否則選擇「預設」。

搜索窗格

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

提示: 您可以根據預設條件控制表單入口網站上顯示的表單清單,並隱藏使用者的搜尋功能。若要控制表單清單,請使用述詞元件來套用搜尋篩選器。 您也可以指定預設篩選值,並從「編輯元件」對話框的「顯示」頁簽中禁用搜索。

含有日期、全文、屬性和標籤述詞的搜尋面板

含有日期、全文、屬性和標籤述詞的搜尋面板

日期述詞

新增「日期述詞」元件後,即可搜尋在指定期間修改的清單。

要配置「日期謂詞」元件,請執行以下操作:

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

  2. 指定下列項目:

    • 類型: 唯一可用的選項是「上次 修改日期」

    • 文字: 日期述詞元件的標籤或註解。預設值為​上次修改日期。

    • 開始日期標籤: 標籤或開始日期欄位的標題

    • 結束日期標籤: 結束日期欄位的標籤或註解

    • 隱藏: 若要強制執行預設日期篩選以列出表單

  3. 點選​確定

全文謂詞

全文述詞元件會對表單資料(例如名稱和說明)實作全文搜尋。 使用者可以搜尋任何文字字串,以傳回名稱或說明中包含文字的表單。

配置全文謂詞元件:

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

屬性謂詞

「屬性述詞」元件會實作根據表單屬性(例如標題、作者和說明)來搜尋表單。

要配置屬性謂詞元件:

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

  2. 在「常規」頁簽中,指定搜索標籤。 預設值為​Properties

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

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

  5. 重複步驟4以新增更多屬性。 您也可以指定預設篩選值,以根據指定的條件列出表單,並隱藏屬性以供一般使用者搜尋。 選取屬性的「隱藏」核取方塊並指定預設篩選值。
    例如,如果要顯示標題中包含"Travel"的表單,請選擇Title屬性旁的隱藏。 此外,指定預設篩選值文本框中的差旅。

  6. 點選​確定

標記述詞

「標籤述詞」元件會實作根據Forms Manager中定義的標籤來搜尋表單。

若要設定「標籤述詞」元件:

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

所選標籤與選中的複選框一起顯示在「搜索」窗格中。 使用者現在可以根據標籤縮小搜尋範圍。

列出頁面上的表單

要在頁面上列出表單,請將​Search & Lister​元件添加到頁面,並配置​List Pane。 要使最終用戶能夠搜索包含日期、文本和標籤的表單,請添加​搜索窗格​元件。

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

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

移動設備友好性

Forms Portal Search & Lister元件適合行動裝置,並據此進行調整。 所有三個預設視圖:網格、卡、面板根據開啟網站的裝置重新發佈,但網頁也隨之調整。 簡單的事實是,Search & Lister僅是元件,不控管頁面層級樣式。

下列影像描述在行動裝置上開啟Search & Lister元件時:

Search和Lister元件的螢幕截圖

Search&Lister元件

自訂表單入口網頁

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

AEM Forms UI可讓您將自訂中繼資料新增至表單。 自訂中繼資料對於提供清單和搜尋表單體驗給使用者很實用。 如需自訂中繼資料的詳細資訊,請參閱自訂Forms入口網站元件的範本

表單入口網站可立即提供演算動作。 您可以自訂表單入口網站,以新增更多動作。 有關詳細資訊,請參閱添加對表單清單項的自定義操作。

相關文章

本頁內容