编辑“WordPress主题Widget优化”

<span style="border:1px solid #000; text-align:center; float:right; padding:6px;"><strong>导航:</strong> [[WordPress开发文档|上一页]] | {{Template:WordPress导航}}</span>
<div style="clear:both;"></div>
'''我是个WordPress模板主题制作者，为什么有人给我发送邮件要求我升级主题？'''

这说明你制作的主题很受欢迎，别人愿意花时间请你进一步优化主题，而不是寻找其它主题。恭喜你！为了能让你的主题用户更好地使用你开发的主题，现在就开始升级主题吧。Widget现在已经正式成为WordPress博客的一部分，你的主题也应该在支持旧式侧边栏的同时兼容widget，这样才可能获得更多用户。

==我要怎么修改主题呢？==

首先你需要问问你自己，“我是不是完全了解自己所用的主题？这个主题是用无序列表来创建侧边栏的吗？”（如果你回答不出这个问题，那么你需要寻找进一步帮助了，你可以选择花很多钱请人提供专业帮助，也可以到WordPress论坛上提问。当然你还可以自学HTML，不过这里我们就不详细讨论了。）

下面就是一个很好的侧边栏标记的示例：
 < ul id="sidebar">
 < li id="about">
 < h2>About</h2>
 < p>This is my blog.</p>
 </li>
 < li id="links">
 < h2>Links</h2>
 < ul>
 < li><a href="http://example.com">Example</a></li>
 </ul>
 </li>
 </ul>

这里可以注意到，这整个侧边栏是一个无序列表，列表标题在< h2>标签中。不是所有主题都是这种构建方式，也没有必要依照这种方式，不过据调查这是一种最常见的侧边栏标记，所以我们用它来作为示例。我们可以把id=”links”元素当作是一个基本的widget。

