contact form 7 是 wordpress 的外掛中的一個聯絡表單外掛,其功能相當不錯,當然在 wp 的一堆外掛中還是有很多滿不錯的聯絡表單外掛可以應用,日後再一一跟大家分享和說明。
今天要筆記的是一個說來簡單的小筆記,使用 contact form 7 的朋友們應該都知道,它的外觀設定並不是那麼的 ok,在這裡就先不說到外觀設定,因為還是可以利用其他外掛做因應,就看其套用的樣式能不能符合網站主的需求。
如何更改 contact form 7 文字區域的預設行數
好 ! 回歸正題,要如何更改文字區域的行數 ? 雖然在前台可以藉由點擊文字區域的右下角斜線部位,滑鼠左鍵點著不放,就可以拉高縮短,但因為預設的文字區域的行數是 10 ( 如果記的沒錯的話 ),一進入頁面就會看到整個表單的高度拉的很高,如果再加上其他輸入欄位的高度,那就真的是太高了 ! 如果您的網站是屬於很精緻的網站就不太適合,所以該如何減少文字區域一開始的行數 ? 我們來看一下下面的程式碼,只要短短幾個字就可以更改預設的行數 :
預設的表單程式碼 :
<label> 填寫訊息 [textarea your-message ] </label>
修改增添的表單程式碼 :
<label> 填寫訊息 [textarea your-message 40×2] </label>
我將重點用紅字標註,就是上面這 40 x 2,40 是寬,2 是行數,也就是說如果你想要是 3 行就將 2 改為 3 就可以 !
下次來筆記一下修改其它輸入欄位的大小設定,我們可以藉由修改css來解決,不過這是對 html 和 css 有一定基礎的人做的事,大家有空先學習 html 和 css,一般人對程式或是 html 和 css 不熟悉,還是最好不要亂改的好。不過話又說回來,不去測試和實作就無法知道自己能做到怎樣的地步和境界,所以就大膽的試試看吧,大不了就重新再做過表單,這都是經驗的累積。
以上就是這一次的 wp 筆記,讓我做筆記,好讓大家不忘記,感謝大家 !
contact form 7 簡單說明
Contact Form 7 可管理多份聯絡表單,也能透過簡單的標記靈活地自訂表單及郵件內容。表單支援 AJAX 傳送方式、CAPTCHA、Akismet 垃圾留言篩選等功能。
依照預設設定,這個外掛及其程式碼並不會進行以下行為:
以匿蹤方式追蹤使用者。
將任何形式的使用者個人資料寫入安裝外掛的網站的資料庫。
將任何資料傳送至安裝外掛的網站之外的外部伺服器。
使用 Cookie。
補充說明 :
如果用不慣免費的這表單外掛,可以參考 WP From ,這也是一個表單外掛,但功能會更方便好用,目前有免費版本和付費版本,付費的版本自然就有更多的外掛功能可以使用,如果您只是需要一個簡單的表單外掛,那這一個外掛就相當適用了。
但是,是的又是一個但是,若您有使用 elementor 頁面建構器,那就可以減少一個外掛安裝,因為 elementor 頁面建構器有表單元件可以應用,簡單的表單是可以應付自如,可客製調整修改的地方也滿多的。
contact form 7 附加外掛介紹 :
- Contact Form CFDB7 – 將表單提交保存到自定義資料庫中,並可以搜尋和匯出。
- Contact Form 7 Honeypot – 增加隱藏的假字段來防止垃圾留言。
- Contact Form 7 Datepicker – 新增日期選擇器字段。
- Contact Form 7 Multi-Step Modal – 支援分步驟的表單。
- Contact Form 7 PayPal Extension – 整合 PayPal 支付功能。
- Contact Form 7 Dynamic Text Extension – 支援動態文字,根據選項改變顯示內容。
- Contact Form 7 Conditional Fields – 根據前面選項顯示或隱藏後面的字段。
- Contact Form 7 Math Captcha – 增加簡單計算驗證碼。
- Contact Form 7 – MailChimp Extension – 將表單數據同步到 MailChimp。
使用附加外掛可以讓主外掛擴展更多功能,有需要的學友們可以參考看看 !