小程序在线客服样式

1.我们可以定义contact-button的样式，加一个class。这个客服组件可以放在一个固定模板里，方便每个页面都调用到。

<view>
	<contact-button class="img-plus-style zindex100 yc"></contact-button>
	<image src="../../images/kefu.png" class="img-plus-style"></image>
</view>

2.在app.wxss或其他文件里增加样式

.img-plus-style {height: 70rpx;width: 70rpx;position: fixed;bottom: 200rpx;right: 13rpx;opacity: 0.7
}
.zindex100{z-index: 100}
.yc{opacity: 0}

1. 普通客服按钮添加

 <button open-type='contact' session-from=''>客服-联系我们</button>

2. 悬浮客服按钮添加，图片自定义

大家看地图的有个客服图片图片资源。大家去iconfont 网站去找一个就可以了

index.wxml

<button class="kf_button" open-type="contact" session-from="weapp">
 <image class="kf_image" src="../../resources/img/kf.PNG"></image>
</button>

index.wxss

.kf_button{
 background-color: rgba(255, 255, 255, 0);
 border: 0px;
 height: 100rpx;
 right: 0;
 bottom: 20rpx;
 position: fixed;
}
.kf_button::after{
 border: 0px;
}
.kf_image{
 z-index: 9999;
 width: 100rpx;
 height: 100rpx;
}