Drupal 8 Webform 模塊 - 簡要教程

已發表: 2020-04-07

Drupal 8 Webform 模塊是一個貢獻模塊，是 Drupal 8 中最強大、最靈活的模塊之一。它是一個開源模塊，用於構建表單和管理提交。 Drupal Webform 也進入了我們的頂級 Drupal 模塊列表，您的下一個 Drupal 項目絕對需要這些模塊！在此 Drupal 8 網絡表單教程中了解有關多功能模塊的更多信息。

Drupal Webform 是一個高度通用的模塊，用於在 Drupal 網站中構建表單並從用戶那裡提取信息。例如，我們可以使用 Drupal 網絡表單模塊來創建調查、聯繫表單、反饋表單等等。提交後，該模塊將允許向用戶發送電子郵件，並可以向管理員發送有關提交的通知。可以選擇查看提交，將其發佈為節點、頁面或塊並將結果導出到 CSV 文件中。

Drupal 8 Webform 模塊入門

Drupal 社區為我們提供了一些非凡的模塊，Drupal Webform 無疑是其中之一。 Webform 模塊的構建者和維護者 Jacob Rockowitz 曾經與我們討論過 Webform 以及他對 Drupal 社區的貢獻。 “每個人都有自己的構建軟件的習慣/風格。 在編寫軟件 20 年後，我開始接受我喜歡朝著單一目標/項目工作，即 Drupal 8 的 Webform 模塊。同時，我也了解到構建開源軟件不僅僅是貢獻代碼； 它是關於支持和圍繞代碼創建一個社區。“在此處閱讀有關 Jacob 和更多 Drupal 社區貢獻者的更多信息。
現在，讓我們開始安裝 Drupal 8 webform 模塊並創建 Webforms。

安裝並啟用 Drupal Webform 模塊

從 https://www.drupal.org/project/webform 下載 Drupal 8 Webform 模塊並啟用它。

安裝並啟用 drupal 8

要啟用網絡表單，請轉到“擴展”，然後在網絡表單類別中，您將看到一個帶有復選框的網絡表單。為了使用 Drupal 8，webforms 啟用了 Field API、系統模塊、用戶模塊。如果不啟用這三個模塊，則無法啟用 webform。
webform 下有許多提供特定功能的選項。根據要求啟用它們。

創建一個新的 Drupal Webform

要創建新的 Drupal 8 webform，請啟用 Webform UI 和 Webform Access。 Webform UI 提供了一個很好的用戶界面來構建/維護 webforms 和 Webform Access 控制 webform 節點。在啟用 Webform Access 之前啟用 Webform Node。然後轉到Structure > Webforms 。

以下是網絡表單的一些選項。

在第一個選項卡中，表單是創建的網絡表單列表。默認情況下，有一個聯繫表單。這是 Webform 模塊提供的模板。
第二個選項卡模板中有更多模板。
在提交選項卡中，我們可以查看用戶提交的表單。
選項具有一組預定義的可重用值，可用於單選按鈕、複選框和菜單。
Add-ons 選項卡中還有一些可重用的值。
在配置中，提供了網絡表單的一般設置。

要創建新的網絡表單 -

單擊添加網絡表單。
單擊添加網絡表單時，將打開一個帶有標題、描述、類別和狀態的選項卡。
為網絡表單添加標題和關於網絡表單的簡短描述。
最後，在狀態下，有兩個選項打開和關閉。 這意味著如果狀態為“打開”，則用戶可以使用該表單，否則該表單已關閉。 編輯完所有選項後，單擊Save 。 例如，這裡的標題是“註冊”。

向 Drupal 8 網絡表單添加字段

單擊“保存”後，將打開一個頁面，其中包含給定的網絡表單標題（此處 – 註冊）。

● 要將字段添加到網絡表單，請單擊 +添加元素。
● 單擊+添加元素時，會彈出一個帶有可在網絡表單中使用的字段列表的彈出窗口。

要預覽元素，請單擊右上角的顯示預覽。要添加元素，請單擊相應元素的添加元素。單擊時，彈出窗口會在頁面右側打開。

這裡有編輯標題名稱的選項和該字段的許多高級設置。完成所有設置更改後，最後單擊“保存”按鈕。單擊網絡表單中所有必填字段的必填項下的複選框。

● 您可以通過單擊頂部的“查看”選項卡查看創建的網絡表單。提交按鈕是在向網絡表單添加元素時自動創建的。
●測試選項卡提供對創建的網絡表單的測試。表單字段的值自動填充隨機值。
● 在結果選項卡中，可以查看提交表單的值。結果選項卡下有三個選項。

提交選項卡下所有已提交表單的列表。
提交的結果可以以四種格式下載 - 下載選項卡下的分隔文本、HTML 表格、JSON 文檔或 Yaml 文檔。
可以在結果的清除選項卡中清除提交的表單。

● Settings 選項卡具有Webforms 的一般設置，可以根據用戶的要求進行更改。

● Drupal webform 的配置可以從導出選項卡下載。配置將顯示出來，可以通過單擊頁面末尾的“下載”按鈕進行下載。配置以Yaml格式下載，因為Yaml 配置文件可以輕鬆導入到另一個 Drupal 實例。

向 Drupal Webform 添加內容

一旦啟用 Drupal 8 Webform 模塊，就會創建一個名為“ webform ”的內容類型。 它有標題、正文和網絡表單等字段。網絡表單有一個下拉列表，其中包含所有創建的網絡表單。

要將內容添加到網絡表單，請轉到內容 > 添加內容 >網絡表單。 如前所述，會有一個標題和正文。有一個標籤為Webform的下拉菜單，其中包含所有創建的 Web 表單的標題名稱。

旁邊還有另一個選項，稱為“網絡表單設置”。

在Status 中，有三個選項， Open （保持對用戶開放）、 Closed （對用戶關閉表單）和Scheduled （它將提供日期和時間字段，並根據提到的日期和時間，表單將保持開放給用戶填寫）。

您還可以通過使用可用令牌填充默認提交數據字段來提供默認數據。 可以通過單擊瀏覽可用令牌來瀏覽令牌。 單擊示例鏈接可以查看編寫令牌的示例。 並且可以在Result選項卡下查看所有提交的表單。

將 Drupal 8 Webform 添加為內容類型中的字段

● 要在內容類型中添加 Drupal 網絡表單，請轉到結構 > 內容類型 > 管理需要表單的內容類型的字段。

● 單擊添加字段。 在“添加新字段”中，選擇“引用”部分下的“網絡表單”，為該字段添加標籤，然後單擊“保存並繼續”。

● 在字段設置中，可以給出字段允許的值數量，然後單擊“保存字段設置”。

● 您可以從默認值中選擇默認表單，或者單擊“保存設置”。

● 現在轉到Contents > Add content並選擇具有引用 webforms 的字段的內容類型。

● 從下拉列表中選擇此內容所需的表單。可以在該內容的結果選項卡中查看提交的表單。

在 Drupal Webforms 中添加驗證碼

您一定已經看到 Captcha 在許多網站中被廣泛使用。在提交表單之前，它會提供一個問題並要求用戶做出回應。這可以防止機器人通過提交許多表單和電子郵件來使服務器過載。

Drupal Webform 允許您在創建 Web 表單時添加 Captcha 元素。 Drupal webform captcha 要求您啟用 Captcha 模塊。

在表單中添加 Drupal webform Captcha 的步驟：

● 從www.drupal.org/project/captcha下載並啟用驗證碼模塊。

● 導航到Structure > Webforms 。

● 單擊需要驗證碼的表單的構建。

● 單擊添加元素並展開高級元素。 通過展開可以查看高級元素列表。單擊添加驗證碼元素以添加驗證碼。

● 單擊添加元素將打開右側的設置窗口。 選中“管理員模式”框，以便管理員可以調試和查看驗證碼。

● 在挑戰類型中，我們有 2 個選項 - 數學和圖像。您可以選擇任何一項。然後單擊保存和保存元素。

● 在字段類型Webform 的內容類型中添加字段，並引用添加驗證碼的表單。

● 現在轉到內容 > 添加內容 >和內容類型，其中有一個引用表單的字段。

● 填寫標題並保存內容。當您查看內容時，會發布表單和驗證碼。在檢查提交按鈕之前，應該填寫驗證碼字段，否則表單將不會被提交並給出警告消息。

Drupal Webform 模塊的優點

● Drupal Webform 模塊是開源的，這意味著它是免費的，您只需要時間來設置和配置表單。

● 您還可以通過鉤子、Webform 處理程序或 Drupal Webform 驗證模塊執行表單驗證。 Drupal 網絡表單驗證模塊向您自定義和創建自己的驗證規則的節點添加了一個額外的選項卡。

● 這些 Web 表單非常靈活，允許自定義表單中使用的字段。

● 它在單個安裝中提供了許多選項，例如向用戶和管理員發送通知和郵件。

● Drupal Webforms 可以輕鬆導出提交的結果。用戶可以在管理界面中查看提交表單的結果，也可以通過單擊一個按鈕將結果導出為 CSV 格式。