在您的 WordPress 網站上新增網路聊天小工具是一個快速且簡單的過程。 它不需要任何編碼技能或技術知識。
安裝設定
為了在 WordPress 上安裝網路聊天小工具,您需要以下內容:
造訪您的網站的 WordPress 儀表板。
您的網路聊天小工具的程式碼片段。
如果您還沒有代碼片段,您將在創建 Respond.io 網站聊天小工具 或使用 Facebook 聊天插件 為 Facebook Messenger 時生成一個。
如果您已在 respond.io 平台上連接頻道,並且需要檢索生成的程式碼片段,請按照此處 的說明進行操作。
為了成功安裝,請確保填寫了您的網站網域。 有兩種方法可以解決這個問題。
轉到 respond.io 設定 > 選擇 頻道 > 選擇你的網站聊天頻道 > 點擊配置 > 添加網站域名。
轉到 respond.io 設定 > 選擇 增長小部件 > 點擊要添加到網站的小部件 > 在 常規 開關中,將你的網站域名添加到 網站域名 欄位。
在 WordPress 上安裝
步驟 1:登入 WordPress
導航至您網站的 WordPress 管理儀表板並登入。
第 2 步:導覽至插件頁面
在左側導覽面板中,點選 外掛程式。 在外掛頁面上,按下頁面頂部的藍色 新增 按鈕。
步驟 3:新增插件
使用搜尋欄,搜尋 WPCode 外掛程式。 您將在搜尋結果頁面上看到許多可用的選項,但在本教學中,我們將使用 WPCode 的 "插入頁首和頁尾" 外掛程式。 按下 立即安裝 按鈕並確保啟動插件以使用它。
步驟 4:開啟頁首和頁尾控制台
從左側導覽選單中,按一下程式碼片段,然後從子選單中選擇 頁眉 & 頁腳 。
步驟 5:新增即時聊天腳本
從 respond.io 複製您的外掛程式腳本並將其貼到頁首和頁腳控制台頁面的 頁腳腳本 區域中。
貼上腳本後,點擊頁面底部的藍色 "儲存" 按鈕。
完畢!
打開網站並查看聊天插件。 您會在右下角找到它。 現在您的網站訪客可以輕鬆地與您聊天。 如果您使用了從 respond.io 平台產生的程式碼片段,您將能夠從平台管理對話並更新小工具的外觀。
聊天小工具現在在您的網站上處於活動狀態!
識別登入用戶
本節僅適用於您的網站具有使用者登入功能的情況。
步驟 1:登入 WordPress 帳戶
導航至您網站的 WordPress 管理介面並登入。
第 2 步:開啟主題頭文件
從左側導覽功能表中,點選 外觀 並選擇 主題檔案編輯器。 繼續選擇 主題標題 檔案。
步驟 3:新增檢索到的使用者 ID 和姓名代碼
複製下面的範例程式碼並將其貼上到主題頭檔中。 貼上程式碼後,點擊頁面底部的 更新檔案 按鈕。
下面的範例程式碼是從 WordPress 取得使用者 ID、名字和姓氏。 如果您想獲得其他聯繫字段,請隨意修改。
<?php
$user_info = get_userdata(get_current_user_id());
?>
<script type="text/javascript">
窗口。$wp_ID = "<?php echo $user_info->ID; ?>";
視窗。$wp_firstname = "<?php echo $user_info->first_name; ?>";
視窗。$wp_lastname = "<?php echo $user_info->last_name; ?>";
</script>`
步驟 4:開啟頁首和頁尾控制台
從左側導航選單中,點選 設定 並從設定的子選單中選擇 頁眉 & 頁腳 外掛。
步驟 5:新增識別登入使用者腳本
複製下面的範例程式碼並將其貼上到頁首和頁腳控制台頁面的 頁腳腳本 區域中。 請注意, 辨識登入使用者腳本 必須放在 即時聊天腳本上方。
下面的範例程式碼使用使用者 ID 作為標識符,並傳遞名字和姓氏。 如果您想獲取其他聯絡字段,請隨意修改。
<script>
window.\_\_respond\_settings = {
identifier: $wp\_ID,
firstName: $wp\_firstname,
lastName: $wp\_lastname,
};
</script>貼上腳本後,點擊頁面底部的藍色 "儲存" 按鈕。
完畢!
打開網站並查看聊天插件。 可以識別您 WordPress 的登入使用者。 一旦傳遞的標識符與現有聯絡人匹配,當前對話就會恢復。
常見問題和疑難排解
WPCode
如果您正在使用 WordPress 快取外掛(例如 WPCode),請按照以下步驟操作,以便小工具正確顯示。
禁用 JavaScript 的資料最小化功能
轉到 WordPress 設定 > 選擇 WPCode > 在 WPCode 頁面上,選擇 檔案優化 標籤 > 取消勾選 最小化 JavaScript 檔案。
將我們的小部件域加入到 Javascript 排除檔中
https://cdn.respond.io/webchat/widget/(.*).js
儲存後,建議清除 WordPress 中的快取。