1. 首页
  2. 腾讯企点课堂

腾讯企点课堂-接待组件自定义操作手册

腾讯企点的接触点分为图标型和链接型两大类。图标型的会生成一段代码, 需要放置在网页的标签之间。链接型则是生成一个链接。 注:放置在标签里的元素是无法显示在页面上的,所以不能放置在 标签里。 2. 以下面这段 script 为例: src 里的地址直接以//开头。如果你的页面是 http 协议,则这个 src 会自动添加 http 协议 头;如果你的页面是 https 协议,那么同样 src 会自动添加 https 头。不必担心这里//开 头会有什么问题。 3. 要对图标型的接触点自定义样式等,需要先找到接触点所在的 iframe:

所以第一步,可以通过这个 id 属性,来找到这个 iframe。 如果用了 jquery 的话,那么如下 js 代码可以找到这个 iframe: var $wpa = $(‘#qidian_wpa_2852103860_236’); 若要修改 css 的话: #qidian_wpa_2852103860_236 {

} 4. 企点的图标型接触点,按位置可以分为两大类,一类是放置在哪里显示在哪里,一类是 固定在可视范围内的一个位置上,不随滚动条滚动。 设置接触点在页面任意位置显示,不随滚动条离开可视范围: #qidian_wpa_2852103860_236 { position:fixed!important;
left:0;
top:0;
} 上面这一段代码表示将接触点固定在可视范围内左上方。若改为: #qidian_wpa_2852103860_236 { position:fixed!important;
right:0;
bottom:0;
} 则表示固定在右下方。更多组合请参考 w3c 对 position 的介绍。
注意,iframe 里也能找到接触点的 width 和 height,可以根据这个来给 left 等值设置百 分比来达到居中的目的。

如果希望将原本固定显示的接触点改为跟随显示,那么只需要在页面里改下接触点 iframe 的 position 属性即可: #qidian_wpa_2852103860_236 { position:static!important; } 5. 自定义接触点的大小 目前需要用到 css 里的 zoom 属性,但浏览器兼容性有问题,建议只在移动端上使用, 或者只支持现代浏览器的 pc 端用。 修改大小的话,需要修改接触点的 iframe 样式和 iframe 里的 body 样式。这两个样式都 要添加 zoom 属性(zoom 设置为 2 代表放大为原来的 2 倍大小): #qidian_wpa_2852103860_236 { zoom:2;
}
然后通过 js 来修改 iframe 里的 body 样式。这里以 jquery 来操作:
var $iframe = $(‘#qidian_wpa_2852103860_236’),
iframeWindow = $iframe[0].contentWindow,
$iframeDoc = $(iframeWindow.document);
$iframeDoc.find(‘body’).css(‘zoom’, 2); 注意通过 js 代码来操作接触点,需要在接触点加载完毕后执行。下同。 6. 自定义 dom 点击: 假设页面上有一个 button 元素(或任意其他的你希望点击后发起 qq 会话等接触点动作 的元素): test 那么通过以下 js 代码就可以实现点击这个 button 来发起 qq 会话: $(‘#wpa’).on(‘click’, function() { var $iframe = $(‘#qidian_wpa_2852103860_236’), $iframeWin = $iframe[0].contentWindow, $doc = $($iframeWin.document); $doc.find(‘[data-event]’)[0].click(); }); 注意:有些接触点会有两个 dom 元素拥有 data-event 属性。这里取需要的那个元素来绑 定就行。 7. 如何让接触点在页面上不可见 当绑定了自己的 dom 元素点击后,可能希望原本的接触点图标不可见。那么只需要给接 触点的 iframe 设置不可见的属性就可以了,例如: #qidian_wpa_2852103860_236 { /方法 1/ display:none; /方法 2/ width:0; height:0; /方法 3/ visibility:hidden; /方法 4/ opacity:0; } 8. 链接型接触点点击后去掉中间页 需要用到一个隐藏在页面中的 iframe,同时把 a 链接里的 target 属性指向这个隐藏的 iframe 即可: wpa 之间可以是文字,也可以是等其他 dom 元素。 9. 移动端 app 嵌入接触点 企点的接触点是给 web 页面用的,不支持原生嵌入,需要通过 webview 加载一个完整的 页面,在这个页面里嵌入接触点代码才行。webview 的大小可以设置为接触点 iframe 的 尺寸。但移动端不在手 q 里点击接触点的话,会有一个中间页,这个中间页的大小就是 webview 的大小。若该 webview 太小,则会影响到中间页,以及 web im 类型接触点的
显示。 注意 webview 一定不要禁止 mqqwpa://和 mqqapi://这两个协议。

本文发布者:企业QQ下载,腾讯企点企业QQ官网本文标题:腾讯企点课堂-接待组件自定义操作手册

腾讯企点下载本文网址:https://www.qqqdyx.com/qidianketang/1410.html

发表评论

电子邮件地址不会被公开。 必填项已用*标注

联系我们

企业QQ/咨询热线:

4000-110-200

在线咨询:点击这里给我发消息

邮件:mi@mgsh.com.cn

手机:18612888118

工作时间:周一至周五,9:30-18:30,节假日休息