将WordPress默认蓝色主题改为宽屏版

WordPress自带的default主题大家都再熟悉不过了。顶部那一块经典的蓝色,简洁又不失漂亮。我也一直很喜欢它,可惜它有一个致命缺点,那就是首页和归档页的文章主体宽度太窄,当年用PJBLOG的时候我插入的图片宽度都为550px,如果换上default主题,那么就会有大量图片“挤压”侧边栏。所以一直想找个宽屏版的WordPress默认主题,今天终于如愿以偿。

WordPress默认主题改为宽屏版,我觉得有必要记录一下,所以就写篇日志记录一下吧。

1,修改single.php文件,将侧边栏加入文章页
将第十行的

1
<div id="content" class="widecolumn" role="main">

修改为

1
<div id="content" class="narrowcolumn" role="main">

然后将最底部的

1
2
3
</div>
 
<?php get_footer(); ?>

改为

1
2
3
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

至此,文章页中已经出现了侧边栏。

2,修改CSS文件,将宽度变大
请按照下列过程依次修改style.css文件:
将 #headerimg中的width由740px改为940px;
将 #page中width由760px改为960px;
将 #header中width由758px改为958px;
将 .narrowcolumn和.widecolumn中的width由450px改为650px,这个操作直接让文章内容区域变宽;
将 #footer中的width由760px改为960px,这是在操作页尾;
将 #sidebar中的margin-left由545px改为745px,这一行是侧边栏距页面左边的距离,
因为全部都是改width,这里教大家一个方便的方法,直接搜索“width”,可以快速定位每个width,然后利用查找上一个(下一个)的功能,快速定位下一个width。

3,修改背景图片宽度
编辑wp-content\themes\default\images目录下,将
kubrickbg-ltr.jpg
kubrickbg- rtl.jpg
kubrickbgwide.jpg
kubrickfooter.jpg
kubrickheader.jpg
这5张图片的宽度由760 改为960。注意,不要修改其高度,如果你用PS修改,记得将“约束比例”前的勾去掉。

至此,WordPress默认主题已改为宽屏版。感谢明泉兄弟提供的方法

如果你怕麻烦,也可以下载我修改好的主题,上传即可(只修改过宽度,其它未改动)。你也可以再发挥一下自己的创意,比如将字体改为微软雅黑等。

以下内容你肯定也感兴趣:

将WordPress默认蓝色主题改为宽屏版》有 19 条评论

  1. 江南轩榭 说:

    这款默认主题确实很经典

  2. 天晴轩 说:

    呵呵 哪款黑色的不错

  3. Tiang 说:

    嘿嘿不错,一直觉得默认的主题很好,很多wp的功能都用上了

  4. 古墓候梅 说:

    下载了,准备以后将我的bo-blog转换成WP时再用。

  5. 古墓候梅 说:

    我按照网上的教程转了几次都失败了,真不知道该怎么办?

    • admin 说:

      如果真的转不了,那么就花点时间一篇一篇地复制吧,69篇文章要不了几个小时的。

  6. 古墓候梅 说:

    也只有这样了。

  7. 明泉 说:

    谢谢推荐,不胜感激。 :wink:

  8. hongwang777 说:

    我改成860。如果840或許更好。

  9. hongwang777 说:

    斑竹,我覺得我自己的Archives(全部文章目錄)比較實用,你可以看看。

  10. weishimi 说:

    请问如何日志中的字体大小?

  11. juwenfeng 说:

    能否将您的博客制成模板发给我学习学习,谢谢您!
    juwenfeng@126.com

    • bear 说:

      什么叫“博客制成模板”??我现在使用的模板,上面不是提供的有下载地址么?

  12. 显成 说:

    谢谢!

  13. w3abc 说:

    谢谢,用上去了,比之前窄的好看些!

  14. 电视棒 说:

    谢谢,很有用

发表评论

电子邮件地址不会被公开。

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">