ヘッダーを繰り返す、よりレスポンシブなWordPressテーブル

WordPressのテーブルは、長年にわたるWordPressの進歩にもかかわらず、諸刃の剣です。データを提示するには最適な候補ですが、ストーリーを語るには不利です。それだけでも十分悪いと思うなら、スマートフォンやタブレットについて聞くまでもありません。データを表示するスペースがさらに少ないデバイスです。テーブルの欠点の中には、受け入れて付き合っていくしかないものもありますが、レスポンシブ対応はその一つではありません。.

前回のメジャーアップデートでは、 WP Table Manager に追加のレスポンシブオプションを備えた新しいレスポンシブデザインが導入されました。今回、WordPressテーブルマネージャーの新しく改良されたバージョンでは、新しいレスポンシブモードと、レスポンシブテーブルとその動作をカスタマイズするための新しいオプションが追加されています。それが「ヘッダーの繰り返し」です。

ヘッダーを繰り返すレスポンシブテーブル

テーブルを表示するのに十分なスペースがない場合はどうなるでしょうか？前回のアップデートでは、 WP Table Manager が2つのレスポンシブオプションを提供しました。スクロールバーの追加と列の非表示です。これら2つのモードにはそれぞれの用途がありますが、横スクロールやデータの非表示を避けたい場合には、新しい第3のモードが求めているものかもしれません。それが「ヘッダーの繰り返し」です。

繰り返しヘッダーのレスポンシブモードは、他のすべてのモードと同様に、コンピューターやノートパソコンなどのデスクトップデバイスのように十分なスペースがある場合は、通常のテーブルがデフォルトになります。十分なスペースがない場合は、テーブルヘッダーと行の値という2つの列を持つ、よりシンプルなテーブルに折りたたまれます。.

実際には、テーブルに4つの列がある場合、元のテーブルの各行は、レスポンシブバージョンでは4つの新しい行として表現されます。それぞれの新しい行には、元のヘッダーとそのデータ値だけが含まれます。この方式は元のテーブルの各行に適用されるため、データ値の隣には常に繰り返されたヘッダーが表示されます。.

このシンプルなレスポンシブ動作により、繰り返しヘッダーテーブルモードでは、モバイルやタブレットでの表示を気にすることなく、テーブルに好きなだけデータを追加できます。さらに、 WP Table Manager は小さいデバイスで行に交互の色を使用します。元のテーブルの各行が異なる色になり、コンテキストが保持され、WordPress の読者がレコードを区別できるようになります。.

ヘッダー繰り返しモードでレスポンシブテーブルをカスタマイズする

テーブルを編集する際に、繰り返しヘッダーモードを選択できます。まず レスポンシブオプション を フォーマット メニューから選択し、次に最初のドロップダウンから 繰り返しヘッダー モードを探します。繰り返しヘッダーテーブルは、レスポンシブブレークポイントとレスポンシブ最大高さの2つの方法でカスタマイズすることもできます。

レスポンシブブレークポイントとは、WordPressテーブルマネージャープラグインが通常どおりにテーブルをレンダリングするのをやめ、代わりにレスポンシブな繰り返しヘッダーモードに切り替わる幅のことです。この値は、お使いのWordPressテーマと列数に基づいて見積もることができます。特定の幅を下回るとテーブルが収まらないと思う場合は、その幅をブレークポイントとして使用してください。.

行や列が多い場合、ヘッダー繰り返しモードによって非常に長いページが作成される可能性があります。レスポンシブ最大高さは、レスポンシブモードでヘッダー繰り返しテーブルの高さを制限することで、この問題に対処します。レスポンシブテーブルが長すぎる場合、WordPressの読者は通常どおりスクロールバーを使用してより多くのデータを表示できます。.

レスポンシブテーブルに魔法の解決策はありませんが、WordPressテーブル向けのヘッダー繰り返しモードはそれに近いものです。小さなテーブルでも、多くの行と列を持つ大きなテーブルでも、 WP Table Managerの新しいヘッダー繰り返しモードなら、デバイスを問わずデータが常に収まるようにします。.