Wordpress+可视化编辑器=最好的系统+零基础制作网页

网站上所有布局,颜色与设置均可在后台修改,无需编程基础

分享用ACF高级自定义插件+beaver编辑器做超级强大的wordpress在线客服功能

2019-11-11 / 分类: /  评论数量:0

本来做一个在线客服功能是十分简单的事情,步骤:在网上找一个在线客服代码,复制过来,修改下图片与联系试的的号码,就可以了。但现在都9102年了,我们应该有更高的追求:

  1. 联系方式后台可以修改;
  2. 图标或图片后台可以修改;
  3. 左右,间距,颜色都可以在后台修改;
  4. 电话,QQ, Skpey, 留言,返回顶部等都要支持;
  5. 还要自适应各显示设备并且我想要在哪个设备(比如PC电脑,平板,手机端)开就开,想关就关;
  6. 最好还得来个中英文自动切换;
  7. ........

前面3,4条还好,还有一些插件支持,但免费版本的有非常多的限制,实现不了多个联系方式或修标,其它功能也有很多限制,都是一些国外的插件,还需要每年续费。而且在5,6条还支持不好或根本不支持,花了半天的时间折腾了几十个相关插件,结果没有一个满意的。就萌生了自己做一个的想法,主要是图标与号码修改以前就一直用ACF插件做过,想着是不是可以引入 beaver模板+ Polylang多语言(没用用WPML是因为人穷,而且如果要做模板的话不可能每个站都买授权,有点不合算)。折腾了几天,终于有了成果。用到的工具:

  • 插件 Advanced Custom Fields (简称 ACF)
  • 插件 Advanced Custom Fields: Font Awesome (给ACF字段类型添加矢量图标)
  • 插件 Polylang 实现不同的语言切换在线客服

OK, 开始了。。。

弄了几天,初步自己测试没有问题了,但266个字段

ACF中英文客服字段数
ACF中英文客服字段数

设计5个常用在线客服图标与返回顶部图标,为了考虑以后的拓展,多做了一个备用。

acf+beaver做在线客服
  • 默认图标样式:是默认显示的主图标设置;
  • 子菜单样式:鼠标悬停时显示的该目标对应的子项;
  • 第一个至备用图标其实没有严格限制只能是使用这个,只是常见的是这些,设置默认了可以省点时间。
  • 返回顶部

演示站点:http://demo.yizhanba.cn/astra-bb/wj01

发表评论

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

回到顶部

QQ群962782975