【每周一个小技巧】如何自定义客服、生活号组件的样式

简介: 【每周一个小技巧】如何自定义客服、生活号组件的样式

开发过客服、生活号的小伙伴都知道,客服、生活号等组件的样式是不太符合我们的业务场景的。
结尾有彩蛋。
比如:

效果图长这样,存在默认的icon,而我们的业务里可能是某个弹窗里有个联系客服。


那么如何自定义样式:
其实也很简单,使用view包裹客服、生活号组件,view写宽高样式,可内嵌图片等,客服、生活号组件只负责在view的最上层让用户点击触发即可。实现方案如下:

<view class="contact-service">
  联系客服
  <contact-button tnt-inst-id="" scene="" size="50" icon="" />
</view>
.contact-service {
  width: 600rpx;
  height: 96rpx;
  display: flex;
  justify-content:  center;
  align-items: center;
  color: #FFF;
  background: #00cc88;
  border-radius: 48rpx;
  font-size: 32rpx;
  margin: 32rpx auto;
}

.contact-service contact-button {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

效果图如下:点击后会跳转官方客服页面。


lifestyle生活号组件同理。
以上就是本周分享的小技巧,这是我完全重新编辑的第三遍文章,第一次写了一个多小时,内容很详细,因为登录态失效,全没了,心态崩了。第二次也是登录态失效,这是第三次,就随便写了,@夏乔,赶紧安排个草稿箱功能吧。

同步个彩蛋,打开客服也可以使用API的方式,这样任意样式都可以点击后触发:

JavaScript

my.ap.openCustomerService({
tntInstId: 'SEIBRDCN',
scene: 'SCE00198760',
alipayCardNo: '',
extInfo: '',
complete: (res) => {
console.log(res)
}
});


目录
相关文章
|
自然语言处理
小技巧 - 淘宝怎么联系人工客服?
小技巧 - 淘宝怎么联系人工客服?
184 0
小技巧 - 淘宝怎么联系人工客服?
|
21天前
|
机器学习/深度学习 自然语言处理 搜索推荐
深度分析 | 2024主流的智能客服系统有哪些?他们是怎么实现的?
本文深入探讨了智能客服系统的使用方法和相关技术实现逻辑,涵盖前端交互、服务接入、逻辑处理、数据存储四大层面,以及自然语言处理、机器学习、语音识别与合成、数据分析与挖掘、知识库管理和智能推荐系统等核心技术,帮助企业更好地理解和应用智能客服系统,提升服务效率和客户满意度。
115 1
|
3月前
|
存储 自然语言处理 机器人
实战揭秘:当RAG遇上企业客服系统——从案例出发剖析Retrieval-Augmented Generation技术的真实表现与应用局限,带你深入了解背后的技术细节与解决方案
【10月更文挑战第3天】随着自然语言处理技术的进步,结合检索与生成能力的RAG技术被广泛应用于多个领域,通过访问外部知识源提升生成内容的准确性和上下文一致性。本文通过具体案例探讨RAG技术的优势与局限,并提供实用建议。例如,一家初创公司利用LangChain框架搭建基于RAG的聊天机器人,以自动化FAQ系统减轻客服团队工作负担。尽管该系统在处理简单问题时表现出色,但在面对复杂或多步骤问题时存在局限。此外,RAG系统的性能高度依赖于训练数据的质量和范围。因此,企业在采用RAG技术时需综合评估需求和技术局限性,合理规划技术栈,并辅以必要的人工干预和监督机制。
175 3
|
1天前
|
安全 UED
IM系统在体育直播网站中的重要性
IM(即时通讯)系统在体育直播平台中至关重要,提升用户体验、促进社交互动和增强平台活跃度。它支持实时互动、增强观赛氛围、构建社交网络、推送即时信息、创造商业价值并提供多元化互动体验。高并发性能、实时稳定性和用户安全是实现的关键。通过集成IM系统,平台能更好地满足观众互动需求,提升运营效益。 代码示例展示了如何在比赛数据响应中设置比赛ID、游戏ID、系列赛ID等基本信息,并检查是否有计划和关注标记。
|
5月前
|
数据采集 监控 测试技术
大型IM稳定性监测实践:手Q客户端性能防劣化系统的建设之路
本文以iOS端为例,详细分享了手 Q 客户端性能防劣化系统从0到1的构建之路,相信对业界和IM开发者们都有较高的借鉴意义。
173 2
|
1月前
|
存储 人工智能 运维
最新榜单 | 盘点2024年10大主流工单系统
随着互联网的发展,工单系统因其多样化功能和高效管理能力,成为企业运营的重要工具。本文介绍了10大主流工单系统,包括合力亿捷、阿里云服务中台、华为云ROMA ServiceCore等,它们各具特色,帮助企业提升服务质量和运营效率,实现数字化转型。
46 7
|
3月前
|
人工智能 自然语言处理 搜索推荐
AI技术在智能客服系统中的应用与挑战
【9月更文挑战第32天】本文将探讨AI技术在智能客服系统中的应用及其面临的挑战。我们将分析AI技术如何改变传统客服模式,提高服务质量和效率,并讨论在实际应用中可能遇到的问题和解决方案。
338 65
|
2月前
|
自然语言处理 数据可视化 搜索推荐
构建一个基于通义千问的智能客服系统
公司开发一个智能客服系统,帮助用户快速找到他们需要的商品信息、解决问题,并提供个性化的购物建议。系统需要能够处理大量的用户提问,并以自然语言的形式给出准确的回答。
93 1
|
2月前
|
人工智能 自然语言处理 搜索推荐
选型攻略 | 智能客服系统该怎么选?(好用的智能客服系统推荐)
智能客服系统的选型需要综合考虑渠道功能、系统性能、客服工作管理、客户管理以及成本效益等因素。目前合力亿捷推出的智能知识库,梳理海量知识,根据不同主题对知识进行分类,使其结构更清晰。
75 0
|
2月前
|
人工智能 自然语言处理 安全
AI技术在智能客服系统中的应用与挑战
【10月更文挑战第28天】本文将深入探讨人工智能(AI)技术在智能客服系统中的应用及其面临的挑战。我们将通过实例分析,了解AI如何改善客户服务体验,提高效率和降低成本。同时,我们也将关注AI在实际应用中可能遇到的问题,如语义理解、情感识别和数据安全等,并提出相应的解决方案。

热门文章

最新文章