首页 > wordpress开发 > wordpress主题功能 > 教你给wordpress主题添加返回顶部的功能按钮
摘要:当我们使用wordpress开发主题的时候,通常需要注意一些用户体验小功能,返回顶部的按钮对于成熟的网站来说至关重要,那...

当我们使用wordpress开发主题的时候,通常需要注意一些用户体验小功能,返回顶部的按钮对于成熟的网站来说至关重要,那今天大挖就给大家分享下在开发wordpress主题时,添加返回顶部按钮的功能,且提供出现成的代码供大家直接复制粘贴就可以完成。执行起来超简单,相信每个人都能学会,无论你是否有代码基础,只要你了解wordpress主题的标准构架就可以完成。

一、找到wordpress的样式表文件style.css中添加如下代码

其中,bottom和right属性可以控制按钮图片在右下角的位置,background属性可以修改返回顶部的图片。

二、找到主题的底部文件footer.php在里面添加如下动效代码:

三、添加返回顶部图片按钮的图片

这里需要注意一下,在css里面有写明图片的位置在images/top02.png,即images文件夹内。大家可以根据具体的情况进行位置调整。

这样,一个简单的返回按钮功能就加好了,而且会在下拉到超过一屏时才会显示噢0-0

分享到:
赞(1) 打赏

作者: 大挖酱

挖主题团队自2014年开始专注于WordPress企业主题设计开发,致力于为更多用户打造出更漂亮、更易用、更专业的网站。距今已累计开发近50款WP主题,付费客户超过5千人。挖主题,是您可以长期信赖的合作伙伴。

87 queries in 0.834 seconds

联系作者Q: 8413708 WX: zdmin7

支付宝扫一扫

微信扫一扫