it-swarm-tr.com

Yönetici tarzında bir tablo oluşturma?

Yönetici alanında yayınları veya kullanıcıları gösteren tabloların tarzında, tablo içeren bir sayfa oluşturmanın önerilen yolu nedir?

Genişletiyorum Önbellek Görüntüleri eklentisi ve etki alanlarını içeren bir tablo ve bu etki alanından bir dizi resim içeriyor. Bu yüzden üzerine kurabileceğim eşdeğer bir tablo yok (bu sorunun ilk versiyonunda, yazı içeren bir masa hakkında sorular sordum, fakat orada (belki) mevcut yazı masasını genişlet ) yapabilirim.

Sadece kendimi genel bakış sayfasına) üzerine kurmalı mıyım, ve bir <table class="widefat"> ile mi başlamalıyım, yoksa şimdi bununla başa çıkacak daha iyi fonksiyonlar var mı? Çalışmamı temel alabileceğim, sayfalamayı içeren temiz bir boş tablo örneği biliyor musunuz?

42
Jan Fabry

Genelde kullandığım şey bu:

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

Umarım yardımcı olur.

28
sorich87

Çekirdek API'yi kullanın, yalnızca CSS’ini değil

Normalde sadece WP_List_Table sınıfının bir örneğini kullanırsınız.

Kılavuzlar:

  • Bu konuda daha fazla Codex here .
  • İşte ayrıca WP Engineer - dizininden kopyalamak için çok fazla bir kılavuz.
  • Ve başka bir rehber Smashing Magazine online.

Yararları?

EVET!

Sayfalandırma, arama kutuları, eylemler ve hayal edebileceğiniz her büyü (ve kodlamayı yapabilir) ekleyebilirsiniz.

26
kaiser

Yönetici tablolarınızı oluşturmak için bu örneği (eklenti olarak yazılmış) kullanın:

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

Yerleşik WP_List_Table sınıfını kullanır.

13
Sander

Ayrıca bu küçük eklentiyi WP'deki arka uç olanaklarını görüntülemek için de kullanabilirsiniz: https://github.com/bueltge/WordPress-Admin-Style

4
bueltge

Yönetici içindeki özel posta türü listenize bir filtre eklemeyi düşünebilirsiniz? Aşağıdaki bağlantılı cevap taksonomi ile nasıl yapılacağını gösterir, ancak restrict_manage_posts hook'unuzdaki diğer kriterleri kolayca kullanabilirsiniz:

Eğer başka sorunuz varsa bana haber verin.

0
MikeSchinkel