wordpressブログで有能な表を使用する


プラグイン『TablePress』を使用して、ソート機能検索機能が付いた表を作成します。所要時間は5分くらい。

表のサイズが大きくなると、目的の項目にたどり着くまでに時間がかかってしまいます。そんなとき、並べ替えの機能や検索の機能があれば便利だったりしそうですよね。プラグイン『TablePress』を使用すれば、そのような機能を備えた有能な表を簡単に作ってくれるとか。

 

スポンサードリンク

TablePress のインストール

wordpressのメニューから、プラグイン→プラグインの新規追加を選択。上記のような画面で『DataTables』をインストール→有効化をします。プラグインを使う方にとってはお馴染みの処理ですね。上図は既に有効化済みですのであしからずです。

 

新しい表の作成

それでは、実際に表を作成してみましょう。まずは新しくテーブルを作る場合のケースです。下記のように、TablePress → 新規追加を選択します。

表の名前とサイズを指定して、『テーブルを追加』を選択。項目は作成後も変更できるので、今は適当でも問題ねえです。

実際に『テスト』という名前の5*3の表を作成した結果↓

無事作成完了。実際にテーブルのセル内に項目を足すと↓

このように。太字の b や色変更の color など、セル内でのタグ使用が可能です。勿論、リンクを張る a タグも使用可能ですので、用途に合わせて使って、どうぞ。

ここで作成したテーブルは、投稿ページにショートコードを貼り付けることで使用可能です。例として挙げたテーブルのコードは [table_id=334 /] でしたので、試しにこの記事に貼り付けてみますね。

試合ロッテ阪神
1101
2100
3101
432

【試合】、【ロッテ】、【阪神】のそれぞれでソートができたのではないでしょうか。検索ボックスに点を入力すれば、特定の試合のみの抽出も可能ですね。

↑ショートコードの貼り方。初めて使うときは若干ゃ戸惑いますよね。

検索ボックスの置く置かない、ソートの可不可などは、テーブル作成ページから変更可能です。こちらは実際に使って確かめていただいた方が分かりやすいかもですね。

各項目はこんな感じ。項目が増えてきたらページ送り機能も便利です。

 

スポンサードリンク

既存の表の使用

さて、次は既存の表を有能表にジョブチェンジさせてみましょう。TablePress → インポートを選択します。

こちらのページでできることは、

・エクセルなどで作成した表をwordpressで使用可能な表に変換
・既存記事に使用している表を有能表にジョブチェンジ

ですね。エクセルの表を使用するのはアップロード→インポートだけなので簡単。既存記事のものは手動入力で打ち込む必要がありますので、事前に表のHTML部をコピーしてきてください。

設定を手動入力にしてHTMLを張り付け、インポート形式を変更すれば準備完了です。インポートを実行すると、先ほど1から作成したような表が出来上がります。あら便利。

ちなみに、上のソースは↓のページの表に使用しています。ページ送りも使用していますので、ご参考までに。

環境上位ポケモン指数まとめ

スポンサードリンク