Logo Site EngageLab Mark Colored Transparent文档
搜索

Website

LiveDesk 支持将 Website Channel 的聊天小部件添加到网页中,用于承接访客咨询、分配会话,并在网站内提供实时对话能力。

实时聊天小部件适用于大多数现代浏览器。以下是支持的浏览器版本:

浏览器
Mozilla Firefox:v52 及以上
Google Chrome:v57 及以上
Chromium:v57 及以上
Apple Safari:v14.1 及以上
Microsoft Edge:v16 及以上

如何添加 Website 通道

“添加通道”-“Website”

create_whatsapp.png

输入配置信息

按照界面提示完成 Website Channel 的基础信息填写,点击“确认”即可创建通道。创建完成后,可继续在“集成”“设置”“小部件生成器”“对话分配”“Human Agent”“AI Agent”等页签中完成后续配置。

按照界面提示进行配置信息填写,完成点击“确认”即可。

website_param.png

配置信息 说明
网站名称 网站名称
网站域名 设置接收客户信息的域名地址。e.g. www.example.com
标题 接收信息窗口部件标题
标签行 欢迎语
开启Channel问候功能 当客户发送消息开启对话时是否自动发送问候语
添加客服代理 指定分配的客服代理

添加聊天部件到网站

创建完成后,页面会跳转到该通道的详情配置页。在“集成”页签中可以复制页面生成的代码片段,并粘贴到您的网站中完成安装。

当前支持以下安装方式:

安装方式 说明
气泡代码 在网页中嵌入标准聊天气泡代码,适用于大多数场景
iframe 代码 以 iframe 方式嵌入聊天窗口,适用于需要独立容器承载的场景
GTM 安装 通过 Google Tag Manager 部署聊天代码

详细设置

向下滚动查看更多设置,您可以在这里完成 Website Channel 的集成、基础设置、预聊天表单、工作时间以及小部件外观等配置。

集成

“集成”主要提供实现小气泡代码集成的方法以及相关安全设置。

  • Messenger 脚本

    支持在“气泡代码”“iframe 代码”“GTM 安装”三种方式之间切换,并复制对应的安装代码。代码中会包含当前 Website Channel 对应的 websiteToken 及运行所需的 sdk.js 引用地址。

messger.png

  • 用户身份验证

    默认关闭。启用后页面会显示身份验证相关的密钥信息,可复制后用于服务端生成访客身份校验参数,提升用户身份可信度。

identity.png

  • 区域白名单

    默认关闭。启用后仅允许白名单中的域名初始化 Website 小部件,多个域名请按行分隔填写。本地调试时需要带上端口号,例如:localhost:3000127.0.0.1:8080

whitelist.png

设置

配置 Website Channel 的基础参数、访客交互方式以及预聊天表单。

  • Channel 信息

    支持修改当前 Website Channel 的名称。

  • 开启 Channel 问候功能

    默认关闭。启用后,当用户首次发起咨询时,系统会自动发送默认回复消息。

  • 快捷指令

    默认关闭。启用后,会在聊天窗口输入框上方固定显示快捷指令标题,引导用户快速发送高频问题。支持新增多条快捷指令,建议用于常见问题、咨询入口或分流提示。

  • 启用 CSAT

    默认关闭。启用后,当对话状态变更为“已解决”时,会向用户发送一份满意度调查,用于收集服务评价。

basicsetting.png

  • Email 采集

    支持以下两项配置:

    • Email 采集框:在对话开始时自动向用户展示 Email 采集输入框,但不强制填写。

    • 对话连续性:当用户离线时,可通过 Email 继续与用户保持对话。使用该功能前,需要先完成 Email Channel 的相关配置。

  • 用户行为控制

    支持“用户结束对话”配置。启用后,用户可主动在小部件中结束当前对话,系统会将对话状态流转为“已解决”。

othersetting.png

  • 预聊天表单

    预聊天表单已移动到“设置”页签中统一配置。启用后,用户在正式进入聊天前需先填写表单内容。

    支持配置以下内容:

    • 表单正文:用于说明表单用途,例如“您好,请您填写下方内容,方便我们联系您”。

    • 表单选项:支持逐项配置表单字段,包含“启用”“变量名”“变量类型”“名称”“占位符”“必填”等参数。

    • 系统预置字段:支持 emailphonefirstnamelastname 等常见字段。

    • 对话属性字段:支持选择已有对话属性作为预聊天字段,提交后写入对应会话属性。

    • Email 字段:可用于追踪访客身份,也可用于后续转人工或离线联系。

