[WordPress] FooTable で表作成２

calendar 2020/03/08 Sun 06:56 · 1 min read · computer  ·
Share on: linkedin copy

以前 WordPress で FooTable を使った表の作成方法について書いた。

［WordPress］ FooTable で表作成 – with a Christian Wife
https://wacw.cf/2018/07/06/footable-on-wordpress/

しかし、行の展開設定がうまくいかない。すなわち、大きめの表を表示させようとしているので、最初の数列だけをデフォルトで表示させ、さらに詳細を見たいならプラスボタンをクリックすることですべてが見えるようにしたいのだ。

スマートフォンとタブレットに関しては WordPress の「Settings > FooTable Settings > Breakpoints > Column Visibility」の数値を設定することでデフォルトで表示する列数をコントロールできる。

ただし、タブレット（私の場合 iPad Pro 9.7”）を横向きにするとパソコンと認識されてしまい、全列がデフォルトで表示される。

私がやりたいのはパソコン、タブレット、スマートフォンの全デバイスで、デフォルトの表示を２列としたい。この場合、FooTable の公式ガイドによると、デフォルトで非展開にしたい列に対して data-breakpoints="all" オプションを付ければいいと書いてある。しかし、オプションを列に書き込んでも反映されない。

Getting started – FooTable
http://fooplugins.github.io/FooTable/docs/getting-started.html

いろいろいじってみると、その他のオプションも動作しないようだ。なぜだろう・・・。

しかたないので、WordPress の「Settings > FooTable Settings > Breakpoints」で Tablet Breakpoint を 768 からぐっと広げて、1500 とした。これで例えばタブレットの Column Visibility を２にしておくことで、タブレットはもちろんパソコンでもデフォルトで表示される列数が２となった。