[http://codex.wordpress.org/Widgets_API Widgets API]介绍了一些可以用在模板中的函数，可以把这些函数当作模板[[标签]]使用。通过这些函数，WordPress用一个动态侧边栏取代原先的侧边栏，万一你移除所有widget，则恢复使用原有侧边栏。

下面是一个简单的侧边栏升级示例，以上个示例中的侧边栏标记为基础：
 < ul id="sidebar">
 <?php if ( !function_exists('dynamic_sidebar')
 || !dynamic_sidebar() ) : ?>
 < li id="about">
 < h2>About</h2>
 < p>This is my blog.</p>
 </li>
 < li id="links">
 < h2>Links</h2>
 <ul>
 < li><a href="http://example.com">Example</a></li>
 </ul>
 </li>
 <?php endif; ?>
 </ul>

看见了么？我们只是在模板中添加了两行代码，现在它就可以尽可能地显示动态侧边栏了（如果无法显示动态侧边栏，则仍然显示原有的侧边栏）。若在管理面板中删除侧边栏的所有widget，显示的将是原有侧边栏。

接下来还需要做一件事。如果你使用的是WordPress 2.0或以上版本，请在主题目录的functions.php中进行以下改动。

注意：下面有些例子可能涉及对主题functions.php文件的修改，修改不当会导致管理界面无法显示。建议做任何改动前，先备份functions.php。

下面是一个没有侧边栏文件的主题中的functions.php文件示例（注意文件前后不能有空行）：
 <?php
 if ( function_exists('register_sidebar') )
 register_sidebar();
 ?>

是的，只有四行。这四行代码告诉插件，你的主题需要一个动态侧边栏。这时在你的管理面板的外观菜单下，会多出一个选项——侧边栏widget。你可以试着将左侧的一些widget拖拽到标记为Sidebar 1的方框中，然后保存修改。侧边栏发生变化了么？很好。
==我的侧边栏不是列表形式的，怎么办？==

首先你需要知道自己侧边栏的设计样式，然后利用一些参数告诉widget怎样让他们配合主题工作。下面我们来看一个例子。

下面是原始标记：

 < div id="sidebar">
 < div class="title">About</div>
 < p>This is my blog.</p>
 < div class="title">Links</div>
 < ul>
 < li><a href="http://example.com">Example</a></li>
 </ul>
 </div>

根据调查，这是第二常见的侧边栏设计样式。它和上个例子中的侧边栏的最主要区别在于，它不是构建在< ul>标签中的。这就表示我们不能用< li>标签包装任何widget。此外，这里的标题包裹在 < div class=”title”> 而不是< h2>标签中，这也是两者之间的重要区别。

我们可以将原始标记改成ul/li/h2的标准，但鉴于API的强大功能，我们没有必要这么做。相反，可以在functions.php中加入一些参数，以此修改原始标记：
 
 <?php  if ( function_exists('register_sidebar') )
 register_sidebar(array(
 'before_widget' => '',
 'after_widget' => '',
 'before_title' => '< div class="title">',
 'after_title' => '</div>',
 ));
 ?>

下面是插入特别模板标签的sidebar.php标记：
 < div id="sidebar">
 <?php if ( !function_exists('dynamic_sidebar')
 || !dynamic_sidebar() ) : ?>
 < div class="title">About</div>
 < p>This is my blog.</p>
 < div class="title">Links</div>
 < ul>
 < li><a href="http://example.com">Example</a></li>
 </ul>
 <?php endif; ?>
 </div>

OK，现在你的[[HTML]]标记也处理完毕。

不过只是基本处理完毕。默认的before_widget比< li>要略微复杂。before_widget包含了某种id和类，正是它们使得before_widget变得复杂。默认的before_widget包含sprintf指令%1$s 与 %2$s，分别被id和类所取代。通过过滤widget名称得到id（因此为widget命名时一定要谨慎，你不希望在一个HTML文档里出现重复的id吧？）；而类则是通过回调widget而生成的。这确保所有文本widget和RSS widget具备唯一id和相同类名称。此外，每个widget都有一个“widget”类。

因此，如果希望自己的主题尽可能灵活易用，最好用下面的代码代替上面的空字符串：
    'before_widget' => '< div id="%1$s" class="widget %2$s">',      
    'after_widget' => '</div>',  
现在HTML标记算是完全处理成功了。

==HTML代码一切正常，但是在浏览器中查看页面却乱了套！==
这种问题也时有发生。你可能是在widget出现之前开始编写主题，所以你不会想到以后要在侧边栏中加入新标记，也就不会把样式表编写得更具有灵活性。如果你熟悉[[CSS]]知道，可以在样式表的结尾处加入一些新规则，借这种方式解决问题。在博客标记语言中查看你需要重新设计的选择符（id或类）。

如果你对CSS一窍不通，很遗憾，我们也无能为力。你可以联系主题作者，请他升级主题，让主题能够更好地兼容widget。

这个搜索widget太难看了，我想用主题的原始搜索框作为widget

widget是可以进行CSS选取的，因此你可以对widget进行非常细致的设计。但标记语言却不能如此。如果所有主题都自带若干能够取代基本widget（像是搜索widget和meta widget）的widget，那么很多[http://www.wordpress.la/theme.html 主题]都会更加完美。通常你可以将sidebar.php中已有的标记复制到functions.php中的新widget里，然后利用注册函数，以自定义的新widget代替标准widget。

你可以在主题侧边栏的任何部分进行操作，下面是一个操作实例：
 function widget_mytheme_search() {
 ?>
 << PASTE YOUR SEARCH FORM HERE >>
 <?php
 }
 if ( function_exists('register_sidebar_widget') )
 register_sidebar_widget(__('Search'), 'widget_mytheme_search');

我的主题有不止一个侧边栏，要怎样才能让所有侧边栏都变成动态的？
这并不难。只要在应该使用register_sidebar()的地方使用register_sidebars(n)，其中n是你的侧边栏个数。然后将相应的个数填充到dynamic_sidebar()函数，最小值为1。

当然你也可以不使用侧边栏个数而使用侧边栏名称，这样每个主题都会有一套不同的侧边栏。
==相关条目==
*[[Drupal]] 
*[[OBLOG]] 
*[[X-Space]] 
*[[SaBlog-X]] 
*[[Bo-Blog]]

[[category:WordPress中文文档|Z]]
[[category:WordPress网站开发|Z]]
[[category:WordPress开发文档|Z]]