WordPressプラグイン「Table Sorter」が便利

この記事は最終更新日から214日経過しています。

前回のレッスン【Wordpress】AddQuicktagというプラグインが使いやすい

WordPressでテーブルの並び替えをしたいなあという場面がありまして、調べてみると「Table Sorter」というプラグインがありましたので、簡単に使い方をまとめたいと思います。

極力プラグインは入れたくない!という方は、通常のjQueryのプラグインでも導入ができます。

jQueryプラグイン:
Tablesorter 2.0

スポンサーリンク




プラグインをインストール

まずは通常のプラグインと同じくWordpressにインストールし、有効化します。

WordPressのメリットの1つに、プラグインを利用できることがあります。 プラグインを利用すれば、WordPressにはない高度な...

Table Sorterの使い方

Table Sorterの使い方はシンプルですが、現状英語でのインストラクションしかなく、少し分かりづらいため、個人的には用意されているDEMOなどを見て実装する必要がありました。

以下がDEMOで用意されているコードになります。

<table id="myTable" class="tablesorter">
<thead>
<tr>
<th>Last Name</th>
<th>First Name</th>
<th>Email</th>
<th>Due</th>
<th class="sortless">Sortless</th>
<th>Web Site</th>
</tr>
</thead>
<tbody>
<tr>
<td>Khan</td>
<td>Farhan</td>
<td>farhan@test.com</td>
<td>$50.00</td>
<td>Lorem</td>
<td>https://www.test.com</td>
</tr>
<tr>
<td>Iqbal</td>
<td>Kamran</td>
<td>kamran.cheff@yahoo.com</td>
<td>$50.00</td>
<td>Ipsum</td>
<td>https://www.kamrancheff.com</td>
</tr>
<tr>
<td>Rana</td>
<td>Usman</td>
<td>usman@hotmail.com</td>
<td>$100.00</td>
<td>Dollar</td>
<td>https://www.usmanrana.com</td>
</tr>
<tr>
<td>Iqbal</td>
<td>Hassan</td>
<td>hassan@earthlink.net</td>
<td>$50.00</td>
<td>Sit</td>
<td>https://www.hassaniqbal.com</td>
</tr>
</tbody>
</table>

実装方法は以下のように説明されています。

. THEAD and TBODY tags are compulsory in the desired table, otherwise this plugin will not work.
2. Add tablesorter class in the desired TABLE tag.
3. For column heading, use TH tag within THEAD tag.
4. If you want to exclude a particular column, add sortless class to that TH tag.

意訳すると以下のようになります。

1. THEADTBODY タグは必要。タグがない場合は動作しない
2. tablesorterクラスをテーブルタグに付ける
3. 行データのタイトルは、THEADタグで囲み、それぞれのデータにTHタグを使用する必要がある
4. 特定の列に並び替えを適用したくない場合は、THタグにsortlessクラスを付ける

私は上のコードを参考にtableを組みました。

難点

初期状態は昇順・降順の指定ができるのですが、例えば昇順のみの並び替えをしたい場合などはできない点が少し気になります。

ただ、jQUeryの導入が苦手な私のような人間にとってはプラグインでやってしまったほうが早くて有難いです。

次のレッスンへカスタムポストタイプUI(CPT UI)でカテゴリーとタグを通常の投稿と共有させる方法

「WordPress初心者入門」のトップへ

WordPressの基礎を体系的に学びたい方のために

WordPressの基礎を体系的に学習したい方向けの著書が発売になります。

本書の手順に沿ってサイトを作成していただくだけで、WordPressの操作方法やサイト作成の基礎を学べる構成になっています。

これからWordPressでサイト作成を始めようと考えているけど、何から始めれば良いか迷っている。

本書はそんな方のための一冊です。

ぜひお手にとってご覧いただければ嬉しく思います。

スポンサーリンク




シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク