WordPress主题美化-全站左侧边栏添加联系站长按钮

Jaysun

温馨提示:这篇文章已超过514天没有更新,请注意相关的内容是否还可用!

一个非常实用的美化,今天分享一个给网站添加全站左侧边栏联系站长按钮功能,类似于在线客服了,只需要在两个文件中添加一行代码就可以实现,添加后的具体样式效果,以子比主题为例,具体效果可以参考下方的效果图。

1.jpg

使用教程:

1、后台主题设置—>自定义代码—>自定义 CSS 样式代码把下面的代码添加到里面

自定义 CSS 代码:

/*左边联系站长 css 开始*/
.contact-help{position: fixed; z-index: 101; left: 0; top: calc(50% - 30px); margin-top: -36px; width: 28px; height: 72px; transition: all .3s; font-size: 12px;background: var(--main-bg-color);border-radius: 0 5px 5px 0; padding: 8px 7px; line-height: 14px;}@media screen and (max-width: 768px){.contact-help{display:none;}}
/*左边联系站长 css 开始*/

2、在主题目录下 themes/zibll/footer.php 下,添加下面的 PHP 代码:

PHP 代码:

隐藏内容
评论可见
前往评论

3、将第二步链接中的uin=12345678,替换下填写你自己的qq账号即可。

您需要 登录账户 后才能发表评论

发表评论

快捷回复: 表情:
AddoilApplauseBadlaughBombCoffeeFabulousFacepalmFecesFrownHeyhaInsidiousKeepFightingNoProbPigHeadShockedSinistersmileSlapSocialSweatTolaughWatermelonWittyWowYeahYellowdog
评论列表 (有 11 条评论,840人围观)
网友昵称:138999649
138999649 V 普通用户 Safari 16.2 Mac OS X 10.15.7 10楼
2023-04-12 来自浙江 回复
测试一下
网友昵称:jcrg
jcrg V 普通用户 Google Chrome 102.0.0.0 Windows 10 x64 9楼
2023-03-22 来自陕西 回复
回复学习一下
网友昵称:mxrnhk
mxrnhk V 普通用户 Google Chrome 110.0.0.0 Windows 10 x64 8楼
2023-03-05 来自贵州 回复
真心不错的
网友昵称:一切顺利
一切顺利 V 普通用户 QQBrowser 11.5.5245.400 Windows 7 x64 7楼
2023-02-20 来自江苏 回复
学习了
网友昵称:linjunfan
linjunfan V 普通用户 Google Chrome 92.0.4515.107 Windows 10 x64 6楼
2023-01-20 来自广东 回复
有用,感谢分享
网友昵称:michole
michole V 普通用户 Google Chrome 86.0.4240.198 Windows 10 x64 地板
2023-01-12 来自河北 回复
这个有用
网友昵称:云海丶2018
云海丶2018 V 普通用户 Google Chrome 108.0.0.0 Windows 10 x64 凉席
2023-01-03 来自河南 回复
禁止白嫖!
网友昵称:whj123
whj123 V 普通用户 Google Chrome 108.0.0.0 Windows 10 x64 板凳
2022-12-03 来自贵州 回复
不错
网友昵称:2359438723
2359438723 V 普通用户 IBrowse r Huawei Browser 椅子
2022-11-27 来自江苏 回复
不错
网友昵称:hostsir
hostsir V 普通用户 Google Chrome 107.0.0.0 Windows 10 x64 沙发
2022-11-24 来自江苏 回复
这个还不错

目录[+]

取消
微信二维码
微信二维码
支付宝二维码