WordPressの投稿画面に表を入れてみる

フルタニ
こんにちは、フルタニです。放送局で番組作りをしてました。

WordPressの投稿画面に表を入れてみました。WordPressの罫線機能を使って作表するのも大変です。簡単に一覧表を表示するツールはないものでしょうか。

簡単な方法は、GoogleCrome上に作った表を範囲指定してコピペするもの。

Crome上の元データと連動して表示されます。計算式も使用できます。

問題点はレスポンシブなものではないこと。横画面で見えていた部分が縦にすると見えなくなってしまいます。

No.列1列2列3列4列5
12018/10/13 14:49:17=NOW()ABC
22018/10/13=TODAY()DEF
313=DAY(TODAY())GHI
4
5
6
7
8
9
10
11
12
13

プラグインを調べると、有料、無料様々なプラグインが見つかりました。

プラグイン選びのポイントの一つは、更新頻度が高いものを選ぶこと。

WordPress本体の更新に合わせるようにプラグインも更新されているものを選ばないと予期せぬトラブルに巻き込まれることがあるからです。

Data Tables Generator:静的テーブルプラグイン

試しにData Tables Generator:静的テーブルプラグインを使って見ました。

静的というのは”データがテーブルに直接与えられる(スクリプトで動的に)からです”と説明されています。

作った表にデータがくくりつけられているので、汎用的な作業には向かないようです。

SupsysticのData Tables Generatorは2万人以上のユーザーを持つ無料のWordPressテーブルプラグインです。有料テーブルプラグインにあるような機能をすべて備え、さらにプロ仕様の見栄えのテーブルを作るためのスタイルをいくつか備えています。無料プラグインとしてはとても優秀です。

早速ダウンロードしたものを有効化しました。

まず最初はダッシュボード左側の一覧から[Table by Supsystic][Add table]を選び表を作ります。

説明は英文ですが、簡単な枠程度なら直感で操作できそうです。

表の中にいれるデータもこの画面で入力します。

静的という意味がおぼろげながらわかります。

出来上がった表のショートコードをWordPressの投稿画面に貼り付ければ完成です。

試しに作ったのが下記の表です。表は見切れないよう媒体の画面によって変化します。

[supsystic-tables id=1]

Cromeなどのスプレッドシートでデータを作っておきペーストする方法が楽そうです。

表をたくさん作るとidが増えていくので整理が必要になるかもしれません。

まとめ

表には単純なものからカタログサイトに使えそうなフォーマットまで幅があります。用途に応じて使いこなせるようになりたいものです。