前回、WordPressのブログに表を追加しようとしたとき、結局全部破棄して、代わりに箇条書きのリストを使いました。

聞き覚えのある方はいらっしゃいますか？

多くの美しいWordPressテーマには、見栄えの良いテーブルを作成する機能が付いています。 そして確かに、最初は見栄えが良くても、それを使って多くのことを行うことはできません。

フィルタリング可能なデータが必要ですか？ いいえ、そうではありません。

テーブルをモバイル対応にしたい？ いいえ。

CSVからデータを取り込みたい？ そんなことはありません。

ここで、朗報です：

適切なプラグインを使えば、高機能なダイナミックテーブルを作ることができます。 フィルタリング可能なデータを表示することができるようなものですね。

グラフやあらゆる種類のものとともに。

それでは、wpDataTablesでどのようにできるかを見てみましょう。

注意してください： このチュートリアルはインタラクティブなテーブルに焦点を当てていますが、wpDataTablesでモバイル対応テーブルを作成するチュートリアルが役に立つかもしれません。 ここをクリックして確認してください。 この新しいチュートリアルは、wpDataTablesで最近リリースされたユーザーインターフェイスと追加機能の更新を考慮しています。

HTMLの知識がなくても美しいテーブルを作成できるプラグインです。

wpDataTablesは、テーブルを作成してウェブサイトに公開するプロセスを簡単にするプレミアムWordPressプラグインです。 軽量で直感的、数分で仕事を完了させるので、コードを読み解く必要がなくなり、ブログを書く時間を増やすことができます。

このプラグインのポイントのひとつは、以下の通りです。 HTMLの予備知識は必要ありません ショートコードをコピーして貼り付けるだけで、簡単に公開することができます。

ブロガーや企業にとっては、たくさんのデータを簡潔で消化しやすい方法で表示することができるため、これは素晴らしいニュースです。

に使うこともできますね：

• 製品カタログ
• 製品の比較表
• 価格表
• ユーザーからのデータ収集
• スポーツの結果
• 数字が関係するものについては、進捗状況を把握する（例：ブログの収入報告など）

その可能性は無限大です。

テーブルの作成は最初から最後まで：ステップバイステップガイド

wpDataTablesプラグインを使用すると、WordPressのウェブサイトに美しく、明確で、完全に機能するテーブルを作成するのは簡単です。

ここでは、その方法をご紹介します：

ステップ1 - ファイルを用意する

以下、いくつかのランダムな費用のExcel文書例を作成しました。 これには、日付、支払い方法、費用などのいくつかの列が含まれています。

データが同じように表示されていることを確認してください。そうでない場合、プラグインはテーブルの列を定義するのに苦労します。

ステップ2 - 新しいテーブルを作成する

WordPressダッシュボードの左側にある「wpDataTables」に移動します。

このリンクをクリックすると、上の画面が表示されます。 ここで新しいテーブルを作成し、追加します：

新規追加」ボタンをクリックすると、この画面が表示されます。 ここで、テーブルのパラメータを設定し、思い通りの機能と見た目になるようにするのです：

ステップ3 - テーブルの特徴を明確にする

テーブル設定ページの最初の3つのセクションで、以下のことを行うことができます：

• タイトルを作成する
• ページ上にテーブルタイトルを表示するかどうかを選択します
• テーブルの入力ソースの種類を選択する

最も基本的なテーブルセッティングです。

ファイルのアップロード」をクリックし、ドキュメントを検索します。 作成できるテーブルは、必要な分だけ複雑にすることができます。

ご覧のように、テーブルに関連するタイトルを付け、ドロップダウンボックスからExcelファイルの種類を選択し、ファイルをWordPressにアップロードしています。

さらにページを進むと、テーブルをカスタマイズするための設定項目が表示されます：

これらは

• レスポンシブ - デスクトップ、タブレット、モバイルでテーブルを異なる形で表示できるようにする
• スクロール可能 - テーブルを横方向にスクロールさせることができます。
• ページが完全に読み込まれるまでテーブルを非表示にする - 読み込みの遅いページに便利
• 高度なフィルタリング - 各カラムの下にフィルターを表示させる場合
• フィルターインフォーム - フォームそのものにフィルターをかける場合
• テーブルツール - フォームに埋め込まれたコピー、Excelへの保存、CSVへの保存などのオプションについて
• ソートを有効にする - これにより、テーブルをソートすることができます
• テーブルレイアウトを制限する - テーブルの幅を親コンテナの100％に制限する
• ディスプレイの長さ - ページに表示されるエントリーの数を定義する

