WordPress主题大多数都自带有幻灯片功能,不过很少看到有在WordPress侧边栏实现幻灯片功能的。今天,我们就以Nana主题为例说明纯代码如何给WordPress侧边栏小工具添加幻灯片功能。
WordPress侧边栏小工具添加幻灯片功能思路:
根据分析Nana主题首页的幻灯片功能及代码,认为这个幻灯片代码在侧边栏也是能够正常使用的,只需要修改一些小参数即可。
WordPress侧边栏小工具添加幻灯片功能步骤:
1、在Nana主题JS文件夹中找到slides.js文件,在文件最后添加以下代码并上传覆盖:
- $(document).ready(function() {
- $("#slider1").responsiveSlides({
- auto: true,
- pager: true,
- speed: 800,
- maxwidth: 300
- });
- });
2、在Nana主题文件夹中的header.php文件找到类似以下代码:
- <?php if (is_home() ) { ?>
- <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/slides.js"></script>
- <?php } ?>
直接去除那个判断是否为首页的函数,即以上代码改为:
- <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/slides.js"></script>
3、在Nana主题文件夹中的style.css文件添加以下代码:
- #sidebar #slideshow1 ul{padding:0;}
- #sidebar #slideshow1 .rslides_tabs{display:none;}
4、在WordPress后台 - 外观 - 小工具中为相应的侧边栏添加文本小工具,内容填入如下代码:
- <div id="slideshow1" class="wow fadeInUp" data-wow-delay="0.3s">
- <ul id="slider1" class="rslides" >
- <li><a title="Nana主题专题文章——常见问题及个性化修改" href="https://www.yigujin.cn/nanazhuti/" target="_blank"><img src="https://www.yigujin.cn/tp/2017/160818_nanaztcb.jpg"></a></li>
- <li><a title="boke112导航发布的WordPress新手入门教程" href="https://www.yigujin.cn/tag/wordpressxinshourumenjiaocheng/" target="_blank"><img src="https://www.yigujin.cn/tp/2017/160818_wordpress.jpg"></a></li>
- <li><a title="Three主题和Unite主题常见问题解答及个性化修改" href="https://www.yigujin.cn/461.html" target="_blank"><img src="https://www.yigujin.cn/tp/2017/160818_cjwt.jpg"></a></li>
- </ul>
- </div>
PS:以上图片及链接地址可修改,如需要显示更多图片请看格式继续添加即可。
完成以上四个步骤后刷新网站,即可看到刚才添加的侧边栏图片带有幻灯片功能了,具体效果请看懿古今侧边栏第二个图片显示效果。
温馨提示:
Three主题和Unite主题实现侧边栏幻灯片功能的原理和步骤类似,请大家自行添加折腾。至于其他主题的,请根据主题的幻灯片功能及代码自行添加测试。
你可能感兴趣的文章
懿古今 所有,欢迎分享本文,转载请保留出处!发布此文是出于传递更多信息之目的,若有来源标注错误或侵犯了您的合法权益,请发邮件至[email protected],确认后马上更正、删除,谢谢!
版权声明:本文为原创文章,版权归
发表于2016-08-19 10:19 沙发
这个功能不错
发表于2016-08-19 11:54 板凳
不错的功能,实用!
发表于2016-08-19 13:59 地板
不错 学习了
发表于2016-08-19 15:49 4楼
这功能强大
发表于2016-08-20 11:30 5楼
wordpress国内知名主题作者有哪些呢?
懿古今就不说了,算一个
@本质游戏[流汗] 我连业余都算不上,只能算是自娱自乐,比较厉害的好像有大前端、知更鸟、苏醒等博主
@懿古今wait主题不知道你听说过没有
我第一次玩wp就是用的那个
我的垃圾主机跑不起来
载入3000ms 才换的zb
@本质游戏听说过没用过,我以前用我们南宁的一家主机,那时候跑WordPress或zblog都很卡,跑自己折腾的ASP站点就很流畅,后来才知道是主机的问题,跟程序无关。
@懿古今我刚才看了大前端主题作者的网站
他的主题确实很屌….
@懿古今主题已经制作的相当不错了,最重要的是还免费,呵呵,这点真心好啊 [鼓掌] !
发表于2016-08-20 18:52 6楼
有时候首页幻灯在百度快照中会出现几张图片同时显示,影响快照展示的,这个问题有人遇到过吗?
@南通SEO百度快照这个还真的很少关注,只要站点浏览没问题就OK了,其他的我就懒得折腾了
发表于2016-08-25 10:03 7楼
很不错,很实用,可惜自己折腾不来它 [流汗] !