問題描述

使用表格建立頁面的推薦方式是什麼,在管理區域中顯示帖子或使用者的表格樣式?

我正在擴充套件 the Cache Images plugin,它包含一個表,其中包含域和許多來自該域的影像。所以沒有可以建立的等同的現有表 (在這個問題的第一個版本中,我問了一個表的帖子,但我可以 (也許)expand the existing post table) 。

我應該把自己放在 the post overview page 上,從<table class="widefat"> 開始,還是現在有更好的功能來處理?你知道一個乾淨,空白的桌子的例子,我可以基於我的工作嗎?

最佳解決方案

這是我一般使用的:

<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>

希望有幫助。

次佳解決方案

使用 Core API,不僅僅是 CSS

通常您只需使用 WP_List_Table 類的例項。

指南:

好處?

是!

您可以新增分頁,搜尋框,動作和任何魔法,你可以想象 (並能夠編碼) 。

第三種解決方案

使用此示例 (寫為外掛) 建立管理表:

 http://wordpress.org/extend/plugins/custom-list-table-example/

它使用 built-in WP_List_Table 類。

第四種方案

另外你可以使用這個小外掛來檢視 WP 中的後端的可能性:https://github.com/bueltge/WordPress-Admin-Style

參考文獻

注:本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意,可以加入我們改善翻譯效果:薇曉朵技術論壇。