|  开放平台
1
悬浮聊天框效果

客户在原网页上的悬浮框与客服沟通,如下图所示:

img_04.png

2
为企业网站添加在线客服入口

复制HTML代码 > 粘贴至企业网站代码中

粘贴在线客服页面代码至网站

假设想要将在线客服放在如下图网页中,只需把复制的HTML代码粘贴至网站代码的任意位置中(推荐置于body标签内的最下方),例如:

<body>
                     ……
                     <script src="http://ci-ziker.yun.pingan.com:5000/webim/?channel=WEBIM&authorizerAppid=webim2c83aec0a&eid=6581c81b0d13fbb">
                     </script>
                   </body>

粘贴在线客服页面代码至网站

3
自定义样式

悬浮聊天框支持企业自定义样式。在以上代码中写入相关样式属性即可,示例和效果图如下:

<body>
                      ……
                     <script src="http://ci-ziker.yun.pingan.com:5000/webim/?channel=WEBIM&authorizerAppid=webim2c83aec0a&eid=6581c81b0d13fbb"                    width="800" height="700" theme="red">
                     </script>
                   </body>

企业可以自定义在线客服悬浮框样式

4
自定义参数

如企业想要在链接中传入业务参数,需按照以下标准开发,在网页IM的链接中传递相关参数。

自定义参数:

参数名描述是否必填
cid企业识别客户的唯一id
headimgurl头像
nickname昵称
sex性别(F/M)
mail邮箱
tel电话
msgInfo首次打开IM发给坐席的inbound消息

默认参数:

参数名描述
eid企业id
channel渠道号
authorizerAppid业务id

默认参数为自动生成的url中自带的参数,不可更改或删除。自定义参数为企业选传的参数,不带自定义参数时为匿名客户。自定义参数中cid为必                    传项,为该客户在企业系统中的唯一ID,不传该参数将无法识别此客户。

传参示例:

http://ci-ziker.yun.pingan.com:5000/webim/?msgInfo=nihao&channel=WEBIM&authorizerAppid=webim2c83aec44342e0a&eid=6581c81b0d14945da049db5e474d3fbb&cid=100419&headimgurl=http://wx.qlogo.cn/logo.jpg&nickname=weixin008&sex=M&mail=dahuanfu896@pingan.com&tel=1561

坐席工作台上相应看到的内容如下图:

客服看到在线客户信息页面展示

5
开放接口

如企业想要传入业务参数,需按照以下标准开发,可往悬浮聊天框中传递相关参数。

  • 传递商品信息

    cikeTalk.api.setProductInfo('{"url":"商品链接","image":"商品图片链接","title":"商品标题","description":"商品描述"}')

    示例:cikeTalk.api.setProductInfo('{"url": "http://kefu.pingan.com/index.html","image": "http://kefu.pingan.com/images/product_04.jpg","title": "平安客服云-在线客服","description": "¥1899.00元/坐席/年"}')