プログラミングゆるめモ

プログラミングに関することをゆるくメモしてます

WordPress

WordPress 表(table)をソートする(table-sorter plugins)

 表をExcleのようにソートしたいときってありますよね。
そんな、ソート機能を実現するプラグインとして、table-sorter があります。
table-sorter にもいろんな種類があるようで、普通にhtmlから利用可能なものや
WordPressのプラグインになっているものもあります。

 今回は、WordPressのプラグインのtable-sorter の使い方です。
table-sorterのプラグインは、ここからダウンロードします。
 インストールして有効化すると、表(table)をソートすることができるようになります。

例)

No. 県名 名前 金額
1 北海道 さとう 100
2 青森県 たなか 80
3 東京都 すずき 85
4 神奈川県 やまだ 122
5 沖縄県 ささき 60

No./県名/名前をクリックすると、表がソートされますね。
でも、金額をクリックしてもソートされません。

この表は下記のようになっています。

使い方
[1]<table class="tablesorter">  tableタグには必ず class="tablesorter" が必要です。
[2]<thead>~</thead>  テーブルヘッダー部分は<thead>~</thead>で囲みます
[3]<th>~</th>  テーブルヘッダー部分は<th>タグを使います
[4]<th class="sortless">  ソートの対象外にしたい場合は、class="sortless"が必要です。
[5]<tbody>~</tbody>  データ部分は<tbody>~</tbody>で囲みます

今回は、WordPressのプラグインでしたが、簡単に表にソート機能を取り入れたいときは超お勧めです。
WordPressのプラグインではなく、jQuery tablesorter だとデザインを変えたり、もっと細かい制御が可能ですし、見た目もずっとカッコイイです。ただし、WordPressで使うにはちょっと面倒なようです。

-WordPress