WordPress添加回到顶部悬挂猫咪

前言

回到顶部悬挂猫咪是今天我从网上看到觉得很不错，然后就弄到了本站，确实很棒。话不多说，下面分享教程！

使用教程

回到顶部悬挂猫咪只能电脑端显示，需要手机端显示，自己修改CSS代码。
本教程以本站使用的子比主题为例，大部分主题大同小异。
回到顶部悬挂猫咪采用js+css+Jquery,但大多数的WordPress主题都已经使用Jquery，所以无需担心Jquery问题（当然啦，如果主题没有Jquery，那么去百度找Jquery好用的CDN进行调用。）

1、首先，下载回到顶部悬挂猫咪的JS+CSS（在本文章末）。

2、两种方式：

在网站后台—>主题设置—>自定义代码—>自定义头部HTML代码，把下面的代码添加进去；

自定义头部HTML代码

如果没有自定义头部HTML代码那么的主题，请在主题目录下header.php末尾添加下面的代码。

header.php末尾添加

代码：

<!--回到顶部-->
<link rel="stylesheet" type="text/css" href="/cdn/css/szgotop.css" />
<div class="back-to-top cd-top faa-float animated cd-is-visible" style="top: -900px;"></div>
<script type="text/javascript" src="/cdn/js/szgotop.js"></script>

注（非常重要）：自己把得到CSS、JS文件放在喜欢的目录里面，或者在自己网站根目录下创建新的目录把文件放进去（嘿嘿嘿，实在实在是不会的自己花钱弄），然后在href=”文件路径”和src=”文件路径”填写自己的文件路径。悬挂猫咪是一张图片，还需要在CSS里面修改图片的路径（图片路径在CSS最后面，见下图）。

悬挂猫咪CSS图片路径
3、前两步如果都完成了，那么在网站首页拉到底部就可以看到了悬挂猫咪，那么这时候就会出现“主题自带的回到顶部”和悬挂猫咪，那么需要我们到网站后台—>主题设置里面关闭主题自带的回到顶部，其他主题的主题设置不知道有没有关闭这一项。
子比主题只需在网站后台—>主题设置—>全局&功能—>常用功能—>返回顶部按钮—>关闭电脑端的回到顶部。

关闭电脑端的回到顶部
效果截图

两个线的图片

此处内容已隐藏，请付费后查看

温馨提示：本文最后更新于2024-01-15 21:17:17，某些文章具有时效性，若有错误或已失效，请在下方留言或联系老卢。

—- 本篇内容已结束，请看下一篇内容—-

版权声明 1 本网站名称：老卢淘
2 本站永久网址：https://www.alaolu.cn/
3 本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长QQ202137615@qq.com进行删除处理。
4 本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
5 本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报
6 本站资源大多存储在云盘，如发现链接失效，请联系我们我们会第一时间更新。