5-3 聯絡表單製作 - Contact Form7

最後更新日期: 2023 年 2 月 14 日

不論是公司的官方網站或是個人的網站，我們都會透過連絡表單來讓網站訪客留下資訊，這些資訊可能是單純的留個言、問個問題，或是合作聯繫這類的用途都很常見。所以我們這個單元要來做製作網頁表單。這篇文章會介紹幾種不同的聯絡表單製作方式，可以評估看看自己適合哪一種作法。

本文章節

那第一個是在 WordPress 上大家最推薦的做法，安裝 Contact form 7 外掛。

那跟 Contact form 7 齊名的表單外掛還有另外一個，是有一隻熊的外掛。這個做表單操作起來相對直觀，因為他可以用拖曳的方式來排版。不過他真的有點貴，主要核心功能幾乎都要付費，所以如果你有預算的話再考慮，我們今天就先介紹免費的 Contact form 7。

這個外掛在熱門排行長年位居第一，因為他使用上相對輕量的，功能也相對簡單好上手，所以很多人推薦。

我們可以自由定義表單的選項、一些送出表單後的設定。

也可以自行用 CSS 語法去調整，不過這可能會比較適合懂一點程式的同學來做。

當我們設定好後，可以將這個表單的短代碼直接貼到這個網站的文章、頁面或文字小工具中，也就是你想要讓表單出現的地方。

有些時候，我們為了使用較完整的表單設計與回覆管理，所以也可能選用第三方表單服務，例如：SurveyCake 或 Google 表單。那該怎麼做呢？我們可以透過嵌入 HTML 的方式，直接在 WordPress 網頁上新增 code 元件。

我們在傳送的時候，可以使用 嵌入 HTML ，複製程式碼。

我們可以在發布問卷的時候，選用 嵌入碼，複製程式碼。

我們回到 WordPress 的編輯器，區塊選用 自訂 HTML，貼上之後就會直接顯示了。

這幾種製作網頁表單，都是很常見的方法，各有優缺點，就看你當下的需求囉！