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

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

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

效果图长这样,存在默认的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)
}
});


目录
打赏
0
7
8
1
197
分享
相关文章
小技巧 - 淘宝怎么联系人工客服?
小技巧 - 淘宝怎么联系人工客服?
199 0
小技巧 - 淘宝怎么联系人工客服?
深度分析 | 2024主流的智能客服系统有哪些?他们是怎么实现的?
本文深入探讨了智能客服系统的使用方法和相关技术实现逻辑,涵盖前端交互、服务接入、逻辑处理、数据存储四大层面,以及自然语言处理、机器学习、语音识别与合成、数据分析与挖掘、知识库管理和智能推荐系统等核心技术,帮助企业更好地理解和应用智能客服系统,提升服务效率和客户满意度。
436 1
2025最新排名|盘点值得推荐的5个在线客服系统
在数字化浪潮下,在线客服系统迅速发展,成为企业提升竞争力的关键。本文推荐五款2025年值得使用的在线客服系统:合力亿捷、淘宝、京东、华为云和中国移动客服系统。它们各自具备全渠道接入、智能问答、数据分析、高稳定性等亮点,助力企业高效服务客户,优化营销策略并提升整体运营效率。
72 24
实战揭秘:当RAG遇上企业客服系统——从案例出发剖析Retrieval-Augmented Generation技术的真实表现与应用局限,带你深入了解背后的技术细节与解决方案
【10月更文挑战第3天】随着自然语言处理技术的进步,结合检索与生成能力的RAG技术被广泛应用于多个领域,通过访问外部知识源提升生成内容的准确性和上下文一致性。本文通过具体案例探讨RAG技术的优势与局限,并提供实用建议。例如,一家初创公司利用LangChain框架搭建基于RAG的聊天机器人,以自动化FAQ系统减轻客服团队工作负担。尽管该系统在处理简单问题时表现出色,但在面对复杂或多步骤问题时存在局限。此外,RAG系统的性能高度依赖于训练数据的质量和范围。因此,企业在采用RAG技术时需综合评估需求和技术局限性,合理规划技术栈,并辅以必要的人工干预和监督机制。
266 3
AI实践:智能工单系统的技术逻辑与应用
智能工单系统是企业服务管理的核心工具,通过多渠道接入、自然语言处理等技术,实现工单自动生成、分类和分配。它优化了客户服务流程,提高了效率与透明度,减少了运营成本,提升了客户满意度。系统还依托知识库和机器学习,持续改进处理策略,助力企业在竞争中脱颖而出。
111 5
2025年有哪些工单管理系统值得推荐?
随着企业数字化转型加速,工单管理系统成为优化流程、提升服务的关键工具。2025年备受关注的主流系统包括:合力亿捷,中国移动,中国联通,中国电信等
19 0
年度评选 | 2024年客服系统6大品牌
在2024年的客服系统市场中,合力亿捷等服务商品牌展现了各自在技术研发、产品创新和行业应用等方面的卓越实力。
65 1
IM系统在体育直播网站中的重要性
IM(即时通讯)系统在体育直播平台中至关重要,提升用户体验、促进社交互动和增强平台活跃度。它支持实时互动、增强观赛氛围、构建社交网络、推送即时信息、创造商业价值并提供多元化互动体验。高并发性能、实时稳定性和用户安全是实现的关键。通过集成IM系统,平台能更好地满足观众互动需求,提升运营效益。 代码示例展示了如何在比赛数据响应中设置比赛ID、游戏ID、系列赛ID等基本信息,并检查是否有计划和关注标记。
最新榜单 | 盘点2024年10大主流工单系统
随着互联网的发展,工单系统因其多样化功能和高效管理能力,成为企业运营的重要工具。本文介绍了10大主流工单系统,包括合力亿捷、阿里云服务中台、华为云ROMA ServiceCore等,它们各具特色,帮助企业提升服务质量和运营效率,实现数字化转型。
117 7
AI技术在智能客服系统中的应用与挑战
【9月更文挑战第32天】本文将探讨AI技术在智能客服系统中的应用及其面临的挑战。我们将分析AI技术如何改变传统客服模式,提高服务质量和效率,并讨论在实际应用中可能遇到的问题和解决方案。
444 65
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等