WordPress 中右侧 sidebar 下沉至页面底部的解决办法

用了 WordPress 有一段时间,也自己摸索解决了一些奇怪的问题。今天在 WordPress 的 Google Group 中发现有人同样遇到了我曾经同样遇到过的问题:IE 浏览 WordPress blog 时,右侧 sidebar 下沉。(在 Firefox 浏览器中不存在这个问题。)

WordPress 右侧 sidebar 下沉到页面底部的症结在于:由 WordPress 程序自动生成链接的 HTML 代码中,sidebar 中 links 的分类名称处,多了一组冗余的标签 <h2> ,从 CSS 的角度讲,使得 sidebar 所在的盒子宽度增大。多出的这组标签在 Firefox 浏览器中没有造成严重的影响,只是浏览器底部多出了个水平滚动条,将其向右拖动则会看到空白区域。但是在 IE 中(因为 IE 对 CSS 的解释有些问题),页面右边排放不下,自然会“换行”下沉到页面底部。

现在解释一下我是怎么解决的。找到生成 links 的函数 get_links_list(),在文件 wp-includes/links.php 中。找到第548行:

echo '  <li id="linkcat-' . $cat['link_category'] . '"><h2>' . $cat['cat_name'] . "</h2>nt<ul>n";

将其改为:

echo '  <li id="linkcat-' . $cat['link_category'] . '">' . $cat['cat_name'] . "nt<ul>n";

保存后,即正常。

9 Comments »

  1. Zhang-Zi Said,

    May 10, 2006 @ 7:37 pm

    首先,不知道你是否很少用IE?你是否知道你这个Blog本身就变形的利害?

    其次,直接修改源代码不是一个被提倡的方式,我认为直接修改你的CSS中siderbar的h2的style比较好。

  2. Frank Said,

    May 10, 2006 @ 7:58 pm

    我确实很少使用 IE。WordPress 中插入程序代码从来就是一个老大难问题,我也没有找到特别理想的方法。这里页面变形就是因为代码行太长,撑宽了盒子。不过,Firefox中显示则是正常的。感谢您的建议,我会再考虑如何增强与 IE 兼容问题。
    之所以修改该处的源代码,是因为 WordPress 源代码里的那个 h2 标签确实是不伦不类。事实上,除了 get_links_list() 函数外,其余的生成列表函数都没有在 li 标签后再附加一个 h2。我尝试过很多别的 Themes,它们都有类似的问题,如果一一修改它们的 CSS,就不如直接改源代码更方便了。

  3. alloyli Said,

    May 10, 2006 @ 9:16 pm

    我的网页也出现了这个问题,在IE中侧边栏到最底部,而firefox中确正常。并且按照您的方法进行了修改。但是还是不行啊?

  4. Frank Said,

    May 10, 2006 @ 9:48 pm

    我这里暂时无法访问的网站。建议您更换一个主题(theme),再试试问题是否依然存在。将 WordPress 生成的页面保存为本地文件,并将右边一列的内容逐项删除,以排查、确认是哪个栏目或哪个插件出了问题。

  5. 时空驿站 » Blog Archive » 花了2个小时解决2个问题 Said,

    May 10, 2006 @ 10:07 pm

    [...] 2。侧边栏的问题,看了WordPress 中右侧 sidebar 下沉至页面底部的解决办法但是好像对我的不行。不想一个一个对比参数,于是重新上传了一次default的文件。哈哈问题解决。 [...]

  6. faintbear Said,

    June 21, 2006 @ 11:24 pm

    谢谢,果然解决了~

  7. Comet Said,

    August 30, 2006 @ 11:47 pm

    你好。。。我是刚刚开始用wp的,也出现了这个问题,但是用你这个办法之后仍然无法解决单独一篇
    blog页面的sidebar下沉问题,请问要在哪里修改?改什么代码呢?非常感谢!!!

  8. 域名 Said,

    March 30, 2007 @ 3:54 pm

    谢谢

  9. 主升浪日志 » Blog Archive » WordPress安装与调试 Said,

    December 16, 2007 @ 7:29 am

    [...] 原因与专业的解决办法:1,2;业余的解决办法:重新下载一个theme。 [...]

RSS feed for comments on this post · TrackBack URI

Leave a Comment

You must be logged in to post a comment.