聯繫表 7 是一個插件 WordPress 用於創建聯繫表單非常受歡迎。 它允許您無需 HTML 編碼即可創建表單。 這些 形式 可以提供諸如 驗證碼, 下載文件, 調查領域 等等...

儘管聯繫表單 7 的默認樣式足以滿足大多數基本聯繫表單的需要，但您經常需要對其進行修改。

這會更改默認表單的結構，使其更易於訪問。 它還添加了 SHORTCODE [響應式]位於表單上方，以便提交表單時如果出現錯誤，會在表單上註明。

如果您從未創建過WordPress網站，請查找 如何使用FTP客戶端安裝WordPress博客

對於標準形式，插件生成的代碼是：

[回复]您的姓名 (必填) [文本* 您的姓名 id:您的姓名]您的電子郵件 (必填) [電子郵件* 您的電子郵件 id:您的電子郵件]您的主題[文本 您的主題 id:您的主題]您的消息[textarea 您的消息 id:您的消息] [提交“發送”]

一些自定義 Contact Form 7 表單的插件

1.聯繫表7樣式

插件 聯繫表 7 樣式 有多種款式可供選擇。

對於二十一十五主題用戶來說，還有兼容的風格。

要應用樣式，請轉到“ 聯繫人樣式 > 快速編輯 ”，選中您要應用該樣式的表單，然後單擊“ 更新 “。

2. 聯繫表 7 皮膚

使用皮膚 聯繫表7， 創建一個新的 聯繫表格 然後向下滾動頁面到“皮膚”部分。 您可以為表單選擇模板和样式。

您會發現專用於以下形式的模板événements、登記和通知。

這就是使用“二十十五”主題的黃玉風格調查表的樣子。

3. 聯繫表單的材料設計

這些風格是基於 材料設計.

該插件建議您刪除默認表單並使用其短代碼。

這是 Hestia 主題的示例。 請注意當指針移至表單上的字段時出現的浮動標籤。

聯繫表格 7 測試一些 WordPress主題

帶有 ColorMag WordPress 主題的聯繫表

大多數時候，Contact Form 7 將繼承您的 WordPress 主題的風格。 主題就是這樣 深珊瑚色.

帶有 ColorMag WordPress 主題的聯繫表

這是沒有自定義樣式的表單。 它繼承了藍色按鈕的顏色 ColorMag WordPress 主題.

我首先上傳一張照片用作表單的背景圖像，並將表單標籤的代碼從灰色更改為白色，並在文本上添加藍色陰影。

接下來的更改是增加表單和表單字段標籤之間的邊距、更改減法按鈕以及在指針進入表單字段時添加邊框。

提交表單時錯誤/成功消息的顯示也應該更改，以便它們正確顯示。

提交表單時旋轉的 GIF 沒有正確顯示，我找到了 Loading.io 的替代方案並用 CSS 引用了它。

這是生成的表格：

這是代碼：

div.wpcf7 { 邊距：0； 填充：1.5em； 背景： url('your_background_image_url_here'); -webkit-border-radius: 3px; -moz-邊框半徑：3px； 邊框半徑：3px； } .wpcf7 標籤, .wpcf7-提交 { 顏色: 白色; 文本陰影：1px 1px 0px rgba(40, 157, 204, 1); .wpcf7 .wpcf7-form-control { 邊距：10px 0 20px 0; } .wpcf7 .wpcf7-submit:hover { 背景: #186d8e; } .wpcf7-form-control:focus { 邊框：2px 實心 #289dcc; } div.wpcf7-response-output { 背景：#F8F8F8; 文本對齊：居中； 寬度：92.5%； 邊距：1em 0em 1em 0em； -webkit-border-radius: 3px; -moz-邊框半徑：3px； 邊框半徑：3px； } span.wpcf7-not-valid-tip { 背景：#F8F8F8; 顯示：內聯塊； 寬度：自動； 填充：1%； -webkit-border-radius: 3px; -moz-邊框半徑：3px； 邊框半徑：3px； } div.wpcf7.ajax-loader { 背景圖像: url('your_loading_image_url_here'); 寬度：50px； 高度：50px； }

如果您不需要亂寫代碼，我們建議您查看我們的 10 WordPress插件可在您的博客上創建聯繫表

還可以發現 3 種高級替代方案，幫助您創建聯繫表格。 

1。 W8聯繫表格

W8 Contact Form是的插件之一 聯繫表格 WordPress 上最受歡迎的。 它提供了許多功能，例如提交給多個收件人、支持動畫、無限的表單創建、不同的樣式以及各種其他自定義選項。

此外，它為您的網站或博客提供了一個專業的系統，可以更輕鬆地與您的客戶取得聯繫。 您將能夠根據您的需求和品味定制所有表格。

下載 | DEMO | 虛擬主機

2。 聯繫我們表格

“聯繫我們表單”是一個響應迅速的WordPress插件，是一個簡單的工具，但具有豐富的自定義選項，可讓您顯示清晰，令人鼓舞的表單，訪問者可以通過在表單上留下信息來與您聯繫。

您將能夠定義必要的字段，選擇最佳的字段佈局並完全自定義字段，以鼓勵您的客戶或訪客留下他們的建議或消息。

只需在您想接收消息的位置設置電子郵件地址，並使用它來朝著最有利可圖的方向發展您的業務。

下載 | DEMO | 虛擬主機

3。 Slick Popup Pro

Slick Popup Pro 是一個 WordPress插件 非常簡單和輕量級，可以轉換插件創建的任何形式 聯繫表7 在彈出窗口中。 她使用表單並將其轉換為美觀且完美響應的彈出窗口。

彈出表單可以有多種用途，包括：信息收集表單， 聯繫表格，註冊表，報價單，建議/投訴表等。

下載 | DEMO | 虛擬主機

推薦資源

查看其他推薦資源，這些資源將幫助您更好地在網站或博客上創建和管理聯繫表單。 

• 6 WordPress插件，供CAPTCHA在您的表單上進行驗證
• 如何添加與WordPress聯繫表7一個接觸的形式
• 如何在WordPress上創建符合GDPR的表單

結論

所以 ！ 這就是本教程的內容，我希望您能有更多想法來定制您的聯繫表單。 不要猶豫 與您喜歡的社交網絡上的朋友分享. 

但是，您也可以諮詢我們的 RESSOURCES，如果您需要更多的元素來執行創建Internet網站的項目，請參考我們關於 WordPress博客創建。

但是，與此同時，請告訴我們您的 評論 和專用部分中的建議。

...