# 自定义样式
# 入口自定义
七鱼客服的系统默认入口是放在页面右下角。 如果企业需要自定义入口, 可以进行如下操作步骤:
关闭七鱼默认提供的客服入口(全局性操作,关闭后所有引用JS的页面都不会出现默认入口)具体操作如下:
管理后台-> 服务中心 -> 在线系统 -> 设置 -> 在线接入 -> 网站 -> 访客开关, 设置
停用
还有一个可以针对单个页面进行隐藏的配置,即在引入JS时添加hidden=1参数来隐藏当前页面的默认入口,样例如下:
(function (w, d, n, a, j) { w[n] = w[n] || function () { return (w[n].a = w[n].a || []).push(arguments) }; j = d.createElement('script'); j.async = true; j.src = 'https://qiyukf.com/script/044865c94981c048609d5c94c1ae9c6d.js?hidden=1'; d.body.appendChild(j); })(window, document, 'ysf');
# 聊天窗口自定义
ysf('open')
1、在引入七鱼SDK时会自动应用企业后台设置的接入配置,打开聊天窗口时直接调用open接口即可,聊天窗口会以后台设置的模式打开。或者通过传入templateId应用自定义配置的对话框样式。
输入参数说明:
参数 | 类型 | 描述 |
---|---|---|
options | Object | 企业配置信息 |
options.templateId | Number | 对话框样式模板标识 |
使用范例
ysf('open', {
templateId:123
});
企业开发者配置对话框样式模板
在页面上配置按钮,并在用户点击时响应事件,调用WEB-SDK的
ysf('open')
API接口打开聊天窗口(也可以使ysf('url')
获取url并直接打开)ysf('open')
和ysf('url')
的差别可查看接口说明中的ysf('open')
接口和ysf('url')
接口。
注意,如果你在sdk初始化完成之前调用
ysf('open')
或ysf('url')
,它们将无法被正确执行。建议结合ysf('onready')
来控制调用的时机,示例如下:
var isSdkReady = false;
ysf('onready', function () {
isSdkReady = true;
})
clickHandler = function () {
if(isSdkReady) {
ysf('open');
// location.href = ysf('url');
}else {
// 仅做参考
alert('sdk尚未加载成功,请稍后再试');
}
}
如果需要指定当前sdk的默认模板,可以采用直接在接入sdk后面传入参数sdkTemplateId={模板id}的形式。
(function (w, d, n, a, j) {
w[n] = w[n] || function () {
return (w[n].a = w[n].a || []).push(arguments)
};
j = d.createElement('script');
j.async = true;
j.src = 'https://qiyukf.com/script/044865c94981c048609d5c94c1ae9c6d.js?sdkTemplateId=4463292';
d.body.appendChild(j);
})(window, document, 'ysf');
特别说明
- 若需要代码指定访客端样式模板情况下,建议ysf('open')和sdkTemplateId当中均上报指定的访客端模板 TemplateId 且保持一致
- 访客端入口样式,因需要提前初始化,所以仅能通过sdkTemplateId指定,不读取 ysf('open')指定的templateId,均不指定则走管理端配置
- 访客端打开后页面样式,ysf('open')中设定templateId值 优先于 sdkTemplateId,均不指定则走管理端配置
- 管理端配置:位置「在线系统设置」-「访客端」-「样式设置」-「默认生效渠道」,支持根据网页渠道同时配置入口和页面样式,若不配置渠道走系统默认模版
# 聊天窗口URL
ysf('url')
通过此接口可获取聊天窗口的URL地址,如果想在当前窗口打开聊天窗口可以用以下方式
注意,浮层模式下使用
ysf('url')
得到的url可能与你的期望不同,建议仅在标签和弹窗模式使用此方式
<a href="#" id="online-service">在线客服</a>
<script>
(function (w, d, n, a, j) {
w[n] = w[n] || function () {
return (w[n].a = w[n].a || []).push(arguments)
};
j = d.createElement('script');
j.async = true;
j.src = 'https://qiyukf.com/script/044865c94981c048609d5c94c1ae9c6d.js?hiddden=1';
d.body.appendChild(j);
})(window, document, 'ysf');
document.getElementById('online-service').onclick = function(){
location.href = ysf('url');
};
</script>