【教學】如何在網站加入FB-Messenger讓訪客和你立即聯絡

【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡

使用 fb 聊天室外掛,讓你快速地在網站上與客戶直接對談,減少客戶跳脫網頁的機會。

用 fb 聊天室外掛和客戶對談時,除了可以立即回答客戶的問題之外,還可以在 fb 上留下下一次和客戶接觸的機會。過去如果只留下電話,可能有些訪客可能因為不想留電話而失去一個服務客戶的機會。

現在使用 fb 聊天室外掛,就可以大大減少這個問題的發生,而對於訪客來說,留下問題詢問的意願也會大大提高。

在這篇文章中,我將用最簡單的步驟,讓你快速地在網站中安裝好 fb 聊天室外掛。

為什麼要使用 FB Messenger?

【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger

以上圖來看,在網頁中顯示出可以直接與粉絲專頁對話,主要的目的有以下三點

  • 讓訪客直接與網頁主人聯絡
  • 增加訪客互動與訪客留存率
  • 提高下次再行銷的機會

在WordPress裡,只使用這個外掛,就可以簡單達到這個目的,真的十分推薦使用喔。

在近期Facebook粉絲專頁本身已提供了【內嵌代碼】與【WordPress 外掛】的方式來進行,這裡比較推薦使用內嵌代碼的方式來進行喔。

如何使用 FB Messenger 內嵌代碼

使用內嵌代碼的好處,就是可以讓你的網頁在載入時,可以以較快的方式載入完成。WordPress 裡只要外掛使用的少,一定可以某種程度上,讓網頁載入的時間變好。所以當然是推薦使用代碼的方式來進行這項功能的安裝喔。

現在就跟著以下的步驟來進行吧。

1. 開啟粉絲專頁收件匣

【教學】如何在網站加入FB Messenger讓訪客和你立即聯絡_12

2. 點選洽談外掛程式

【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger

3. 進行相關設定

【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger

這部份可以看到 4 個區塊

區塊 ① 設定你的洽談外掛程式

這部分需要一些版面,我留到 ② ③ ④ 區塊說明完之後來補充。

區塊 ② 開始對話

【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger

這部分主要是用在設定於訪客在點開你的洽談外掛時,你所想要給他看到的歡迎訊息與常見問題。在常見問題裡,可以用自問自答的方式,讓訪客可以快速了解服務的相關內容。

區塊 ③ 打造專屬的洽談外掛

【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger

這部分分為四個設定,分別是:

  • 問候語:這是用來在訪客還沒開啟對話時,你想讓訪客看到的歡迎語。
  • 訪客洽談:這裡是個開關,主要讓訪客不必登入 Messenger 就可以留言對話,但 Joyy 在這是沒有開啟訪客功能,主要還是在實務上,因為留言的訪客如果沒有登入,我未能及時回覆的話,訪客就離開對話了,這樣我也無法再次留下訊息,所以我個人的實際經驗上,是不會開啟訪客的。
  • 自訂色彩:可用來把洽談外掛設定成和網站同色系,來讓訪客看起來都是一致性的。可以依需求自行調整。
  • 對齊:就是用來設定洽談外掛在網頁上要出現的位置與是否預整設是否展開。如下圖
fb messenger 洽談外掛

區塊 ④ 洽談外掛預覽

相關的變更在修改之後,都會在這上面直接看到變更前後的結果。

4.FB Messenger 內嵌代碼取得

上述的步驟,如果你已經完成 2~3 區塊了,這裡就可以從區塊 ① 中的【設定】來取得代碼。

點擊【設定】後,FB Messenger 洽談程式外掛,就一共只有 4 個步驟的設定,如下圖。

【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger
【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger
【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger
【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger

在內嵌代碼中,步驟3可以複製已經設定好的相關程式碼,這時依照指示,把程式碼放入WordPress <body> 內嵌程式碼之中,通常只要你有使用【主題編輯器】,就一定會提供相關的位置,來供你把程式碼貼上。

以 Joyy 我的為例,我是使用 DIVI 這個主題編輯器。如果你也是和我用一樣的,你就可以到

WordPress 的後台 → 控制台 → DIVI → Theme Options → Integration

找到內鍵提供放入嵌入代碼的 <body> 區域,如下圖

【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger

代碼放置好後,按下 SAVE,這時只要到自己的首頁,就會看到 FB Messenger 洽談外掛安裝完畢囉。

如何下載與安裝 FB Messenger WordPress 外掛

你可以在點擊下方連結,即可有官方的使用說明。

點此進一步了解→Facebook 聊天室官方外掛程式

或是在 WordPress 的後台,外掛裡的下載外掛,【關鍵字】的地方輸入【facebook 聊天室】後進行直接安裝。

【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger
【教學】如何在網站加入FB Messenger讓訪客和你立即聯絡_03

如何進行 FB Messenger 外掛設定

【教學】如何在網站加入 FB Messenger 讓訪客和你立即聯絡 fb messenger
圖一

在安裝完成後選擇【啟用】,即會在WordPress後台的下方出現一個叫做【Customer Chat】的選項。如上圖圖一點擊【Setup Chat Plugin】,就可以開始進行設定了。

fb messenger 新增到網站的設定
圖二

進入設定時,會先出現【選取粉絲專頁】的畫面。如上圖二

fb messenger 新增到網站的設定
圖三

選好粉絲專頁後,接著 FB Messenger 會提示你即將把 Messenger 新增到你的網站。如上圖三

fb messenger 新增到網站的設定
圖四

這時會出現三個基本設定

  • 語言:預設是 English,再選成繁體中文即可。
  • 問候語:這是留下的第一句話,預設設定是 Hi How can we help you ?,你可以再改成你需要的。
  • 訪客洽談:這個功能還不錯,畢竟有些人可能真不想用臉書的本尊帳號和你聯絡,開啟這個功能,就可以匿名詢問事情囉。
fb messenger設定
圖五

上圖圖五,就是我某個網站的相關設定,你可以參考看看,是不是也將 FB Messenger 做類似這種設定。

fb messenger設定
圖六

再來就是一些基本外觀的設定,這個可以依你個人的需進行一些微調或調整出個人風格的。如上圖六。

fb messenger設定
圖七

完成相關流程的選項設定時,就會出現你的洽談外掛程式已準備就緒的字眼,這時就是完成囉。

很簡單吧!

如果你在安裝的過程有任何問題,歡迎你在下方留言的地方,留下你的問題,我將會盡快回覆你喔。或是直接透過 FB Messenger 和我聯絡吧!

結論

兩種方式,都各有優缺點,但仍然推薦是使用【內嵌代碼】的方式,來安裝 FB Messenger 洽談程式。原因還是主要為了讓載入速度能夠好一些,雖然有使用這類的外掛,多少都會影響速度,但如果能用代碼就用代碼,這目前是 Joyy 我在網站建置時,會持續去注意的地方。

如果你有更好的方式,也歡迎你在下方留言的地方,和我一起分享喔。

打造網路賺錢基地 實戰課程

▲ 讓你擁有一個能帶來現金流的網路賺錢基地,建立網路收入之路,實踐打造網路賺錢基地的策略與技巧 !

其他 網路行銷 相關文章推薦

About Joyy

網路行銷玩家
現任職於顧問公司擔任行銷。分享許多網路行銷與網路賺錢相關知識 ! 期待透過更多免費的分享,讓更多人學到如何有效的從網路上建立屬於你自己的收入來源。

粉絲專頁

最新文章

Udemy 線上課程

留下您的問題: