改进了下主题的式样

前几天把主题的sidebar式样改进了一下,把单个日志的single.php页面改为单侧边栏,日志内容的宽度也相应增加。这其实是很久前就有的想法。首页用双侧边栏是想显示更多的信息,让浏览者能有更多的选择,而不必作出很多点击。然而,进入日志页面后,读者的注意力就全部集中在了日志内容本身,这时增宽content,能让浏览者获得更多空间,有更好的用户体验。另一方面,右侧的侧边栏很多内容不必再需要,而是可以加上最新评论、随机日志、热门排行等和日志更为相关的部分。由于对CSS和PHP本身都不是很熟悉,只能在网络上搜索方法,好在最终还是搞定了。

首先,想在首页显示两个sidebar,而single页面只显示一个,这个siderbar的内容和前两者还不同,那么原本的两个sidebar就可以不动,采用完全加入一个新sidebar的方法。首先找到single.php,在中间可以找到下述代码:

< ?php get_sidebar(); ?>

修改为:

就是在single页面内引入一个新的sidebar文件,当然singlesidebar.php是要你自己手写并传到主题文件夹下的。新的sidebar我没有考虑使用widget,完全手写,这样自定义度高很多,也能省去很多麻烦。

但是,后面的问题却让我很头疼。single页面是只有一个sidebar了,但是布局还是和首页一样的,也就是说一个sidebar占据了原来两个的宽度,并没有我想象中的效果。由于对CSS并不熟悉,只能用笨方法解决了。我把style.css中的content和sidebar部分完全复制了一遍,然后重命名为content_single和sidebar_single,再修改下width,套入singlesidebar中,就实现了现在的效果。

现在single页面的sidebar还是空的,需要手写加入内容。我用了中文WordPress工具箱中的函数,并作出了一些修改。最新留言中除去作者自身,另外主要加入了本月最热日志的函数。在get_mostcommented函数中,找到

post_date < '".date("Y-m-d H:i:s", (time() + ($time_difference * 3600)))."'

的条件,在后面加上

AND post_date > '".date("Y-m-d H:i:s", mktime(0, 0, 0, date("m"), 1, date("Y")))."'

PHP中Date/Time函数的详解,可以看这里

对于sidebar的调整,或者它的内容、排序,期待大家的留言反馈。

15 thoughts on “改进了下主题的式样

  1. 单篇日志确实应该用单侧栏。但是你的方法确实。。。这个主题支持 Widget?

    [回复]

    NickyYe 于 2008 年 10 月 23 日 21:56 回复:

    我对于css和php确实是菜鸟,还请多赐教了,显然是支持widget的。我要是用这东西,就要代码添加多个widget,不然只有一个又无法在多sidebar里用。

    [回复]

  2. 支持 Widget 的主题确实有些不好改。
    你可以分离两个侧栏,即让左侧栏和右侧栏都单独作为一个文件。然后再在不同的页面根据需求 include , 这样就好办多了。

    [回复]

    NickyYe 于 2008 年 10 月 23 日 22:06 回复:

    嗯,不用widget的话,手写要方便很多。你说的方法我了解的,可以用is_home()来判断。但我认为,从理解性、清晰性来讲,另外写一个更好吧,以后想修改也更方便。程序设计里面的high cohesion不就是这个意思么?一个类(这里可能是文件吧)干不属于自己的事,以后维护就更麻烦。
    另外,我觉得这个并不是问题的关键啊。关键是我觉得我处理css的方法太笨了,但又想不出其他的。

    [回复]

    Shawn 于 2008 年 10 月 23 日 23:08 回复:

    我又看了一遍你写的,明白了,刚才可能没看懂。
    其实在这种问题上,你可以用最简单的思路来解决问题。
    先看变化:在首页时,div#entries 宽度为 500px,在单页面,增加宽度,变为 620px;首页,侧边双栏,每个栏目宽度 180px。单页,侧边单栏,宽度 270px。
    好,最简单的方法。
    思路:进入单页,div#entries 变宽,侧边栏隐藏一边,另一边增加到 270,同时 #sidebar 也变为270px。
    运用 if(is_single),来直接给上面提到的 div 加 style,问题就解决了。
    举个例子,<div id=”entries” <?php if(is_single()) { ?>style=”width:620px”<?php } ?>>

    [回复]

    NickyYe 于 2008 年 10 月 23 日 23:15 回复:

    嗯,可以用硬代码实现,确实灵活很多。多谢~

    [回复]

  3. 一个建议, 你可以考虑把首页 sidebar 里的”存档”去掉, 因为你的导航栏里已经有存档按钮了…

    [回复]

    NickyYe 于 2008 年 10 月 23 日 22:08 回复:

    嗯~这个我装插件的时候就考虑过,很长载入也费时间。但我那是想,有人要根据找的话,直接点就行了。细细查看再到上面的页面去吧,呵呵。

    [回复]

  4. 我,我,我,无视你的更新。
    现成的优质BSP你不用,在这自己捣腾,讨厌~

    [回复]

    ronin 于 2008 年 10 月 24 日 10:08 回复:

    其实我也有点后悔, 不折腾,毋宁死~~

    [回复]

    NickyYe 于 2008 年 10 月 24 日 10:22 回复:

    后悔个毛,独立的用的不爽阿。
    怎么前后半句矛盾的你~

    [回复]

  5. 雅黑的字体吧,感觉字体在非IE浏览器下有点会发虚,读着眼睛有点累,不知道别人是不是也这样~

    [回复]

    NickyYe 于 2008 年 10 月 24 日 13:35 回复:

    是啊,我自己就是firefox浏览器,感觉还行嘛,呵呵。
    谢谢你的反馈。

    [回复]

发表评论

电子邮件地址不会被公开。 必填项已用*标注