TypeCodes

启用CMS类型的博客主题,vfhky再次回归

由于种种原因,原定于5月底更换的主题未能正常上线。本以为最迟应该可以在6月份完成的,但是毕业设计、毕业旅行、回家……种种的种种,让我不得不停下来;本以为毕业后时间还很长,就像刚进大学时候觉得大学四年会很漫长,结果就是后知后觉了。好吧,不罗嗦了,直接进入主题:

1 主题变更缘由

博客从12年6月12开始至今,一直用的是威少的主题weisaysimple,简洁明了,很适合IT类的博客。但是随着博客主要内容的拓展,感觉还是将这种博客类型的wordpress主题改成CMS系列的主题比较合适。在今年4月份博客申请huangkeye.com、huangkeye.cn两个域名备案期间,vfhky测试过很多CMS类型的wordpress主题,最后选择了 huishao 的 风云时代主题。在CMS类型的博客主题中,huishao的这款也是很简洁明了,因此vfhky也特别中意。都是很优秀的两款wordpress主题,威少和huishao的设计真心不错,再次感谢两位!

2 主题源程序改进

huishao的这款风云时代主题主程序比较庞大,比如主程序和include两个文件夹中有较多的代码是可以合并、删除、简化的。另外后台功能,例如:博客、cms风格的选择以及视频功能等,也是可以删掉的。vfhky所做的主要是两个方面,一个是代码的精简优化,另一个是功能的丰富、便捷以及实用化。这中间参考了vfhky之前改进后的威少的这款主题以及自己动手实现的几个功能。那么接下来就说说vfhky对这款主题几个比较重要的个性化改进的具体过程。

2.1 主题代码的精简

代码的优化改进,其目的还是更好的用户体验。页面的快速加载、使用的便捷清晰以及功能的丰富实用化等等,这些都是奔着用户体验去的。当然,代码的简化直观的体现可以从程序文件看出来。原先风云时代的程序共有191个文件(包括程序和文件)和12个文件夹,经过精简优化后,减少了近30个文件。另外,程序的体积也大大减小,源程序共有721K,优化后只有461K了。

2.2.1 功能改进之搜索

原主题采用后台设置使用博客自带的搜索还是使用谷歌自定义搜索功能。考虑到若是使用博客自带的搜索,会增加服务器的负担,再者自带的搜索功能也不是很精准,因此决定采用“谷歌自定义搜索+百度站内搜索”结合的模式。一来可以减轻服务器的负担,二来可以使搜索功能更强大,改善用户体验。另外对搜索的样式也采用jquery优化,应该比之前好看些吧?嘿嘿

2.2.2 功能改进之右侧栏

原主题会在后台设置很多小工具的选项,但是vfhky在使用的过程中总是需要对照着huishao的主题说明来拖拽小工具,这与喜欢清晰简洁风格的我不太合口味。因此,通过对functions.php和theme_options.php和widget.php等文件的修改,删掉一些不需要的功能。然后新建一个php文件,把一些需要用到的小功能整合在一起。于是形成了右侧栏的两个jquery自动从左向右滚动的TAB栏目。另外对”最新评论“也采用了jquery功能实现滚动浏览,方便用户浏览。

2.2.3 功能改进之广告加载

原主题对广告采用了直接加载模式,但是如今的广告都是通过外部加载JS来实现的。然而WEB的加载模式一般是按顺序来加载的,因此,当网络状况较差的时候会导致广告内容一直在加载而博客内容却无法加载的情况。因此,新建一个addelay.php文件来决定在不同页面加载不同广告以及在文本内容加载完后才加载广告(大体思路是:通过wordpress页面判断函数以及用javascript在footer.php末尾加载广告JS代码)。

2.2.4 功能改进之评论列表

摒弃使用WP-UserAgent插件来显示评论者的所属国家、操作系统、浏览器、ISP服务商等信息,通过在functions.php添加相关代码实现。其中,ISP服务商的显示是通过JS调用新浪IP库并延迟加载实现的,减少网页的整体载入速度。

2.2.5 功能改进之评论框

增加评论验证码来防止机器人评论;通过jquery增加评论框的编辑器功能,插入表情、插入图片更为方便,同时读者能更便捷的编辑自己的评论内容;最大限度开放评论HTML标签功能,通过span style标签能实现很多功能哟。

2.2.6 功能改进之正文代码显示

原先vfhky改进的威少的主题在正文中贴代码是通过wp-codebox插件实现的。这个国产插件体积比较庞大(当然功能确实是杠杠的),所以为了加快页面载入速度,决定摒弃代码高亮插件,采用google code pretty实现。

2.2.7 功能改进之内链审查

相信很多博客都遭遇过一些无聊spamer在评论中写一些广告或者其它无关文章主题的内容。他们目的当然是增加自己的广告或者而已软件的曝光率,但是对博主来说来说这些带有外部广告链接的评论信息会大大降低博客的整体形象,对来访的用户造成不良印象。所以,vfhky决定对外链进行审核认证,最终对广大读者公开显示这些链接信息的审核认证的结果。所以希望那些发广告的童鞋要还是好好读一下文章,广告可以发专门的广告论坛嘛!当然,希望那些优质的IT、社区空间、程序设计类的站点提交自己的站点给大家分享分享哦!

外链安全访问提示

3 后续

本次主题的界面CSS优化改进是基于1366 * 768屏幕分辨率+IE9+FF22.0+360极速(基于Chrome26.0)+Chromium28.0浏览器测试的,所有页面均显示正常(IE7及以下的浏览器不作考虑)。当然,由于vfhky对界面CSS不太熟悉,所以也不敢说解决了浏览器的兼容问题。因此,推荐大家在访问博客时使用Google Chrome 26.0(及以上的版本)+1366 * 768的屏幕分辨率来获取最佳体验。另外,考虑到博客的安全性问题,决定不采用在线投稿的功能了,但是vfhky特别希望大家给黄克业的博客投稿。投稿方式可以通过注册博客的会员(评论时会出现博客的认证图标),也可以通过邮件[email protected]投稿。当然投稿内容需要符合博客的整体风格,但一定要是原创性的文章(特别稀饭编程技术类的原创文章)。投稿可以保留作者的一切权利,包括文章的外部链接等。

4 结语

从4月备案通过、做301域名跳转huangkeye.com到huangkeye.cn,到今天博客启用新主题,整整3个月了。这之间没怎么写文章,百度的收录也骤降,但是GG的收录还是挺好的。后面的话,vfhky会在周末定期更新文章。最后,希望广大读者对在博客阅览时遇到的Bug予以反馈,我会及时修复更正,先谢谢咯!

5 另附:威少主题改进终极版

之前博客用的威少的主题,经过vfhky的几次修改,提供终结版下载,新主题中用到了这里面较多的源代码,有兴趣的童鞋可以参考下。下载地址是:

http://pan.baidu.com/share/link?shareid=164552794&uk=1879910561

打赏支持

Comments »