WordPress 的 Widget 小工具是个非常实用的功能,它让非技术型 WordPress 用户也可以根据自己对版面的需求轻松定制主题,WordPress 无数的 widgets 让用户得以尽情发挥自己的创意。 在很多人的意识里,widget 就是出现在侧边栏的小工具,不过实际上它可以出现在主题的任何地方。 这篇文章我们就来看一下怎样用简单的步骤让主题的其它版块也支持 widget 。 最后还会送上几个 widget 使用技巧。

第一步

在当前主题的 functions.php 文件里添加下面这段代码:

if (function_exists(‘register_sidebar’)) {

register_sidebar(array(
‘name’ => ‘Widgetized Area’,
‘id’ => ‘widgetized-area’,
‘description’ => ‘This is a widgetized area.’,
‘before_widget’ => ‘

‘,
‘after_widget’ => ‘

‘,
‘before_title’ => ‘

‘,
‘after_title’ => ‘


));

}
第一步就是这么简单。 代码添加完毕后就可以继续下一步了。下面是对第一步过程的解释,没兴趣的可以跳过。

上面的代码用以确保当前使用的 WordPress 版本支持 widget,并声明一个用来创建主题 widget 区域的值的数组。 下面我们来看看这些值:

Name——将要显示在 WP 管理界面的新 widget 区域的名称
Id——新 widget 区域的唯一标识符
Description——对新 widget 区域的说明
Before_widget——用户添加 widget 小工具前生成的批注
after_widget——用户添加 widget 小工具后生成的批注
Before_title——添加 widget 小工具的用户名前的批注
After_title——添加 widget 小工具的用户名后的批注
有了这些参数,我们的新 widget 区域最后会得到以下输出 (假设我们在新的 widget 区域添加的是一个内置搜索工具):

Search

需要注意的是为开始

标签生成的批注 (markup),该批注根据 widget 数组指定的通配符匹配获取相关的属性信息。

下面继续第二步骤。

第二步

你希望新的 widget 区域显示在主题的什么位置,就在相应的主题模板文件中添加以下代码:

Widgetized Area

This panel is active and ready for you to add some widgets via the WP Admin

当这一步骤也完成后,你所选择的位置上就会出现一个新的支持 widget 的版块,你可以在这个版块添加任何一个自己需要的 widget 工具。 接下来就能用相同的方法让主题的其它位置也支持 widget 工具了。

下面是对第二步骤的解释。 如果你没有指定 widget,那么 If/endif 语句之间的内容会被输出到浏览器。 通过这种形式,用户能了解到,自己可以在 WordPress 后台的 「小工具」 菜单中对内容输出的位置进行 widget 定制。 代码里还有一个 「pre-widget」 类可以设置 pre-widget 版块的样式。 当一个页面上出现多个 widget 区域时,可以用一个类名称来保持 widget 样式统一。

同时也要注意我们要将 widget 数组 (见第一步) 中指定的 id 作为代码第二行 dynamic_sidebar() 的参数值。

多个新 widget 区域

重复第一步和第二步,你就可以让主题的各个位置支持 widget 了。下面假设你需要在主题的头部、侧边栏、和底部添加 widget 。 那么首先你需要把下面的代码复制到 functions.php 文件里:

if (function_exists(‘register_sidebar’)) {

register_sidebar(array(
‘name’ => ‘Header’,
‘id’ => ‘header’,
‘description’ => ‘This is the widgetized header.’,
‘before_widget’ => ‘

‘,
‘after_widget’ => ‘

‘,
‘before_title’ => ‘

‘,
‘after_title’ => ‘


));
register_sidebar(array(
‘name’ => ‘Sidebar’,
‘id’ => ‘sidebar’,
‘description’ => ‘This is the widgetized sidebar.’,
‘before_widget’ => ‘

‘,
‘after_widget’ => ‘

‘,
‘before_title’ => ‘

‘,
‘after_title’ => ‘


));
register_sidebar(array(
‘name’ => ‘Footer’,
‘id’ => ‘footer’,
‘description’ => ‘This is the widgetized footer.’,
‘before_widget’ => ‘

‘,
‘after_widget’ => ‘

‘,
‘before_title’ => ‘

‘,
‘after_title’ => ‘


));

}
接下来把下面的代码分别添加到 header.php 、 sidebar.php 和 footer.php 文件中。

header.php:

Widgetized Header

This panel is active and ready for you to add some widgets via the WP Admin

sidebar.php:

Widgetized Sidebar

This panel is active and ready for you to add some widgets via the WP Admin

footer.php:

成功! 当然你也可以根据自己的需要调整代码中的各种细节,但是以上两步就是使主题其它版块支持 widget 的全部过程。 接下来要说的是一些 widget 的技巧。

Widget 使用技巧

管理自定义的 widget 小工具

给主题添加新的 widget 后,你可以新建一个独立文件夹并命名为 widgets.php,将所有自定义的 widget 都保存到这个文件夹。 用下面的这行代码实现保存自定义 widget 功能:

if ($wp_version >= 2.8) require_once(TEMPLATEPATH.’/widgets.php’);

将代码添加到 functions.php 文件里,然后将所有自定义的 widget 工具保存到 widgets.php 中。这种方法可以确保所有 widget 都能够顺利加载并且运行在 WordPress 支持 widget 的所有版本上。 如此,你的主题文件就能够得到有效管理。

替换 WordPress 默认 widget

WordPress 的很多默认小工具都有需要改进的地方。 但值得庆幸的是,在 WordPress 里你可以自由替换这些默认小工具。 例如,下面这段代码就可以将内置搜索工具换成你自己需要的 widget 工具。

register_sidebar_widget(__(‘Search’), ‘custom_search_widget’); ?>
隐藏不用的 widget 区域

如果你通过上面的方法让主题的某个位置支持了 widget,但暂时没有在这个位置上安排合适的小工具,那么这个位置就会空出来,从整个版面看上去会很奇怪。 为了避免这种情况,请用下面的代码围绕暂时不用的 widget 区域:
有了上面这段代码,支持 widget 的版块只会在确实包含已启用小工具的情况下才显示在前台。 。 同时需要注意,这段代码也支持显示 widget 外的其它内容。