WordPress自定义 – 改变默认的Widget
WordPress2.2默认提供了Widget，其中包括“日历”、“分类”、“存档”、“最新文章”、“最新评论”、“链接”、“相关链接”等默认的小插件。此外你还可以自定义文本内容或者RSS，不过，文本内容目前不支持PHP代码，只能支持HTML/Javascript代码，如果你想把包含PHP的代码片段放到侧边栏的Widget区域中，就需要更改你主题下面的sidebar.php了。
一、在WordPress自带的Widget后面添加自定义的PHP片段：
以Webby-Blue 为例，打开sidebar.php找到下面的代码：
<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar() ) : ?>
这表示如果不启用默认的Widget的话，会在下面显示sidebar中自定义的widget。
如果你要添加自定义的PHP片段，又想使用WordPress自带的Widget，你可以在sidebar.php最后找到下面的代码：
<?php endif; ?>
在这一行的后面，手动把你的PHP代码添加到sidebar.php即可。
【注】：这种办法比起修改widget.php，手动注册自定义Widget来说，更方便一点。
缺点是：你只能把自定义的PHP代码段加到默认Widget组的最开头或者最末尾。
其实，也不是不能办到，下面介绍如何增加多个Widget区域。
二、增加WordPress默认的Widget区域：
WordPress的Widget是在你主题目录下的functions.php中注册的。
以Webby-Blue 为例，打开functions.php，会看到如下代码片断：
<?php
if ( function_exists(‘register_sidebar’) )
register_sidebar(array(
‘before_widget’ => ‘<div id=”%1$s” class=”widget %2$s”>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<h2 class=”sidebartitle”>’,
‘after_title’ => ‘</h2>’,
));
?>
把代码片断中的：
register_sidebar(array(…
换为下面的代码：
// 数字2可以换成你想定义的Widget区域的数目。
register_sidebars(2, array(…
保存，然后，打开sidebar.php,找到下面的代码片段：
<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar() ) : ?>
…
<?php endif; ?>
把它改为：
// 显示第1个Widget组。
<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(1) ) : ?>
…
<?php endif; ?>
在第1个Widget组显示完以后，你可以接着显示第2组：
// 显示第2个Widget组。
<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(2) ) : ?>
…
<?php endif; ?>
保存文件，在后台管理的“模板”->“Widget”页面，可以看到由默认的一个Widget区域显示为2个。你可以从下面的“当前可用的 Widgets”中拖动到需要的Widget区域。
【注】：“当前可用的 Widgets”中的Widget不能同时出现在任意两个Widget。
三、将自定义的PHP代码片段穿插在WordPress的Widget中：
上面介绍了如何添加自定义的PHP代码片段，以及如何增加系统默认的Widget数目。有了上面的介绍，相信大家已经知道怎样自定义PHP代码片段的位置了。
没错，只需要将自定义的PHP代码片段插在Widget组之间，通过自定义Widget组里面显示的Widget，就可以达到随意调整PHP代码片段的目的。
我把自己的Webby-Blue主题更改为三栏显示，自定义了Widget的显示，呵呵。
本站演示地址：http://www.fadesky.com
(8 votes, average: 4.25 out of 5)
Loading ...
2007年07月03日 19:07:01
上次就是看了你这篇文章,还收藏了…呵呵…不错…
回复
2007年07月14日 23:07:39
啊
请问博主,你的这个模板是怎么改成3栏的呢
我是了很多次,都改不成3栏
因为我基本不会php…
望指教,谢谢
回复
2007年07月15日 13:07:26
这个和PHP基本没什么关系。你需要修改下面两个文件：
1. style.css
把其中的#page中的width改宽，具体值，你可以参考下面的。
#page {
margin: 0px auto;
width: 990px;
}
然后，找到#sidebar，计算一下大致的宽度，参考下面的：
#sidebar {
float: right;
padding: 7px 5px 20px 0px;
width: 390px;
color: #666666;
overflow: hidden;
}
2.sidebar.php
把包含在<div id=”sidebar”>…</div>中的所有DIV的CSS的float属性改为：”float: left”
注意控制宽度就可以了。
你可以多试几次，主要是把握布局的宽度，在firefox下用firebug可以很方便地查看页面元素的CSS、宽度…属性。建议你装一个插件调试。
回复
2007年07月15日 15:07:30
诶呀
终于改好了
真累,不过不是用的mougua的方法.
因为我的sidebar是用Widgets实现的,修改sidebar.php里面的内容没有效果…
但是收到这篇文章的启发,
我把sidebar改成2列.
美列里面一个widgets,
不过这样其实没有mougua的好,无法实现跨2列的效果.
不过已经满足啦.
回复
2007年07月15日 15:07:36
诶呀呀
不好意思,说错了说错了
不是mougua,
是fadesky,
因为最近也在和mougua讨论模板的事情,
回复时候就看错了,
fadesky不要见怪
回复
2007年07月15日 20:07:10
跨两列也可以的，在sidebar的<div id=”sidebar”>…</div>中，直接插入一个DIV，宽度设为100%就可以了。
如果要控制两列的显示更加整齐一点，也可以先插入一个大的DIV，然后在里面分别插入两个小的DIV，分别把CSS的float属性设为left即可。
回复
2007年07月16日 19:07:28
嘿嘿“
搞定
回复
2007年08月29日 14:08:55
我用和你一样的主题，改天整整！
回复
2007年10月21日 22:10:41
lz，我想请问一下，如何实现侧边栏每一项内容都用那个框框起来？
回复
2007年10月22日 10:10:03
TO keke:
如果你的Wordpress使用了Widget，那么每一项的内容输出后的DIV应该应用class=”widget”.
所以，你在所用主题的style.css中，找到widget的CSS定义，添加一个边框的CSS就可以了。
回复
2007年10月22日 11:10:58
谢谢你。。。。慢慢去研究一下。。。
回复
2008年06月20日 09:06:48
[...] 但是我的代码大概与widgets冲突，一直没有改变侧边栏的分类模块，使其显示我们希望的RSS链接。更新：找到了中文HowTO上面提供的解决方法，有效。 [...]
2009年05月01日 02:05:57
我的网站www.kziz.cn的文章页面widget老是会自动调到底部去出现错版，怎样让他上来啊，能帮我看看吧，谢谢
回复
2010年04月09日 22:04:50
[...] http://www.fadesky.com/software/how-to-change-default-widget-for-wordpress/ [...]
2010年06月21日 23:06:13
[...] 中文HowTO：WordPress自定义 – 改变默认的Widget Graygift@ye：Comment.php模板的制作详解 Life Studio：个性化 WordPress 友情链接页面 MUKI space*：語法 | WordPress不用插件直接實現五種文章代碼 Justin Tadlock：Goodbye, headaches. Hello, menus! Clap給個鼓勵、拍個手吧！Total: 0 / Average: 0 :-) Category: Website & Blog Tags: Themes, WordPress No comments [...]
2010年06月23日 23:06:37
[...] 开始的时候，直接把小工具里面的“文本”拉到右边，因为“文本”下面的解释就是：任意文本或HTML。而我需要的就是要加一段HTML代码，所以就选他了。但是回到博客首页刷新，结果之前的侧边栏“最新文章”、“最近评论”等，全部消失了，我就仔细的看了下木木写的sidebar.php。（由于我不懂PHP，所以只能看懂HTML和简单的if,else这种语句…）无意Google了一下“dynamic_sidebar”，结果找到一篇文章，正是介绍这个的。 [...]