网页聊天开发者工具

 
在开发人员的帮助下,您可以设置Grata网页聊天外观和演示的高级控件。在本文中,我们解释了如何使用自己的自定义按钮,如何根据自己的业务逻辑隐藏或显示Grata,或调整Grata在特定页面或特定操作上的位置。
 

使用您自己的按钮

您可以在站点上指定任何按钮ID或任何class的按钮,以在用户单击或点击按钮时打开Grata。
 

 
如果您使用自己的按钮,则可以继续在网站上显示Grata按钮,或在Grata管理后台网页聊天行为选项卡上将Grata按钮默认设置为隐藏。
 

 
即使您选择隐藏Grata按钮,一旦用户单击您的按钮打开聊天窗口,如果在聊天会话处于活动状态时用户将窗口最小化,Grata的按钮也会显示。
 

何时隐藏按钮

请注意,默认情况下,当移动设备旋转到 横屏模式时,Grata会隐藏聊天。这是设计使然,因为显示了键盘和浏览器标题,所以几乎没有可用空间来维持良好的用户体验。如果您使用自己的按钮,我们建议您对按钮应用类似的逻辑以在旋转时隐藏。或者,您可以从管理后端覆盖默认设置以隐藏Grata聊天,而是选择在旋转时显示Grata聊天。您还应该在 Internet Explorer v10 或更早浏览器版本隐藏聊天按钮。
 
我们还建议您在按钮实现中纳入以下一些逻辑,以使其对用户尽可能平滑:
 

‘grataReady’

如果在Grata聊天代码加载完成之前您的聊天按钮显示在您的站点上,或者由于某种原因您的站点无法连接到Grata,则当客户单击您的聊天按钮时,他们可能不会得到响应。为了防止这种情况的发生,您可以为“ grataReady”设置一个事件监听器,聊天代码加载完成后我们将触发该事件监听器。例如:

document.addEventListener('grataReady', CALLBACK);

CALLBACK 在网页聊天脚本中找到您的回调,可以从Grata管理员后端复制该回调。

 

'showGrata', 'hideGrata'

如果您想根据自己的业务逻辑控制何时显示聊天,可以将Grata设置为从不显示在管理后端,而是手动触发 showGratahideGrata 事件控制聊天演示。例如,如果您只想显示已登录用户的实时聊天,则可以编写一个仅在成功登录用户后才启动 showGrata的功能。触发 showGrata后,将显示Grata聊天按钮,直到您的团队离线或变得忙碌为止。否则,您可以随时触发 hideGrata 来隐藏Grata聊天按钮。
 

'grataStatus'

如果要基于服务团队的状态启用高级逻辑,则还可以侦听grataStatus事件,该事件告诉您服务团队是联机,繁忙还是脱机。
状态值
0 = 客服不在线
1 = 在线并可用
2 = 在线但忙碌 (满载)
 
Grata将每两分钟触发新的grataStatus更新。
 

'grataStart'

每次客服打开一个网页聊天客户的会话,Grata会触发grataStart的事件。电子商务客户使用它来跟踪客服的销售佣金。
 
加一个grataStart事件监听器后,数据包格式为:

event.grataValues = {'agentName':
                     'utm':
                     'agentId':
                     'userId':
                     'customerName':      };

agentName 客服名字,非唯一
utm Grata后台设置了客服员的UTM跟踪(如设置了)
agentId 客服员的8-9数字的ID,唯一
userId 客人的8-9数字的ID,唯一
customerName 客人的名字,平时自动生产一个名字为“$IP地址城市名称 XXX"

 

调整聊天按钮位置

使用dataToGrata事件侦听器可以更改特定页面或页面上特定事件的聊天按钮的位置。您可以在收到 grataReady 事件(见上文)后立即将其触发,在重新加载页面后,在Grata管理员后端中设置的值将被接管,因此请根据需要对其进行重置。要调整聊天位置,请发送一个自定义事件,该事件的值为 dataToGrata,其中包含一个对象,该对象具有bufferX,bufferY和/或zIndex的值。例如:

event.dataToGrata = {bufferX: '10%', bufferY: '5px', zIndex: 30};

请记住指定用于 bufferX/Y的单位: % em pc px vh 等等.