プレビュー」をクリックすると、作成したテーブルを表示し、必要な設定を変更することができます。

表示するテーブルの種類に合ったオプションを選択したら、「保存」ボタンをクリックしてください。

カラムをさらにカスタマイズしたい場合は、「保存」をクリックした後、さらにページをスクロールしてオプションを追加することができます。 デフォルト設定は自動的に生成されますが、これによって各カラムの色、列、フィルターの種類（日付、時間、テキストなど）を変更することができます。

以下、色を付け、列の種類をテキスト、数値、文字列に編集してみました。

ステップ4 - ショートコードを保存してコピーする

テーブルを保存したら「閉じる」をクリックすると、プラグインのホームページに戻ります。 作成したテーブル、テーブルのタイトルと種類、投稿やページに入力するためのショートコード、複製するためのオプションが表示されるはずです。

このテーブルをページ内に表示したいので、ショートコードをコピーして、編集したいページに移動する必要があります。

ステップ5 - 投稿またはページにショートコードを追加する

テーブルをページに追加するには、ショートコードをページエディターに貼り付けるだけです。 テーブルを表示したいページの場所を選択し、コードを貼り付けて、コンテンツを作り続けてください：

ステップ6 - 発行する

ページの公開ボタンを押すと、このような表ができあがります。 ご覧のように、明確で一貫性があり、完璧に整列され、すべてのデータを簡単に操作できるようになっています：

テーブルの上部にあるオプションを使用すると、ユーザーはテーブルの内容をさまざまな形式でエクスポートできます。 また、サイトのフロントエンドで簡単に結果をフィルタリングすることもできます。

他にどんなテーブルが作れるのでしょうか？

WPデータテーブルは、CSVベースのシンプルなテーブルだけでなく、さまざまな形式のデータを表示することができます。

ここでは、完全に機能し、レスポンシブで編集可能な、複数の列とオプションを持つテーブルの例を紹介します。

このテーブルはMySQLベースで、ユーザーのニーズに応じてコンテンツをソートするためのフィルターを備えています：

このPHPの配列ベースのテーブルは、シリアライズされ、画像も含まれます。これは、多くのeコマースストアが特に便利だと思う、まったく異なるダイナミックな機能を追加します：

また、CSVファイルだけでなく、WP Data Tablesでは、Excelベースのファイルも使用可能で、Excel特有の様々な機能を活用することができます：

その他、特筆すべきwpDataTableの機能

• wpDataChartウィザード - Google Charts、Highcharts、Chart.jsの3つのレンダリングエンジンをサポートしています。 詳しいドキュメントはこちらをご覧ください。
• 条件付き書式設定 - セル、行、列の内容に基づいてハイライトすることができます。 特に、テーブルが完全に数値である場合に便利です。 詳しいドキュメントはこちらを参照してください。
• フォーミュラカラム - 他のセルの数値をもとに計算するための列を追加することができます。 詳しい説明はこちらをご覧ください。
• Datetimeのカラム - 日付と時刻の両方を含むセルに使用します。 設定ページで設定したフォーマットで自動的に表示されます。 詳しい説明はこちらをご覧ください。
• 合計/集計行 - 数値列で使用し、すべての値の合計を計算することができます。 詳しい説明はこちらをご覧ください。
• レポートビルダー - wpDataTables のアドオンです。 Report Builder は、WordPress サイトの実際のデータでテンプレートを埋めるドキュメントやスプレッドシートを即座に作成します。 より多くのドキュメントは、こちらをご覧ください。
• マスターデテールテーブル - wpDataTablesのアドオンで、あなたやあなたのサイトの訪問者は、単純なクリックで各行の詳細を見ることができます。 より多くのドキュメントはここにあります。

最終的な感想

テーブルはデータを表示するのに最適な方法ですが、フィルタリングなどの動的な機能を追加することで、ウェブサイトの訪問者にとってより良いものになります。

Microsoft Excel（または他の表計算ツール）からデータをアップロードして、WordPressで動的なテーブルを作成する方法を説明しました。 しかし、可能なことは他にもたくさんあります。

さらに、任意のテーブルをチャートやグラフにすることなども可能です。

さあ、いよいよ自分だけのテーブルを作りましょう！お楽しみに！

関連する読み物です： WordPressの強力でモバイル対応なテーブルプラグイン5選。

開示する： この記事はスポンサーによるものですが、私たちの意見は私たち自身のものです。