在小程序中加入客服消息按钮

小程序接入微信「客服消息」功能模块,开发者只需要调用按钮,触发微信的客服消息功能即可,不需要自行在小程序中实现。

加入客服消息按钮有两个方法,大家可以根据自己的实际需求,任选一种方法。

1. 插入固定样式的客服消息按钮

微信为客服消息按钮,设计了一个初始样式。

想要调用它也很简单,只需要在 WXML 代码中,插入 <contact-button></contact-button>,固定样式的客服按钮就会出现在界面中

利用这种方法做出的客服消息按钮,其样式已经被固定,且颜色只能选择黑白两色。唯一可以真正自定义的项目,则是这个按钮的尺寸大小。

2. 插入自定义样式的客服消息按钮

利用 WXML 中 <button> 组件的 open-type 属性,我们也可以在小程序的界面中,插入自定义样式的客服消息按钮

<button open-type='contact'>联系客服</button>

相比较第一种方法,使用这种方法,你可以在 WXSS 中为按钮添加自己的样式,让客服消息按钮与整体页面更和谐。

无论使用哪一种方法,用户都可以通过点击客服消息按钮,进入聊天界面,与你的小程序客服直接沟通。

收发客服消息

微信为小程序提供了「微信公众平台客服功能」,已经绑定为客服的人员,可以直接打开客服功能页面(mpkf.weixin.qq.com)扫码登录,就能与小程序用户进行沟通。

1. 绑定客服人员

首先,小程序管理员需要为小程序绑定客服人员,客服人员才能进入客服功能,与小程序用户进行沟通。

具体绑定方法是:

  • 使用小程序帐户,登录至微信公众平台(mp.weixin.qq.com)。
  • 点击左侧边栏的「客服消息」链接,进入「客服消息」功能模块。
  • 点击右侧的「添加」按钮,并在弹出框中,输入客服人员个人微信号。可以添加多个客服人员的微信号。
  • 确认添加,点击「确定」即可。

2. 进入客服

添加完成后,小程序的客服人员可以使用自己的个人微信,扫码登录进入「微信公众平台客服功能」。

客服功能使用起来非常简单,就像是在用微信网页版一样。只要小程序的用户发起会话,客服人员就可以在客服功能中与用户进行沟通。

需要注意的是,客服人员只能在用户发送消息后的 48 小时内回复用户。如果用户发起会话超过 48 小时,客服人员将无法回复该用户。

微信内置小程序在线客服功能相关推荐

  1. 微信小程序客服介绍:如何设置小程序在线客服?

    其实只需要解决2个问题 第一步,在微信小程序中添加联系在线客服按钮 第二步,接入在线客服功能,设置[自动/人工/转人工]回复等 一.添加小程序客服按钮 ① 在小程序中添加客服按钮功能,点此参考官方文档 ...

  2. 微信小程序在线客服系统都有哪些功能?

    微信小程序的用户已经破6亿,不少企业都看准了小程序这块大蛋糕.但是想要把握住小程序红利,除了做好运营推广外,用户服务也是重中之重.微信小程序自带的客服系统却很难满足用户服务的需求,于是很多小程序使用者 ...

  3. 微信小程序接入客服功能

    微信小程序接入客服功能 1.提供客服入口 // 通过组件方式 <contact-button type="default-light" size="20" ...

  4. 微信小程序在线客服接入

    小程序接入微信「客服消息」功能模块,开发者只需要调用按钮,触发微信的客服消息功能即可,不需要自行在小程序中实现. 加入客服消息按钮有两个方法,大家可以根据自己的实际需求,任选一种方法. 1.插入固定的 ...

  5. 小程序在线客服完整实现

    1.先注册公众号>小程序(需实名认证) 2.开发>测试>上传>审核发布>发布>使用 3.公众号(订阅号或服务号)与小程序(此为在线客服)通过同一主体绑定可以打通调用 ...

  6. 微信小程序实现客服功能、word文件下载到本地

    微信小程序项目开发中,遇到联系客服和word文档打印(下载)功能,记录一下,以便查阅. 一.客服功能 官方文档 1.在小程序中加入客服消息按钮: 使用button按钮,设置open-type='con ...

  7. uni-app小程序使用客服功能和获取客服聊天记录demo

    demo代码如下: <template>     <view class="content">         <button open-type=& ...

  8. 微信小程序在线客服接入功能详解

    步骤一::小程序接入微信「客服消息」功能模块,开发者只需要调用按钮,触发微信的客服消息功能即可. 加入客服消息按钮有两个方法,大家可以根据自己的实际需求,任选一种方法. 1.插入固定的接入样式 < ...

  9. 微信小程序在线客服聊天

    1.分析 小程序给我们提供的在线聊天功能,在界面中只能通过按钮开放能力来打开. 只能在手机端中去使用,在模拟器中无法进行 2.代码: <!--联系客服--><buttonopen-t ...

最新文章

  1. Silverlight 和WPF的Composite Guidance(Prism V2)发布了
  2. force oracle delete type,3.Oracle Interface Configuration Tool (OIFCFG) 命令参考
  3. ajax hash调用实例
  4. spring源码分析之定时任务概述
  5. (12)高斯和均值模糊放到一起
  6. 走进新华三解决方案 360°业务能力中心,读懂新华三如何助力企业数字化转型
  7. 《深入理解计算机系统》(2) 信息的表示和处理
  8. 46 - 算法 - Leetcode-155-最小栈
  9. jsf面试题_JSF面试问答
  10. stm32f10x寄存器设置脚本
  11. Ubuntu20.04 安装微信
  12. could not access network location \Hewlett-Packard\\
  13. ffmpeg 再编译使用 ffmpeg-gl-transition
  14. 论文查重颜色分别代表什么含义?
  15. ios Reading from private effective user settings
  16. 华为鸿蒙手机用大卡还是小卡,【荣耀3XPro评测】大卡+小卡双3G网络-中关村在线...
  17. FDTD Solutions-PML
  18. 初探:使用Jest进行React单元测试
  19. 微信朋友圈营销如何做好头像_昵称_签名_背景基础设置?
  20. PHP中级工程师面试题

热门文章

  1. TPAMI 2022 | 利用子图同构计数提升图神经网络的表达能力
  2. Webots R2022b 发布
  3. ROS联合Webots之舵轮篇-搭建舵轮底盘
  4. [转载]php文件后边自动加PHPSESSID=ee2cb583e0b94bad4782ea
  5. Git分支合并到另外一个分支
  6. html已输入字数,检测用户输入字数.html
  7. MySQL_explain关键字分析查询语句
  8. 成都市 普通护照、往来港澳通行证、大陆居民往来台湾通行证 办理方法(2015年11月更新)
  9. 2019NHOI小甲第六题 叠罗汉(2.5)
  10. Java中如何正确进行浮点数运算