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

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

最近更新 Apr 29, 2022 | 發佈日期 Mar 31, 2021

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

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

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

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

為什麼要使用FB Messenger?

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

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

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

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

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

如何使用FB Messenger 內嵌代碼

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

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

1.開啟粉絲專頁收件匣

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

2.點選洽談外掛程式

fb messenge 洽談外掛程式

3.進行相關設定

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

這部份可以看到4個區塊

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

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

區塊②開始對話

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

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

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

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

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

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

區塊④ 洽談外掛預覽

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

4.FB Messenger 內嵌代碼取得

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

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

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

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

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

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

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

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

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

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

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

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

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

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

如何進行FB Messenger外掛設定

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

在安裝完成後選擇【啟用】,即會在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我在網站建置時,會持續去注意的地方。

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

其他推薦內容

WP Table Builder好用的Table表格外掛推薦

WP Table Builder好用的Table表格外掛推薦

近期在協助客戶架設網站時,因為需要表格來整理資訊。查到這一款Table外掛WP Table Builder,很好使用,呈現的效果很不錯。簡單整理使用方式,提供給有需要的你。

ShortPixel免費圖片壓縮工具

ShortPixel免費圖片壓縮工具

你常因為照片過大,讓網站的載入速度變慢嗎?想加快網站圖片的速度,卻找不用到的工具嗎?推薦這款許多人在使用的shortpixel,肯定能解決大部份的煩惱喔。

站長: Joyy志強

網路行銷玩家 | 期待透過更多免費的分享,讓更多人學到如何有效的從網路上建立屬於你自己的收入來源。 如果你也有好的網路賺錢項目,或想學習建立收入的方式,開始搭建一個可以為你賺錢的網站,歡迎透過下方聯絡我的方式和我洽談與聯絡喔。

2022 WordPress網站建置影音教學

WordPress 網站建置影音教學

免申請、免註冊會員、立即學習、持續更新。幫助你透過詳細的教學內容,一步步完成屬於自己的網站

折扣優惠推薦

Divi theme 推薦

Follow Joyy

0 Comments

Submit a Comment

發佈留言必須填寫的電子郵件地址不會公開。

error: 本站內容具著作權保護!