當你有一個商業網站時，表格是主要的。它們使客戶更容易與您聯絡並提供重要資訊和反饋。但是，弄清楚如何建立它們可能具有挑戰性。
如果您正在尋找一種簡單、直接的策略，我們建議您使用Elementor表單。這個流行的頁面構建器 為構建各種美觀且易於使用的表單提供瞭解決方案。
在這篇文章中，我們將首先討論您可能想要建立Elementor表單的原因。然後，我們將引導您完成此過程，並介紹一些有用的外掛和故障排除技巧。
- 為什麼要建立Elementor表單
- 如何在WordPress中建立Elementor聯絡表單
- Elementor表單的頂級外掛
- 建立Elementor表單的其他提示和技巧
- Elementor表單疑難解答
為什麼要建立Elementor表單
為您的WordPress網站建立表單有很多優點。首先，您可以為訪問者提供一種快速簡單的與您交流的方法。此外，您可以使用它們來生成潛在客戶並從您的受眾那裡獲取重要資訊。
表單也可以成為註冊使用者和接受付款的有用工具。但是，如果您想向WordPress網站新增表單，則需要使用外掛。或者，您可以使用像Elementor這樣的頁面構建器。
Elementor讓您無需接觸任何程式碼即可構建令人驚歎的表單。您可以使用拖放編輯器建立與您的品牌和網站美感相匹配的響應式表單。
您還可以從多種型別的表格中進行選擇，包括：
- Elementor Contact Forms：您可以使用此功能構建一個簡單的表單，以便使用者與您取得聯絡。
- Elementor Gravity Forms：這個Gravity Forms小部件在自定義和設定表單樣式方面為您提供了更大的靈活性。
- Elementor Register Forms：此功能使您可以 在您的網站上設定使用者登錄檔單。
如您所見，這些表單中的每一個都有其特定的用例，可以幫助增強您網站的功能。接下來，我們將向您展示如何使用Elementor構建聯絡表單。
如何在WordPress中建立Elementor聯絡表
現在我們瞭解了更多關於您可能想要使用Elementor表單的原因，讓我們來看看如何通過幾個簡單的步驟建立一個。請注意，對於本教程，我們假設您已經在您的網站上安裝並啟用了Elementor。
第 1 步：新增Elementor聯絡人小部件
要開始，請導航到要插入聯絡表的頁面或帖子。然後，單擊 螢幕頂部的Edit with Elementor按鈕：
單擊“Edit with Elementor”連結
這將啟動 Elementor 編輯器介面。從左側的小部件中，搜尋並選擇Form小部件：
拖放“Form”小部件
然後，您可以將小部件拖放到您的頁面上。這將插入一個標準的聯絡表格。
第 2 步：設定您的聯絡表單欄位
將聯絡表放在頁面上後，您可以配置一些設定。現在，讓我們專注於設定表單欄位。
您可以通過單擊小部件並自定義文字來編輯基本表單欄位（如果您想更改任何預設選項）。如果要新增其他欄位，可以通過選擇Add Item來完成：
通過新增專案自定義表單
您可以從下拉選單中選擇要新增的欄位型別。接下來，您可以新增一個標籤，即表單欄位的名稱。這向您的訪問者顯示了預期的輸入。
對於Placeholder選項，您可以自定義在使用者輸入資訊之前出現在表單欄位中的文字。您可以使用它為訪問者提供您希望他們提供的資料的示例。
此外，您可以選擇啟用Required設定並修改列寬。您還可以單擊“Buttons”面板來自定義表單按鈕的外觀。您可以更改大小以及字型和顏色。
第 3 步：配置您的表單提交
建立完表單欄位後，下一步是配置表單提交設定。您可以導航到Elementor編輯器中的Email以訪問各種選項。
例如，您可以 在您希望提交提交的To欄位中輸入您的電子郵件地址。如果您願意，可以輸入多個電子郵件地址：
配置您的表單提交
您還可以自定義電子郵件和訊息的主題。配置完所有選項後，請確保儲存更改。
第 4 步：自定義您的聯絡表訊息
如果您想進一步個性化您的聯絡表格，您可以通過啟用自定義訊息來實現。選擇Additional Options，然後將Custom Messaging的切換開關移動到Yes：
自定義聯絡表單訊息
您可以修改四種型別的訊息：
- 成功訊息：一旦使用者提交表單，就會出現此訊息
- 錯誤訊息：如果在提交過程中出現問題，則會出現此問題
- 必填訊息：通知使用者特定欄位未完成
- 無效訊息：讓使用者知道表單提交的某些內容已關閉
您可以自定義這些訊息以匹配您品牌的聲音和風格。例如，您可以修改措辭以新增一些個性。
第 5 步：設計Elementor聯絡表單
處理完表單的基本文字和欄位後，就可以開始設計Elementor聯絡表單的樣式了。例如，您可能希望確保它與您的品牌相匹配。
要開始使用，您可以單擊小部件編輯器頂部的Style選項卡：
樣式和設計表單
在這裡，您會找到各種可用於自定義聯絡表單設計的選項和設定。例如，您可以調整間距和填充，以及更改顏色、大小、標籤和按鈕。
第 6 步：儲存併發布您的表單
當您對Elementor聯絡表單的外觀和內容感到滿意時，剩下要做的就是儲存併發布它。您可以通過選擇螢幕左下方的“Publish”按鈕來執行此操作。
就是這樣！然後，您可以在前端預覽您的聯絡表格，以確認它看起來像您想要的那樣。
Elementor表單的頂級外掛
開箱即用的Elementor頁面構建器提供了許多用於為您的WordPress網站構建表單的選項。但是，您也可以考慮新增外掛來幫助擴充套件表單的功能。讓我們來看看一些選項。
Elementor的主外掛
Elementor的主外掛
Elementor外掛的Master Addons是一個免費增值工具，它提供了一系列有用的工具來增強頁面構建器，進而增強您的網站。它包括以下功能：
- 頁首、頁尾和評論表單構建器
- 超級選單生成器
- 影象懸停效果
- 顯示條件
它還與各種表單外掛相容。這包括Contact Form 7, Ninja Forms, WP Forms和Caldera Forms。要訪問外掛的所有功能，您需要購買專業版，每年39美元。
The Plus Addons
The Plus Addons
您可以與Elementor一起使用的另一個方便的工具是Plus Addons。該外掛包含8,000多個自定義選項和300多個使用者介面 (UI) 塊，可幫助您輕鬆建立和設計頁面和表單。
其特點包括：
- 圖示框
- 地圖部分
- 表單
- 定價表
您還可以選擇超過18個模板。這些是專門為某些型別的企業設計的，包括代理機構、餐館、沙龍等。
有一個免費版本可用。但是，為了利用整套有用的功能，我們建議購買高階許可證，每年39美元。
建立Elementor表單的其他提示和技巧
如果您想在不支付高階許可證的情況下為您的WordPress網站建立Elementor聯絡表格，您可以通過多種方式進行操作。這樣做需要您將頁面構建器與另一個WordPress表單外掛配對，例如WPForms或Formidable Forms。
假設您選擇了Formidable Forms。在您的站點上安裝並啟用外掛後，您可以導航到Formidable > Forms > Add New：
Formidable Forms
接下來，您可以從選項列表中選擇Contact Form，並從一些預製模板中進行選擇。完成構建表單後，瀏覽到要放置它的頁面並啟動Elementor編輯器介面。
在左側面板中，搜尋並選擇Formidable Forms小部件。您可以調整格式、顏色、按鈕、文字等：
Elementor中Formidable Forms小部件
完成後，您可以儲存併發布您的更改。與 Elementor Pro 外掛相比，此方法需要更多的時間和精力。但是，如果您不想購買高階計劃，它可以幫助您節省一些錢。
Elementor表單疑難解答
Elementor聯絡表格非常簡單易用。但是，您在使用時可能會遇到問題。人們報告的最常見問題之一是未送達的電子郵件。
Elementor使用wp_mail函式來分發其電子郵件。這意味著您的託管服務提供商接收已傳送的電子郵件並將其傳送。
但是，某些主機禁用了通常用於傳送電子郵件的PHP函式，這就是可能出現此問題的原因。要解決此錯誤，我們建議與您的託管服務提供商聯絡並要求他們啟用send_mail函式。
或者，您可以使用簡單郵件傳輸協議 (SMTP) 伺服器。這是一個電子郵件伺服器 ，它將使用Gmail等外部來源將您的電子郵件以表單形式傳送到客戶的收件箱。這可以減少您的電子郵件最終進入垃圾郵件資料夾的機會。要設定SMTP，您可以使用WP MAIL SMTP等外掛。
小結
表單在網站中起著舉足輕重的作用。它們使客戶能夠與您取得聯絡、註冊帳戶、提交付款資訊等等。但是，弄清楚如何為您的網站設計美觀的表單可能具有挑戰性。幸運的是，Elementor讓它變得簡單。
將Elementor表單小部件新增到頁面後，您可以設定欄位並配置表單設定。您還可以自定義表單的設計，使其與您的品牌保持一致。
評論留言