Facebook Messenger 是將即時聊天工具嵌入你的網站的最簡單方法! 聊天工具是和你的訪客 Facebook 帳號相連結的,這樣他們總是可以打開聊天窗口。
以下是你的訪客會在你的網站上看到的樣式:
你需要:
- Strikingly 專業版帳號
- 帶 HTTPS 安全證書的自訂功能變數名稱(在這裡瞭解如何添加 https)
- Facebook 專頁(Facebook Page)(瞭解如何創建)
- Facebook App ID (瞭解如何獲得)
都有了嗎?太好了,那我們開始吧!
1. 獲得你的 Facebook App ID。
這是一串長號碼。例如,Strikingly 的 App ID 是 138736958550286。你可以在這個頁面看到你的 AppID:https://developers.facebook.com/apps/。
2. 獲得你的 Facebook Page ID。
這也是一串長號碼。例如,Strikingly 的 Page ID 是 211998345516663。要找到你的 Page ID,首先你進入你的 Facebook Page,點擊左邊的“About”標籤,然後拉到最下方:
3. 添加你的網站。
打開 Facebook Page 的“設定”,在左邊找到“Messenger 平台”,然後在右側的“一般設定” > “Whitelisted Domains” 這裡輸入你的網址。前面必須加上https://。然后按下「Save」來保存設定。
4. 使用自訂代碼將 Facebook Messenger 嵌入你的網站。
將以下代碼複製到你的編輯器 > 設定 > 高級選項 > 自訂代碼 > 頁腳代碼。請記得將以下紅色字體換成你的 Facebook App ID 和 Facebook Page ID!
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID',
autoLogAppEvents : true,
xfbml : true,
version : 'v2.11'
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js";;
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="fb-customerchat"
messenger_app_id="YOUR_APP_ID"
page_id="YOU_PAGE_ID"
ref="test">
</div>
5. 發布你的網站!
這樣你就可以在你的網站的右下角看到 Facebook Messenger 即時聊天了。
如果有任何疑問,請隨時連絡我們:support@strikingly.com 。
你也可以透過 即時聊天客服 連絡我們,服務時間為:周一至周五,早上9點至晚上9點。