web-dev-qa-db-ja.com

管理者スタイルのテーブルを作成しますか?

管理領域の投稿またはユーザーを表示する表のスタイルで、表を含むページを作成するための推奨される方法は何ですか?

私は Cache Imagesプラグイン を展開しています、そしてそれはドメインとそのドメインからのいくつかの画像を含むテーブルを含みます。したがって、私が構築できる同等の既存のテーブルはありません(この質問の最初のバージョンでは、投稿があるテーブルについて質問しましたが、(おそらく) 既存の投稿テーブルを展開する )。

私は 投稿の概要ページ をベースにして<table class="widefat">から始めるべきですか、それとも今すぐこれを処理するより良い関数がありますか?あなたが私が私の仕事の基礎となることができるページングを持つテーブルのきれいで空の例を知っていますか?

42
Jan Fabry

これは私が一般的に使用しているものです:

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

それが役立つことを願っています。

28
sorich87

CSSだけでなくCore APIを使う

通常はWP_List_Tableクラスのインスタンスを使うだけです。

ガイド:

利点?

はい!

ページネーション、検索ボックス、アクション、そしてあなたが想像できる(そしてコーディングできる)魔法を追加することができます。

26
kaiser

Adminテーブルを作成するには、この例(プラグインとして書かれている)を使用してください。

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

組み込みの WP_List_Table クラスを使用します。

13
Sander

また、あなたはWPのバックエンドの可能性を見るためにこの小さなプラグインを使うことができます: https://github.com/bueltge/WordPress-Admin-Style

4
bueltge

あなたは管理者のあなたのカスタム投稿タイプリストにフィルタを追加することを検討したいかもしれません?以下のリンクされた答えは分類法でそれをする方法を示します、しかしあなたはあなたのrestrict_manage_postsフックで他の基準を簡単に使うことができました:

あなたがもっと質問があるかどうか私に知らせてください。

0
MikeSchinkel