wpforms teaching

【WPForms】,最適合新手使用的WordPress表單外掛

聯繫表單在網站裡面是很重要的功能之一,他可以幫助你收集訪客的數據,同時不同的網站類型也會需要更種不同的表單,不過對於剛開始接觸WordPress的新手或者是沒有程式語言背景的人來說,市面上的許多表單外掛可能都會讓大家很頭痛。

今天要介紹的WPForms相信就是可以幫助大家解決這些困擾!

WPForms是什麼?

wpforms website

WPforms是是現在最流行的表單之一,他是由一位國外有名的部落客wpbeginner所以創立的表單外掛,目前已經累積了3百萬以上的下載量,在功能上他包含免費跟付費的,免費版有基本的聯繫表單的功能,高級版可以讓你製作文件上傳、付款、電郵行銷等等功能的標單。

兩個版本最主要的區別就是製作表單的元素跟他的附加組件的差異,但是在操作上對於新手來說都是很簡單的。

WPForms功能特色

拖放式表單編輯器(Lite)

如果有使用過Elementor的話,你一定知道拖放式編輯器是什麼,簡單來說,就是只要將想要的內容拖入,就可以製作出你理想的表單樣子了!

表格模板(Lite)

WPForms在一開始製作表單的時候,他會提供表單的模板,讓你可以更快速的完成,在免費版的時候,他只提供了三個三個表單模板,包括聯繫表單、訂閱表單、建議表單,但是購買付費版之後,就會提供更多的模板可以選擇!

響應式設計(Lite)

他的表單是自動具有響應式設計的,所以他不會因為裝置不同而有影響!

條件式(Basic)

他會讓題目在某些答案出現時才會顯示,就像是可以設定輸入完公司的名稱之後才會顯示要填寫名字的欄位等等的。

即時通知(Basic)

在有人提交表單之後,WPForms就會立刻通知你,你可以選擇只通知你自己或是同時通知好幾個人。

數據庫(Basic)

他會將所有的表單的數據都存在WordPress後台裡面,你可以直接在後台就可以看到訪客談寫表單的所有內容,並且可以將他匯出成一份Excel檔。

多頁表單(Basic)

你有沒有遇過表單一次要填寫很多就會覺得有麻煩的狀況,WPforms可以讓你製作多頁的表單,如果你會需要用到須要填寫很多的表單的話,至少不會看起來一整頁滿滿的。

上傳文件(Basic)

假如你要想要做一個免費索取電子書的訂閱功能的話,你就會需要用到它了,他可以讓你將你的文件上傳,作為讓訪客訂閱的方法。

垃圾郵件防護(Basic)

在WPForms裡就已經有內建的反垃圾郵件的功能,另外他還可以讓你將 reCAPTCHA加入到你的表單之中,因此不需要擔心表單成為垃圾郵件或是被駭客利用。

PayPal(Pro、Elite)

如果你的網站上有在銷售產品的話,WPForms也有將PayPal整合在其中。

除了上述我認為很重要的的功能之外,他還有非常多的功能,不過大多數都是需要付費的,如果還想知道更多的話,可以參考官方對於功能的說明

WPForms使用教學

接下來就要告訴大家要怎麼使用WPForms製作出表單。

Step .1安裝啟用

首先到Wordpress後台下載WPForms,並且安裝啟用他。

wpforms download

Step .2創建新表單

安裝啟用後,他就會直接到WPforms的說明頁面,往下滑就會看到Create Your First Form,點選他。

wpforms createe your first form

Step .3選擇模板

下一步你就會到選擇模板的地方,裡面你會看到Blank Form(空白表單)、Simple Contact Form(聯繫表單)、Newsletter Signup Form(訂閱表單)、Suggestion Form(建議表單),這裡我選Simple Contact Form當作示範。

wpforms template

Step .4製作表單

接下來你就會進入製作表單的畫面了,你要做的就是將你需要的內容拖進表單裡面,而且每個內容元素都可以另外進行設定,在這裡建議大家可以用Goolge翻譯,就可以很快理解了。

等你都製作好了之後,按一下Submit,就會到下一步設定的地方。

wpforms field options

Step .5設定(General)

這部分會分成General、 Notifications、Confirmations去講,General主要就是對表單的標題跟按鈕做設定,最後可以看到Enablr anti-spam protection已經勾選了,那是啟用反垃圾遊戲保護,建議勾選。

以下是各個欄位的中文翻譯:

wpforms general setting

Step .6設定(Notifications)

下一步就是進行通知的設定,在這裡你可以設定自動回覆,這樣訪客在填寫你的表單之後,就會收到一封你設定好的電子郵件。

wpforms notifications setting

在這裡我會推薦大家使用Show Smart Tags的功能,因為他會有一些可以用的內容,例如填寫表格訪客的名字、電子郵件、表格名稱等等的內容,你只要點選你要的內容他就會自動加入了。

例如我希望在Eamil Subject的地方顯示填寫表單的人的名字,所以我就加入了Name,然後在後面打上「你好!感謝您的聯繫」,這樣未來假如小明收到了這封信就會是「小明,你好!感謝您的聯繫」,在其他的地方也可以這樣應用。

wpforms notifications setting email subject

以下是各個欄位的中文翻譯,大家也可以參考我的設定:

wpforms notifications setting translation

Step .7設定(Confirmations)

wpforms confirmations setting

Step .8嵌入短代碼

最後點選右上角的EMBED將你的短代碼貼到你想要的頁面就可以完成囉!

wpforms embed

如何改變WPForms的樣式?

WPForms是可以根據你的佈景主題在樣式上對自動的調整的,但是如果你想要自己調整呢?

這時候你就可以使用Styler for WPForms來對他做樣式的設定。

styler for wpforms

Step .1到外觀>自訂的地方

下載安裝啟用後,你就可以直接在佈景主題>自訂的地方找到他。

where is styler for wpforms

Step .2選擇表單

點選他之後,他就會要你選擇你要調整的表單。

styler for wpforms select form

Step .3調整

最後就將表單調整成你想要的樣子就可以囉!

如何紀錄表單內容?

免費版的WPforms最大的問題就是,沒辦法紀錄訪客填寫的內容,不過可以用其他的方法做到,這裡就推薦大家使用Post SMTP這個外掛,他可以記錄所有從網站發出去的郵件。

記得我在WPForms設定>Confirmations,在信息的地方,我加入了{all_fields},他會顯示訪客填寫表單的內容,並且寄給訪客,這樣在Post SMTP就也可以記錄到了,雖然不是那麼方便,不過是目前找到的方法之一,如果未來有找到更好的方法的話,會再推薦給大家。

post smtp

結語

雖然WPForms免費版在某些部分顯得有些不足,不過總體來說,他還是非常適合新手使用的WordPress表單外掛,對於不會寫程式語言的人也真的是非常方便的外掛。

如果還想知道更多WordPress外掛的話,可以參考我的另一篇文章:【WordPress外掛】推薦,22個不能不知道外掛總整理,安裝外掛教學

2 thoughts on “【WPForms】,最適合新手使用的WordPress表單外掛”

  1. 正為表單創建困擾著,還好有看到這篇文章,可以解決我的問題,真是太棒了,謝謝你

Leave a Comment

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

Scroll to Top