Dreamcolor's Cote

本文主体内容，翻译自：WordPress 2.5 Plugin Settings Pages Style Guide。文中图片摘自原文，我只是按照原文的思路从新叙述了一遍。本文地址：让您的插件设置页面符合 WordPress 2.5 的后台风格。如想转载本文，请连同以上信息一起转载，谢谢合作。

各位插件设计作者………………好！现在有这么个事儿。各位设计出来的插件，后台设计界面可能灰常地漂亮。但是有没有发现用在 2.5 下面以后，已经不是当初你所设计的样子了。仿佛不是很符合 WordPress 2.5 的后台整体风格。最近发现一篇比较有用的文章，可以指引大家如何让自己的插件设置页面与 2.5 的后台整体风格搭调。不管你喜欢还是不喜欢 2.5 的后台风格，毕竟它已经来了。想改啊？祈祷下一版吧（本句，部分摘自英文原文）。

开发插件的朋友可能都知道，WordPress Codex 上面的 migrating plugins and themes 这篇文章讲解了插件和主题开发的一些技术细节，但文中并没有提及应该如何给插件和主题的设置界面编写样式表，好让这些东西符合主程序的后台风格。经过研究，一下是一些让您的插件设置页面，能够和 2.5 看起来比较配套的方法。

嵌套
这个并没有什么改变，依旧是按照以下格式进行嵌套：

<div class="wrap"> </div>

标题
标题应该以一个 H2 标题开始，作为插件的主标题。然后使用 H3 标题，作为插件的副标题。如图：

插件设置项
插件设置项通常包含名称、解释和功能设置内容。想让这些内容看起来漂亮一些。您必须使用表格。表格需要包含以下标记：

<table class="form-table">
<tr>
<th scope="row" valign="top">Name</th>
<td>
<input id="inputid" />
<label for="inputid">explanation</label>
</td>
</tr>
</table>

每组设置项，保持在一行。方便用户理解设置项的功能。如下显示：

提交按钮
在设置页面的最后，就是提交设置的按钮了。写法和下面代码类似就可以：

<span class="submit">
<input name="submit" value="Save Changes" type="submit" />
</span>

实际效果如下图：

大概就是这么多内容。如果您按照以上步骤对您的插件进行优化，那么使用者在使用过程中，会觉得舒服一些。

原文只介绍到这些内容。在此，我还要提醒大家一声。WordPress 2.5 后台部分调用代码和函数发生了变化，虽然变化不大。但老版本的插件可能有一些会在使用过程中出现脚本错误或者页面破碎的状况。希望各位在开发插件的同时，多注意一下主程序升级所带来的相关变更……

Related posts:

1. 在主题中增加 WordPress MU 登录入口
2. 射手座
3. 白羊座
4. Wordpress 2.3 Beta 1 发布啦!!!
5. How to Add WordPress 2.5 Gallery to Your Current Theme
6. 如何让您当前主题支持 Wordpress 2.3 的 Tags 功能 2
7. 如何让您当前主题支持 Wordpress 2.3 的 Tags 功能 1
8. 臭熏一下 WordPress 2.5
9. 升级到 WordPress 2.5 的注意事项
10. 本站程序升级到 WordPress 2.5 Beta 1

Tags: Code, Plugins, Theme

This entry was posted on Tuesday, March 11th, 2008 at 14:43 and is filed under WordPress. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.