多语言展示
当前在线:894今日阅读:138今日分享:33

知更鸟主题修改教程:[2]添加一体化订阅边栏

使用WordPress建站的人很多,一般都会到网络上下载一款免费的主题使用,而知更鸟的Hot News主题就是众多免费WP主题中的一款,相信也有很多人正在使用它,本文就来介绍下该主题的修改方法,希望对广大站长能有所帮助
工具/原料

电脑一台

方法/步骤
1

WordPress默认自带有订阅小工具,但是功能非常单一且外观简单,无法满足我们的日常需要。最近在一个网站中发现一个订阅小工具不错,集成了QQ聊天、新浪微博、腾讯微博、邮件订阅、RSS订阅等多种订阅方式于一身,相比系统自带的订阅方式,不仅功能更加强大且更加的美观(如下图)

2

先下载几个必要的文件,下载地址:http://pan.baidu.com/share/link?shareid=134819&uk=1426351191,文件包内包括feed_email.php(小工具主文件)、contact.png(对应图标文件)、Theme_options.php(后台主题设置文件)、widget.php(widget调用文件)。

3

将对应文件上传到网站上对应的目录feed_email.php上传到\wp-content\themes\HotNewspro\includes\widget目录;contact.png上传到\wp-content\themes\HotNewspro\images目录;Theme_options.php和widget.php上传到\wp-content\themes\HotNewspro\includes目录。

4

将下面的代码添加到style.css文件中(可根据个人喜好进行调整设置): /*---订阅XXX---*/.box_c {background: #fff;width:224px;padding: 5px 0 5px 10px;border-left: 1px solid #ccc;border-right: 1px solid #ccc;} #contact-li li{float:left;margin:0 1px;}#contact-li li a{display:block;width:40px;height:40px;background:url(images/contact.png) no-repeat;text-indent:-9999px;}#contact-li li.twitter a{background-position:0 -40px;}#contact-li li.qqmblog a{background-position:0 -80px;}#contact-li li.sinamblog a{background-position:0 -120px;}#contact-li li.qq a{background-position:0 -160px;}#contact-li li.rss a{background-position:0 -200px;} .feed-mail{border-radius:4px;border:#dbdbdb 1px solid;padding:12px 0 12px 12px;box-shadow:0 0 4px #eee;margin-bottom:10px} .feed-mail-input{width:145px;height:25px;line-height:20px;padding:4px;vertical-align:middle;border:#dbdbdb 1px solid;background-color:#fff} .feed-mail-btn{width:55px;height:25px;vertical-align:middle;border:#dbdbdb 1px solid;margin-left:4px;cursor:pointer}

5

通过以上操作,就完成了!下面到后台→外观→小工具,里面就会看到名为“订阅XXX”的小工具(“订阅xxx”这几个字在feed_email.php文件中修改),我们将其拖到想要显示的位置,再到后台的主题设置中,展开“微博及订阅设置”即可进行相关设置

注意事项
1

如果发现添加插件后网站变形,将widget.php文件用Notepad++打开,点击“格式”,选择“以UTF-8无BOM格式编码”,再保存文件即可解决

2

以上方法也同样适用于其他WP主题,具体可根据自己的需要调整相应参数即可

推荐信息