以管理员风格创建表?


44

推荐的用表格创建页面的方式是什么,表格的样式在管理区域中显示帖子或用户?

我正在扩展Cache Images插件,它包含一个包含域的表以及该域中的许多图像。因此,没有可用于构建的等效现有表(在该问题的第一个版本中,我询问了一个包含帖子的表,但是可以(也许)扩展现有的post表)。

我应该以帖子概述页面为基础,以开头<table class="widefat">,还是现在有更好的功能来处理?您是否知道我可以基于工作进行分页的干净,空的示例?


3
WordPress UI样式指南有一个新博客,您可能会发现有帮助。dotorgstyleguide.wordpress.com/outline
sorich87 2010年

2
自我说明:scribu 在WP 3.1中添加了一个新的带有表类的ajaxified表系统WP_List_Table。可以使用有关如何使用此问题的信息来更新此问题。
Jan Fabry 2010年

Answers:


29

这是我通常使用的:

<table class="widefat fixed" cellspacing="0">
    <thead>
    <tr>

            <th id="cb" class="manage-column column-cb check-column" scope="col"></th> // this column contains checkboxes
            <th id="columnname" class="manage-column column-columnname" scope="col"></th>
            <th id="columnname" class="manage-column column-columnname num" scope="col"></th> // "num" added because the column contains numbers

    </tr>
    </thead>

    <tfoot>
    <tr>

            <th class="manage-column column-cb check-column" scope="col"></th>
            <th class="manage-column column-columnname" scope="col"></th>
            <th class="manage-column column-columnname num" scope="col"></th>

    </tr>
    </tfoot>

    <tbody>
        <tr class="alternate">
            <th class="check-column" scope="row"></th>
            <td class="column-columnname"></td>
            <td class="column-columnname"></td>
        </tr>
        <tr>
            <th class="check-column" scope="row"></th>
            <td class="column-columnname"></td>
            <td class="column-columnname"></td>
        </tr>
        <tr class="alternate" valign="top"> // this row contains actions
            <th class="check-column" scope="row"></th>
            <td class="column-columnname">
                <div class="row-actions">
                    <span><a href="#">Action</a> |</span>
                    <span><a href="#">Action</a></span>
                </div>
            </td>
            <td class="column-columnname"></td>
        </tr>
        <tr valign="top"> // this row contains actions
            <th class="check-column" scope="row"></th>
            <td class="column-columnname">
                <div class="row-actions">
                    <span><a href="#">Action</a> |</span>
                    <span><a href="#">Action</a></span>
                </div>
            </td>
            <td class="column-columnname"></td>
        </tr>
    </tbody>
</table>

希望能有所帮助。


这样也插入自动分页吗?(例如,显示1-20号帖子)
Michiel Standaert

@MichielStandaert号
kaiser

@MichielStandaert如果您想要分页的结果,则可以使用paginate_links
flipdown

谢谢 !(但是我仍然问为什么他们不使用:odd行而不是让我们每两行添加一个类……)
Zachary Dahan

显然有“更好”的解决方案(就像这里的其他答案一样),但是对于一张快速的基本表格而言,这正是我所追求的。谢谢!
rinogo

26

使用Core API,不仅是CSS

通常,您只使用WP_List_Table该类的实例。

指南:

有好处吗?

是!

您可以添加分页,搜索框,动作以及您可以想象的(并能够编码)的任何魔术。


1
小提示作为查看标记的链接,用于管理界面的类,而不仅仅是创建表的目标:github.com/bueltge/WordPress-Admin-Style
bueltge

1
>该课程的访问被标记为私有。这意味着它不适合插件和主题开发人员使用,因为在将来的任何WordPress版本中,如有更改,恕不另行通知。如果您仍想使用该类,则应制作一个副本以供您自己的项目使用和分发,否则,后果自负。
奥斯丁(Austin Pray)

@AustinPray 副本吗?不,请不要那样做。有可用的Beta,RC和其他预发行版。只需更新您的实现/扩展。如果您真的必须横着走,那就自己写点更好的东西。核心代码不是那么好。
kaiser

@kaiser不要开枪,这些不是我的话。我引用了WP Codex。尽管为每个beta和RC注册永久性回归测试,听起来并没有比复制类好得多。我同意编写自己的简单课程是一种更好的方法。
奥斯汀祈祷

@AustinPray没有难过的感觉:)法典是由像你我这样的人编写的。实际上,您现在就可以恢复该声明,并且人们会引用它。
kaiser



0

您可能要考虑在管理员的自定义帖子类型列表中添加过滤器?下面的链接答案显示了如何使用分类法进行操作,但是您可以轻松地在restrict_manage_posts挂钩中使用其他条件:

如果您还有其他问题,请告诉我。


对于不清楚的问题,我深表歉意。在我的第一个示例中,它是一个帖子表,确实,我可以尝试使用现有的帖子表(即使我只想显示帖子标题,然后显示所有自定义列?)。但是,现在我用一个具体的例子来编辑我的问题:我有一个域表,所以没有等效的现有表可以扩展。
Jan Fabry'9

@Jan:嗯。是的,我认为您已经发现了事实,除了编写(重复的)HTML外,没有其他好的封装方法可以做到这一点。我经常遇到同样的问题。也许在trac上创建一个票证,要求进行此增强,并在此处链接URL /票证#,以便我们提供支持。
MikeSchinkel 2010年
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.