一、功能简介

您的独立站添加聊天插件后，无需跳转其他页面，在您的独立站页面即可自动回复访客消息，提升聊单率；不仅如此，还可以在聊天插件添加引流部件，访客点击即可跳转至对应引流渠道展开会话，达到引流营销、分流答疑的增益效果。

由此可见，添加聊天插件可以解决许多客服需求场景，本篇文章将讲解如何添加及编辑聊天插件。

二、操作流程

1.添加聊天插件

在集成处>点击聊天插件>点击添加插件，即可进入编辑添加界面。

2.编辑聊天插件

进入聊天插件的编辑界面，可见主要分两块区域。左侧为设置区，分别为：样式设置、信息调查、高级设置、入口集成；右侧为预览区。

当您在设置区编辑聊天插件的过程中，可以在右侧的预览区实时预览您编辑好的插件样式，方便您进行插件编辑。

下面将结合预览区详细介绍设置区的各个分区内容。

2.1样式设置

样式设置：设计插件的样式，包括插件名称、聊天背景框颜色、头像、窗口标题、窗口副标题、语言、插件位置等；

•插件名称：指该插件的命名（仅客服见）。

•主题颜色：您可自定义插件展开后的主背景，如下图所示。

•商家logo：指插件上方标题左侧的头像。

•机器人头像：指回复访客时，机器人的头像。

•语言：您可以设置插件内提示语的语言，提示语包括提示、按钮名称、错误反馈等展示语言。

•入口及聊天窗位置：可设置和插件/侧边栏显示在网站左侧还是右侧。

•对话窗口标题：指插件上方的标题。

•对话窗口副标题：在窗口标题的下方，起到辅助补充说明的作用，可自定义开启。

对话窗口副标题还支持针对客服是否在线切换显示副标题内容。

•公告栏：您可设置类似优惠广告、人工服务时间等需要客户关注的内容在公告栏展示。您还可以设置公告栏的颜色、内容链接等个性化设置，帮助您实现精准营销。

•移动端聊天穿展示：您可以设置在移动端聊天窗展开时，是否铺满手机屏幕。

•自定义图标：分为默认图标和选中图标，默认图标指：非鼠标悬停时的样式；选中图标指：用户鼠标悬停或点击图标时的样式。系统自带默认样式，如下图左侧显示，您可自定义两种样式。

•图标大小：指在页面显示的聊天插件大小，您可以设置小中大三个样式。

•底部距离：指插件/侧边栏距离网站底部的高度，可设置0px-500px。

•入口图标收起：默认为图标不收起，如下图左上角展示；启用图标收起，用户进行图标折叠操作；您可设置两种样式，收起为侧边栏或收起为单个图标。

•您还可编辑侧边栏文案以及设置PC端和移动端的隔离显示样式。

2.2信息调查

信息调查：通过设置“聊前调查”和“离线留资”，可以收集用户的名称、手机号码、邮箱等。

•聊前调查：开启聊前调查后，您的访客展开聊天窗口时，需填写您设置的调查信息，填写后才能发送消息给您；

•离线留资：开启离线留资后，当目前没有客服在线时，需填写您设置的调查信息，填写后才能发送消息给您。

两者对比，聊前调查偏向开始会话前必须留下客户信息，离线留资偏向于没有客服在线时的收集客户信息手段。

聊前调查和离线留资都支持最多添加4个字段，包括邮箱、名称、公司名称、手机号码四个字段。且可设置是否为必填项。点击右边叉叉可对字段进行删除调整。

•留资按钮：开启后，聊天窗口会出现留资按钮，访客可自主点击来填写信息。

•强制弹出：开启后，访客无法自主关闭留资窗口，强制填写（不开启，访客可自主选择关闭，跳过留资）。

2.3高级设置

可以设置插件显示设置，并可设置未读消息预览和会话转人工等内容。

•未读消息预览：开启时，当您的聊天插件未展开时，可在图标旁显示第一条访客未读的消息，可支持展示第一条未读消息还是展示最新一条未读的消息。

•插件显示设置：当您把插件安装至您的独立站或者网页时，插件会默认在您的独立站各个页面均显示。您可以通过显示配置，配置您哪些页面需要显示插件、哪些页面不需要显示插件，移动端同理。

•自动展开：您可以设置当用户进入网站之后多少的时间自动展开聊天窗口，方便用户进行第一时间咨询商品，以及新用户自动打开等智能设置。

•窗口状态：当访客关闭您的网站或者切换到其他网站时之后又返回您的网站时，聊天插件窗口保持之前展开或者收起的状态。

•转人工按钮：若您开启了机器人自动托管功能，访客会优先由机器人接待，在机器人接待的访客展开聊天窗口时，将显示转人工按钮，访客点击可将会话从【机器人】状态切换未【未分配】状态。

2.4入口集成

可以在网页中显示多个聊天挂件，包括我们的客服插件、messenger、Line、Whatsapp、Email等，从而会显示下图网页的聊天挂件，帮助您达到引流的效果。

2.5保存

编辑好聊天插件后，点击保存，即可编辑成功。

3.安装插件

设置好插件后，便可将插件安装在您的网站上了，安装方式如下：

•若是自建站点，可以通过JavaScript代码在网站安装SaleSmartly

3.1复制代码

•在【集成】—【聊天插件】，在列表中选择您所想要安装的插件，复制其代码；

•或者在【集成】—【聊天插件】—【编辑插件】处右上角点击安装至网站，也可以查看到代码。

3.2 自建站点安装SaleSmartly

访问站点托管的服务器后，找到包含标签的文件（一般为index，具体请咨询站点的开发工程师），打开文件，在标记前粘贴上JavaScript代码，保存更改生效即可成功安装。

•可以将插件安装各站点上，包括在Shopline、Shoplazza、Shopify、Shopyy等，具体见：

如何在独立站安装SaleSmartly

下列展示如何在您的ShopLine应用商店中安装SaleSmartly，其它独立站同理：

聊天插件集成