WordPress表單外掛

超方便的WordPress表單外掛-利用Caldera Forms將表單填寫內容轉為客製化PDF並自動回信

你是否有這種困擾,當公司網站的表單被客戶填寫後,需要自己到資料庫後台找客戶資料並親自 Key 到制式化文件中,才能做出合約交給客戶?

這篇 Kevin 要跟大家分享一款超級方便的 WordPress 表單外掛:Caldera Forms,只要上傳一次公司制式化 PDF 模板,日後每當有客戶填寫表單,就能立即生出相對應的合約或文件,並且會自動寄信讓你能夠下載檔案喔!

Caldera Forms 介紹

Caldera Forms 是免費而且強大的 WordPress 表單外掛,非常厲害的是它的視覺化編輯器,利用拖拉的方式就能輕鬆做出想要的響應式表單。

WordPress 有非常多製作表單的外掛,但是沒有一個像 Caldera Forms 一樣同時有邏輯運算功能條件式表單整合第三方 Email 自動化行銷平台以及連接雲端等功能,重點是使用完全免費!

無論是部落格新手,或是網頁表單開發技術人員,Caldera Forms 都是一個非常實用且方便的表單外掛。

開始前需要安裝的外掛

Caldera Forms 外掛

WordPress表單外掛1

E2pdf 外掛

能夠串接 Caldera Forms 表單,可自行上傳制式化 PDF 模板並利用拖拉式將 Caldera Forms 表單中的資料拉入 PDF 相對應位置。

WordPress表單外掛2

利用 Caldera Forms 設計表單教學

第一步:開啟新表單

點擊 Caldera Forms Forms

WordPress表單外掛 3

點擊 New Form 會出現表單模板,可以直接使用模板或是選擇 Blank Form 生成空白表單,並為表單命名。

WordPress表單外掛 4
WordPress表單外掛 6

第二步:設計表單

點擊 ‹› 可以左右分欄,點擊 新增下方欄位,點擊  可以將兩個欄位合二為一。

WordPress表單外掛 7
WordPress表單外掛 8

拉入 Add Field 到設計好的欄位,就可以開始選擇欄位性質。

WordPress表單外掛 9

Caldera Forms 的欄位性質非常豐富,可以自行探索一下。

WordPress表單外掛 10

決定欄位性質後,請自行命名 Slug,後面會用到這個名字當作短代碼塞到 PDF 中。

WordPress表單外掛 11

第三步:計算功能

如果你的表格想要有自動計算功能,Calder Forms 也有一個欄位性質叫 Number

WordPress表單外掛 12

下方 Manual Formula 可以輸入公式,利用前面提到的 slug 名稱就可以進行不同欄位間的計算囉!

WordPress表單外掛 13

第四步:表單計數功能

如果你希望表單會有數字累計,比如訂單編號,美新增一單數字都會自動+1,可以到 ProcessorsAdd Processor Increment Start,定義訂單編號要從多少開始。

WordPress表單外掛 14

利用 E2pdf 將表單轉為制式化 PDF 文件教學

第一步:上傳中文字型

因為 E2pdf 外掛內建字體是英文的字體,打中文會產生亂碼,所以要自行去下載 Microsoft JhengHei 字體,或是其他可以相容英文和中文字的字體。

點擊 E2pdfFontsUpload 上傳字體。

e2 pdf

第二步:上傳 PDF 模板

點擊 E2pdfTemplatesAdd new 上傳 PDF 模板。

e2pdf 3

更改 Status 為 Activate;字體設為 Microsoft JhengHei;表單選擇前面製作好的表單,並按下 Upload PDF 將自己的 PDF 模板上傳。

e2pdf 4

第三步:將表單欄位資料拉入 pdf 模板

簡單的一行字拉 Input 即可,若是文字方塊需要換行的就拉 Textarea

e2 pdf 5

點選滑鼠右鍵 ➞ Map Field 選擇要放入相對應位置的資料,系統就會自動將短代碼放入。

e2pdf 6
e2pdf 7

第四步:儲存客製化PDF

右上角 Save 會自動生成短代碼,分別為附件、下載、儲存、顯示、壓縮檔,先按下 Update 儲存做好的客製化 PDF。

e2 pdf 8

第五步:設定表單送出後要顯示的內容

回到 Caldera FormsForm Settings,設定表單送出後成功訊息。

WordPress表單外掛 15

第六步:設定電子郵件自動回覆

回到 Caldera FormsEmail,當表單填寫完送出後,可以設定:
1. 信件會從哪裡寄出(From Email)
2. 會寄給誰(Email Recipients)
3. 信件內容是什麼(Email Message)

WordPress表單外掛 16

第七步:將表單放入網站

在 Elementor 搜尋 Caldera Form,選擇做好的表單,拉到適當的位置就完成囉!

elementor

結論

在使用過那麼多的表單外掛後,Kevin 真心覺得 Caldera Forms 的整合功能非常強大,客製化程度也很高。

本篇介紹的自動生成 PDF 利用了 Caldera Forms 的短代碼功能,如果有電郵行銷需求,它也可以整合第三方 Email 行銷平台將資料自動同步匯入

如果這篇文章對你有幫助,可以幫我按 Like 當作回饋,支持我繼續寫出更多好文章!

更多網路斜槓相關文章
電郵行銷工具教學

網路行銷私藏工具

選擇好的網路行銷工具,能夠讓你事半功倍。這裡有 Kevin 私藏的網路行銷工具,想要學習網路行銷一定不能錯過。 

更多網路行銷工具請看:Kevin 私藏網路行銷工具

歡迎按讚我的粉絲專頁會有最新文章、Email 行銷知識、網路行銷工具優惠、網路學習資源的訊息。

如果我的文章對你有幫助,歡迎贊助我一杯咖啡!




若你為海外讀者,也歡迎使用 Paypal 贊助喔!

​你可能會想看

發佈留言

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