WordPress Skill – Contact7 + WP mail SMTP

簡介

這篇來說明一下怎樣來用你的網頁建立最Light SMTP的功能。使用目的是在你網頁中可能會包含了聯絡我們的頁面,我們必須回覆客戶:『我們收到你的反饋,我們會盡快回復你』,當然不能用最土法煉鋼法一封一封回覆,所以我們透過WP提供了很多好用的外掛來應付此狀況。

Install Contact7 + WP Mail SMTP

我們先到Plugin->Add New來搜尋上圖的這兩個外掛,安裝好後並Activate他們兩。

WP Mail SMTP + Google APIs Console Setting

安裝好後我們先來設定WP Mail SMTP有關回覆系統設定,我們最常用的mail server應該就是google吧,那我們進入WP Mail SMTP頁面時會看到如上圖二中的畫面,就二話不說點選Google選項吧。接著可以看到下面會跳出Gmail的Client ID 與Client Secret但我們不知道這是什麼或是要怎麼有這些資料,說明一下,要使用google mail service需要到Google API Console來申請一組API來處理你的mail server function。你可以想像就是去google申請一個機器人來回覆你的信,這樣想就比較簡單一點。

如上圖所示,大家可以依照圖片中的數字來步驟性的完成申請Google API Console並得到Client ID & Secret來貼回到自己的WP網頁。首先當然我們第一次造訪APIs網頁是沒有任何專案下就必須新增一個。
請按下1.繼續。2.前往憑證

3.選擇Gmail API (因為是要透過Gmail SMTP來回覆客戶的信,且這方法最快最有效)。4.選擇網路伺服器5.選擇使用者資料,最後點選我需要哪些憑證按鈕,接續到下一張圖。

6.為你的API命名7.請回到你的WP Mail SMTP 設定頁面將Authorized redirect url網址複製下來貼到上圖7的箭頭處。讓API可以與此外掛做連結。

8.設定授權頁面,請按下Set up Consent Screen。9.設定授權畫面細部,請在應用程式名稱寫上授權頁面的名稱,下方也可以上傳你的網站Logo圖樣,支援電子郵件就輸入你自己的mail account。10.填入您網頁的Domain web site在此頁面的每個空格中,完成後請按下儲存

11.儲存完畢後系統會跳到上個頁面,請按下Refresh,假如出現右圖畫面則代表通過了Google的審核了,毫不猶豫按下“建立”OAuth”用戶端ID。

12.系統將產生Client ID給你,但先不要下載,因為我們還需要另一個Secret序號,請按下稍後再下載。

13.我們就快完成了,請回到你憑證的頁面,在下方表格會多出來你剛剛新增好的憑證項目,請點選上圖紅色箭頭處有隻筆的按鈕,他將會把你的ID與Secret顯示給你。拿到之後就貼回去WP Mail SMTP Setting頁面吧。

14.請按下下面那橙色的按鈕,用意就是從你的網頁開通憑證的功能,告訴Google你要開始使用此功能,請他確認並連結。15.選定你的gmail(最好是空的比較多SMTP容量)。16.一直按允許即可

17.可以看到上圖,當你的此按鈕變成這個顏色代表你所有東西都設定好囉!

當我們設定完成後最好還是做一下測試,看看其中的任督二脈有沒有被打通,請點選WP Mail SMTP的Dashboard上方功能欄點選“Email Test”,輸入你目的地的信箱,並按下Send Email,最後我們真的有收到他寄的信件,代表這一端都Ready了。

Contact7 Form Setting

還記得我們還有安裝一個叫做Contact7的外掛嗎,這外掛就是可以讓你新增Page時可以選擇該外掛所提供的Templete,我們可以先用預設欄位新增到一個空白頁面做測試。在測試之前我們先設定一下你的回復郵件裡面要包含什麼內容。
如上圖所示,在To的地方,由於我們要做測試郵件所以請填入你自己的信箱,From的話他會自帶參數進來,在這他提供了類似小功能快的Shortcode讓使用者填入信箱內容中,例如[your-name] , [your – email] , [your – subject]等等,就請大家自行運用了。

都設定好之後我們到我們前端網頁來嘗試看看吧,如上圖所示,在前端假如成功寄出的話會出現notification的綠色框框訊息,代表你的信件已經成功寄送,最後我們檢查一下自己的信箱,果真收到了。

小結

其實還有更多的方式可以實現這篇所講述的功能,例如去租一個網路空間專門處理回覆信件的啦,或是自己硬刻程式碼+做一堆繁瑣的設定等等,但我個人覺得最快的方法就是運用WP的Plugin來實現之,當然是免費最好,有機會可以嘗試看看付費的Mail SMTP。

發佈留言

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