網(wǎng)頁在線聊天如何實現(xiàn)

摘要

網(wǎng)頁在線聊天是企業(yè)網(wǎng)站中常見的客服對話溝通功能，通過獲取在線客服的js代碼添加到網(wǎng)頁html中進(jìn)行調(diào)用，頁面會為瀏覽網(wǎng)頁的用戶自動生成在線聊天窗口，本文將介紹該功能的實現(xiàn)過程。

什么是網(wǎng)頁在線聊天

網(wǎng)頁在線聊天是網(wǎng)站用戶與客服人員通過網(wǎng)頁提供的迷你對話框進(jìn)行網(wǎng)頁內(nèi)實時聊天溝通的功能，主流的網(wǎng)頁在線聊天功能是通過網(wǎng)頁調(diào)用js代碼的方式來實現(xiàn)的，通常用于企業(yè)網(wǎng)站中客服人員提供在線咨詢服務(wù)時使用。

網(wǎng)頁在線聊天

如何實現(xiàn)網(wǎng)頁在線聊天

網(wǎng)頁在線聊天的功能對于企業(yè)來說相當(dāng)容易實現(xiàn)，只需要找到一款在線客服聊天軟件進(jìn)行功能代碼的生成，緊接著將代碼添加到網(wǎng)頁html中進(jìn)行調(diào)用就可以了。本文就以支持永久免費(fèi)的快商通為例，教大家如何快速為企業(yè)網(wǎng)站實現(xiàn)網(wǎng)頁在線聊天。

1、借助在線客服聊天軟件獲取功能代碼

下載快商通并打開軟件，找到“設(shè)置中心”-“站點管理”，添加綁定你的網(wǎng)站域名地址。再找到“設(shè)置中心”-“代碼生成”，選定綁定的網(wǎng)站和終端類型（PC或移動），就能獲取系統(tǒng)自動生成的js功能代碼。

獲取網(wǎng)頁在線聊天代碼

2、讓網(wǎng)頁調(diào)用功能代碼

打開網(wǎng)站后臺，在模板管理處找到網(wǎng)站首頁和內(nèi)頁分別調(diào)用的footer模板文件并打開，將上一步獲取到的js代碼復(fù)制進(jìn)footer模板的第一行或最后一行（都可以），然后保存修改并刷新網(wǎng)站，就可以看到網(wǎng)站已經(jīng)成功實現(xiàn)在線客服聊天了。直接在頁面中的對話框輸入消息就可以在客服軟件中進(jìn)行接收。

網(wǎng)頁調(diào)用在線聊天js

3、UI樣式調(diào)整

如果想要自定義網(wǎng)頁對話框的UI樣式，可以在代碼生成頁面左側(cè)找到‘圖標(biāo)設(shè)置’功能，點擊后可以在右側(cè)對PC/移動端的浮動圖標(biāo)、分組圖標(biāo)、迷你對話框的樣式進(jìn)行調(diào)整，也可以設(shè)置對話框自動彈出的觸發(fā)條件。

調(diào)整在線聊天窗口樣式

自定義聊天對話框UI

網(wǎng)頁在線聊天功能的實現(xiàn)誤區(qū)

很多公司負(fù)責(zé)人得知網(wǎng)站需要添加在線聊天功能時，會一個勁的想要去網(wǎng)上找在線客服代碼進(jìn)行安裝，這種思路并不能獲得成功。

因為找來的代碼最多只能實現(xiàn)網(wǎng)頁在線聊天窗口的外觀，但沒有解決數(shù)據(jù)傳輸?shù)膯栴}，用戶在網(wǎng)頁中發(fā)送的消息沒辦法傳到網(wǎng)站后臺。網(wǎng)頁在線聊天需要一個服務(wù)器做數(shù)據(jù)中轉(zhuǎn)，讓客服人員在另外一個平臺進(jìn)行接收。

所以目前主流的方式就是本文提到的這種，服務(wù)商把網(wǎng)站的在線客服聊天功能封裝打包成一個js代碼，企業(yè)網(wǎng)站只要在網(wǎng)頁中加入這串js代碼就可以自動生成聊天窗口，樣式可以在后臺自定義，瀏覽網(wǎng)站的用戶發(fā)送的消息會直接經(jīng)過服務(wù)器發(fā)送到客服登錄的客服軟件中，實現(xiàn)了在線客服聊天的整個完整過程。

總結(jié)：

借助快商通進(jìn)行js功能代碼生成，并將代碼添加到footer模板中讓網(wǎng)頁加載時被調(diào)用，就可以輕松實現(xiàn)網(wǎng)頁在線聊天的功能效果了，此方法是目前企業(yè)網(wǎng)站比較主流的實現(xiàn)方式，適合所有的網(wǎng)站使用。