WordPress添加显示和隐藏侧边栏按钮开关的两种方法

在很多的地方都看见过这种效果,就是在文章页面可以切换显示和隐藏侧边栏功能,感觉还是很有用,比如一篇文章的文字内容过多,那么就可以通过隐藏侧边栏来显示更多的文字便于浏览。比如你可以通过点击我文章标题下方的隐藏侧栏按钮来查看效果,现在把代码分享出来


第一种方法(简洁版)亲测可用


1.在header.php中添加如下代码

 

代码说明:将其中的1265px、885px、.content、.sidebar修改为你主题对应的文章内容页+侧边栏宽度、文章页内容宽度、文章内容容器、侧边栏容器即可。
2.在你布置该按钮的地方添加如下代码,一般是添加到文章标题下面,当然代码可以根据你自己的主题稍作修改。


第二种方法(美化版)自行测试


1. 添加隐藏/显示边栏按钮

根据需要在页面相应位置添加显示和隐藏按钮,代码:

2 .添加JS

js文件中加入以下js代码:

3 .添加Css

在style.css样式表中添加如下样式:


 

觉得好的话记得打赏赞助小灰灰哦,小灰灰灰更有动力的,谢谢

小灰灰

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: