软件下载 | 资讯教程 | 最近更新 | 下载排行 | 一键转帖 | 发布投稿
您的位置:最火下载站 > 设计在线 > 平面设计 > 两步搞定 WordPress 多区域 widget

两步搞定 WordPress 多区域 widget

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' => '<div id="%1$s" class="widget %2$s">',
'after_widget' => '</div>',
'before_title' => '<h4>',
'after_title' => '</h4>'
));

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

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

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

<div id="search-3" class="widget widget_search">
<h4>Search</h4>
<form role="search" method="get" id="searchform" action="http://localhost/283/" >
<div>
<label class="screen-reader-text" for="s">Search for:</label>
<input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Search" />
</div>
</form>
</div>
需要注意的是为开始<div>标签生成的批注(markup),该批注根据widget数组指定的通配符匹配获取相关的属性信息。

下面继续第二步骤。

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

<div id="widgetized-area">

<?php if (function_exists('dynamic_sidebar') && dynamic_sidebar('widgetized-area')) : else : ?>

<div class="pre-widget">
<p><strong>Widgetized Area</strong></p>
<p>This panel is active and ready for you to add some widgets via the WP Admin</p>
</div>

<?php endif; ?>

</div>

相关阅读
栏目导航
推荐软件