prechatting.png

  • 工作时间

    默认关闭。启用后,可为当前 Website Channel 配置工作时间、时区以及非工作时间说明文案。非工作时间内,系统会根据配置内容提示访客当前暂不可用,并结合会话分配规则处理人工接待。

worktime.png

小部件生成器

“小部件生成器”用于配置访客端聊天组件的外观和展示内容,右侧预览区域会实时展示配置效果。

  • 主题设置

topic.png

支持配置以下参数: * 主题颜色:设置小部件主色。 * 文案颜色:设置标题、正文等文案的展示颜色。 * 背景图片:支持上传并替换欢迎区域背景图。 * 宽度:设置小部件宽度,默认 400。 * 高度:设置小部件高度,默认 700。
              
              支持配置以下参数:

*   主题颜色:设置小部件主色。
    
*   文案颜色:设置标题、正文等文案的展示颜色。
    
*   背景图片:支持上传并替换欢迎区域背景图。
    
*   宽度:设置小部件宽度,默认 400。
    
*   高度:设置小部件高度,默认 700。

            
此代码块在浮窗中显示
  • 气泡设置

bubble.png

支持配置以下内容: * 气泡样式:支持“图标”“图标+文字”“文字”三种显示模式。 * 图标:可替换默认图标。 * 文字:当选择“图标+文字”或“文字”样式时,可配置气泡文案。文字长度不可以超过20个字符。 * 大小:支持迷你、小、中、大、超大等不同尺寸。 * 气泡位置:支持设置展示位置,并可配置距离底部和距离侧边的间距。
              
              支持配置以下内容:

*   气泡样式:支持“图标”“图标+文字”“文字”三种显示模式。
    
*   图标:可替换默认图标。
    
*   文字:当选择“图标+文字”或“文字”样式时,可配置气泡文案。文字长度不可以超过20个字符。
    
*   大小:支持迷你、小、中、大、超大等不同尺寸。
    
*   气泡位置:支持设置展示位置,并可配置距离底部和距离侧边的间距。
    

            
此代码块在浮窗中显示
  • 欢迎语

welcome.png

支持配置: * 标题:欢迎区主标题。 * 内容:欢迎区正文内容。 * 引导语:显示在“即时解答”区域,用于引导用户快速开始咨询。
              
              支持配置:

*   标题:欢迎区主标题。
    
*   内容:欢迎区正文内容。
    
*   引导语:显示在“即时解答”区域,用于引导用户快速开始咨询。
    

            
此代码块在浮窗中显示
  • 社交媒体

sns.png

默认关闭。启用后可配置社交平台或联系渠道,并展示在小部件欢迎卡片中。
              
              默认关闭。启用后可配置社交平台或联系渠道,并展示在小部件欢迎卡片中。

            
此代码块在浮窗中显示
  • 提交工单

ticket.png

默认关闭。启用后,小部件中会显示工单入口,允许用户查看或提交工单。
              
              默认关闭。启用后,小部件中会显示工单入口,允许用户查看或提交工单。

            
此代码块在浮窗中显示
  • 外链

url.png

默认关闭。启用后可新增外链卡片,用于展示外部帮助中心、FAQ 页面或其他跳转入口。
              
              默认关闭。启用后可新增外链卡片,用于展示外部帮助中心、FAQ 页面或其他跳转入口。

            
此代码块在浮窗中显示

对话分配

显示当前通道对应的会话分配规则。支持路由规则、AI Agent 以及 Human Agent 响应。会话分配优先级排序为:路由规则 > AI Agent > Human Agent。

当存在路由规则时,系统会优先判断是否满足路由条件;若同时存在多条规则,则按照顺序依次匹配。若当前会话不满足任何路由规则,则优先分配给 AI Agent;当未配置 AI Agent 时,再分配给对应的 Human Agent。

支持自动分配,并提供按并发负载分配、按顺序平均分配机制以及按照客服自定义负载分配机制。

  • 按负载分配机制

按照定义的负载数量进行分配,优先分配给低并发负载的客服

  • 按顺序平均分配机制

不考虑每个客服的负载设置,按照顺序平均给每个客服分配对话。

  • 按客服自定义负载分配机制

为每个客服单独设置自定义负载数值,优先分配给低并发负载的客服。

conversation_collabor5.png

Human Agent

支持设置处理该通道会话消息的人工代理,可添加或移除成员。

set_Humanagent5.png

AI Agent

支持设置处理该通道会话消息的 AI 代理,可启用或停用,并支持添加 GPT AI Agent。

set_aiagent5.png

Icon Solid Transparent White Qiyu
联系销售