この記事を書いた人
WordPressの表（テーブル）とは？基本と役割を理解しよう
WordPressの表（テーブル）とは、記事の中に行と列で情報を整理して表示できる機能のことです。料金プランの比較や営業時間の一覧など、文章だけでは伝えにくい情報をわかりやすく見せるために使います。
「ホームページに料金表を載せたいけど、どうやって作ればいいの？」と悩んでいませんか。WordPressで表を作ること自体は、実はそれほど難しくありません。標準機能だけでも作れますし、プラグイン（かんたんに言うと、WordPressに機能を追加する拡張ツールのこと）を使えばさらに見やすい表に仕上げられます。
この記事では、WordPress制作のプロが、初めての方でも迷わず表を作れるように3つの方法をわかりやすく解説していきます。作り方だけでなく、装飾のカスタマイズやスマホでの見え方まで、実際の制作現場で大切にしているポイントもあわせてお伝えしましょう。
読み終わる頃には、あなたのホームページにぴったりの表を、自信を持って作れるようになっているはずです。
WordPressで表を作る方法は3つある
WordPressで表を作るには、大きく分けて3つの方法があります。「テーブルブロックを使う方法」「エクセルやスプレッドシートからコピペする方法」「プラグインを使う方法」の3つです。
それぞれの方法には向き・不向きがあります。かんたんな表であれば標準機能のテーブルブロックで十分対応できますし、すでにエクセルで作った表があるならコピペが最も手軽でしょう。セルの結合や横スクロールなど、より高度な表が必要な場合はプラグインを使うのがおすすめです。
実際の制作現場では、まず標準のテーブルブロックを試して、それで対応しきれない場合にプラグインを導入するという流れが一般的になっています。最初からプラグインを入れる必要はありません。
ここからは、それぞれの方法について具体的な手順を解説していきます。
テーブルブロック（標準機能）で表を作る方法
テーブルブロックとは、WordPressに最初から備わっている表作成機能です。追加のインストールは不要で、すぐに使い始められます。
使い方はとてもシンプルです。投稿や固定ページの編集画面で、ブロックの追加ボタン（「＋」マーク）をクリックしてください。検索窓に「テーブル」と入力すると、テーブルブロックが表示されるので選択しましょう。
次に、列数（横のマス目の数）と行数（縦のマス目の数）を指定します。たとえば料金表なら「列数3、行数4」のように設定してください。数字を入力したら「表を作成」ボタンをクリックすれば、空の表が挿入されます。
あとはマス目をクリックして文字を入力していくだけです。「列数や行数を間違えてしまった」という場合も安心してください。表を作ったあとからでも、行や列の追加・削除はかんたんに行えます。
テーブルブロックは、会社概要やサービス内容の一覧表など、シンプルな構成の表を作るのに適した機能です。多くの制作案件では、この標準機能だけで十分に対応できるケースがほとんどでしょう。
エクセルやスプレッドシートからコピペする方法
すでにエクセルやGoogleスプレッドシートで表を作っている場合は、コピー＆ペーストで挿入するのが最も手軽な方法です。
手順は3ステップで完了します。まず、エクセルやスプレッドシート上で挿入したい範囲を選択してコピーしてください。次に、WordPressの編集画面でペースト（貼り付け）するだけです。すると、自動的にテーブルブロックとして表が挿入されます。
ただし、コピペした表にはいくつか注意点があります。エクセルで設定していた罫線の色やセルの背景色は、そのまま反映されないことも少なくありません。コピペ後にWordPress側で改めて装飾を調整する必要が出てくるでしょう。
また、セルの結合を使った複雑なレイアウトの表は、コピペするとレイアウトが崩れることがあります。その場合は、次に紹介するプラグインを使う方法を検討してみてください。
プロの視点では、コピペはあくまで「下書きを素早く入れる手段」として活用するのがおすすめです。最終的な見た目の調整はWordPress側で行うことで、統一感のある表に仕上がるでしょう。
プラグインを使って表を作る方法
標準機能では対応しきれない表を作りたい場合は、表作成に特化したプラグインを使う方法が便利です。セルの結合や横スクロール対応など、より高度な機能を利用できるようになります。
プラグインの導入手順は、WordPress管理画面の「プラグイン」から「新規追加」をクリックし、使いたいプラグインの名前を検索してインストール、有効化するだけです。
どのプラグインを選ぶかについては、次のセクションでおすすめのプラグインを2つ紹介します。それぞれの特徴を比較しているので、あなたの用途に合ったものを選んでみてください。
プラグインを使う最大のメリットは、レスポンシブ対応（かんたんに言うと、スマートフォンでも見やすく自動調整される機能のこと）がしやすい点です。標準のテーブルブロックだけでは、スマホで表が見切れてしまうことがあります。プラグインなら横スクロールや自動縮小の設定がかんたんに行えます。
表作成におすすめのプラグイン2選
WordPressの表作成プラグインはいくつかありますが、実際の制作現場でよく使われているのは「Flexible Table Block」と「TablePress」の2つです。どちらも無料で使えるプラグインです。
この2つのプラグインは、それぞれ得意な場面が異なります。ブロックエディタ（かんたんに言うと、WordPressの現在の標準的な編集画面のこと）との相性を重視するなら「Flexible Table Block」、大量のデータを扱う表や並べ替え機能が必要なら「TablePress」がおすすめです。
以下で、それぞれの特徴と使い方を詳しく見ていきましょう。
Flexible Table Block
Flexible Table Blockは、WordPressのブロックエディタに対応した表作成プラグインです。標準のテーブルブロックの「上位互換」とも言える存在で、より多くのカスタマイズが可能になります。
このプラグインの最大の特徴は「セルの結合」ができることです。標準のテーブルブロックにはセル結合の機能がないため、ヘッダーを横に結合したい場合や、複雑なレイアウトの表を作りたい場合に重宝します。
使い方は標準のテーブルブロックとほぼ同じです。ブロック追加から「Flexible Table」を選び、列数と行数を指定して表を作りましょう。セルをクリックすれば文字を入力でき、ツールバーから結合や分割の操作も行えます。
さらに、レスポンシブ対応の設定が充実しているのも大きなポイントです。スマホ表示時に横スクロールを有効にしたり、特定の列を固定したりする設定が、プラグインの画面からかんたんに行えるようになっています。
エクセルやGoogleスプレッドシートからの変換機能も搭載されています。スプレッドシートで作った表をFlexible Table Blockの形式に変換できるため、既存の表データを活用したい場合にも便利でしょう。
多くの制作案件で見てきた中で、初心者の方に最初におすすめするのはこのプラグインです。ブロックエディタの操作感に慣れている方なら、違和感なく使いこなせるでしょう。
TablePress
TablePressは、WordPressの表作成プラグインとして長い歴史を持つ定番のプラグインです。世界中で広く使われており、安定性と信頼性に定評があります。
このプラグインの特徴は、表の管理画面が独立していることです。WordPress管理画面のメニューに「TablePress」という専用メニューが追加され、そこで表の作成・編集・管理を一元的に行えます。
TablePressの強みは、大量のデータを扱う表に向いている点です。読者が表の内容を検索したり、列ごとに並べ替えたりできる「動的な表」（かんたんに言うと、読者が操作できるインタラクティブな表のこと）を作成できます。商品一覧や価格比較表など、データ量が多い表を作りたい場合に力を発揮するでしょう。
使い方の流れとしては、まずTablePressの管理画面で表を作成し、ショートコード（かんたんに言うと、特定の機能を呼び出すための短い命令文のこと）を取得します。そのショートコードを投稿や固定ページに貼り付けると、表が表示される仕組みです。
エクセルやCSVファイルから表データをインポートする機能も備わっています。大量のデータを手入力する手間を省けるため、商品リストや料金表の作成に役立つでしょう。
ただし、TablePressはブロックエディタの中で直接表を編集する方式ではありません。表の修正は専用管理画面で行う必要があるため、ブロックエディタに慣れた方は少し戸惑うかもしれません。
プロの視点では、「シンプルな表はFlexible Table Block」「データ量が多い表や検索・ソート機能が必要な表はTablePress」と使い分けるのが効率的です。
表のスタイル・装飾をカスタマイズする方法
WordPressでは、作成した表のデザインをさまざまにカスタマイズできます。見た目を整えることで、読者にとって情報が格段に読み取りやすくなるでしょう。
ここでは、標準のテーブルブロックで行えるカスタマイズ方法を中心に解説します。プラグインを使っている場合も、基本的な考え方は共通です。
スタイルを変更する
テーブルブロックには「デフォルト」と「ストライプ」の2つのスタイルが用意されています。スタイルの変更は、表を選択した状態で右側のサイドバー（設定パネル）から行いましょう。
デフォルトは、すべてのセルに均一な罫線が引かれたシンプルなデザインです。ストライプは、1行おきに背景色が交互に変わるデザインで、行数が多い表でも行を追いやすくなります。
実際の制作現場では、3行以上の表にはストライプスタイルを採用することが多いです。データの読み間違いを防ぐ効果があり、読者にとって親切な表に仕上がります。
文字色・背景色を変更する
表の文字色や背景色は、テーブルブロックの設定パネルから変更できます。テーブル全体の色を一括で変更することも、セルごとに個別に設定することも可能です。
セルごとに色を変えたい場合は、対象のセル内のテキストを選択し、ツールバーの「テキスト色」や「ハイライト」から色を指定します。ヘッダー行だけ背景色を濃くしたい場合などに活用できます。
ここで注意したいのが、色のコントラスト（明暗の差）です。背景色と文字色が近い色だと、文字が読みにくくなってしまいます。「暗い背景色には白系の文字」「明るい背景色には黒系の文字」を基本ルールとして覚えておくと、見やすい表になります。
色を使いすぎると逆にごちゃごちゃした印象になるため、使う色は2〜3色程度に抑えるのがおすすめです。
ヘッダーセクションを追加する
ヘッダーセクションとは、表の先頭行を「見出し行」として区別する機能です。ヘッダーを設定すると、先頭行が太字になったり背景色が変わったりして、各列のタイトルが視覚的に目立つようになります。
設定方法は、テーブルブロックを選択した状態で右側の設定パネルを開き、「ヘッダーセクション」のスイッチをオンにするだけです。同様に「フッターセクション」もオンにできます。フッターは、表の最終行を合計欄や注釈欄として使いたい場合に便利です。
「ヘッダーセクションを使うかどうか」は見た目だけの問題ではありません。ヘッダーを正しく設定することで、検索エンジンやスクリーンリーダー（かんたんに言うと、視覚に障がいのある方がウェブサイトを音声で読み上げるためのソフトのこと）が表の構造を正しく認識できるようになります。ホームページのアクセシビリティ向上にもつながる大切な設定です。
セル幅の固定と配置の変更
標準のテーブルブロックでは、セルの幅は入力された文字量に応じて自動調整されます。列ごとに文字量が大きく異なると、見た目のバランスが崩れてしまうことがあります。
このような場合は「表のセル幅を固定」の設定をオンにしてみてください。設定パネルの中にあるスイッチをオンにするだけで、すべての列が均等な幅に揃います。
文字の配置（左寄せ・中央揃え・右寄せ）も変更できます。セル内のテキストを選択し、ツールバーから配置を選ぶだけです。一般的に、テキストは左寄せ、数値は右寄せにすると読みやすい表になります。
プロの視点では、「見出し行は中央揃え」「データ行は左寄せまたは右寄せ」と使い分けるのが基本パターンです。表全体の統一感を意識することで、格段に見やすくなります。
行・列を追加・削除する
表を作ったあとから行や列を追加したり削除したりすることも、もちろん可能です。操作は、表の中のセルをクリックしてカーソルを置いた状態で、ツールバーの「表を編集」ボタンから行います。
「行を上に挿入」「行を下に挿入」「列を左に挿入」「列を右に挿入」「行を削除」「列を削除」といった操作が選べます。表を作ったあとに「もう1列必要だった」と気づいても、すぐに対応できるので安心です。
ただし、列を大量に追加するとスマートフォンで表示したときに横幅が足りなくなり、表が見切れてしまう可能性があります。列数は「5列程度」を目安にしておくと、スマホでも読みやすい表を維持しやすいです。
テーマの拡張機能で表をカスタマイズする
WordPressのテーマの中には、標準のテーブルブロックに独自のカスタマイズ機能を追加してくれるものがあります。こうしたテーマを使っていれば、プラグインを導入しなくても高度な表のカスタマイズが可能です。
代表的な例が、人気テーマの「SWELL」です。SWELLでは、テーブルブロックに独自の拡張機能が組み込まれており、セルの背景色の一括指定やスマホ用の横スクロール設定、1列目の固定表示といった機能を標準で利用できます。PC表示とスマホ表示を個別にコントロールできるため、レスポンシブ対応に悩むことが大幅に減るでしょう。
お使いのテーマにこうした機能があるかどうかは、テーマの公式サイトやマニュアルで確認してみてください。テーマ側で表の拡張機能が充実していれば、プラグインを追加する手間を省けるうえ、サイト全体のデザインとも統一感が保ちやすくなります。
WordPressの表をスマホで見やすくするポイント
スマートフォンでの表示確認は、表を作るうえで「最も重要なステップ」と言えます。パソコンではきれいに見えている表でも、スマホで見ると文字が極端に小さくなったり、表がはみ出して読めなかったりすることがあるためです。
実際の制作現場では、表を作成したら必ずスマホでの表示をチェックしています。確認する方法はいくつかありますが、最もかんたんなのはWordPressのプレビュー機能を使って、実際にスマートフォンで見てみる方法でしょう。
パソコン上でかんたんにスマホ表示を確認したい場合は、Google Chromeブラウザのデベロッパーツールが便利です。キーボードの「F12」キーを押し、表示されたパネルの左上にあるスマホアイコンをクリックすると、スマホ画面の大きさでページを確認できます。
スマホで表が見切れてしまう場合の対処法として、主に2つの方法があります。1つ目は「横スクロール」を有効にする方法です。表を左右にスワイプして全体を確認できるようにします。Flexible Table Blockなどのプラグインを使えば、この設定がかんたんに行えます。
2つ目は、文字サイズや列数を調整する方法です。列数が多すぎる場合は、本当に必要な列だけに絞ることを検討してみてください。また、表の中の文字サイズを少し小さくしたり、不要な改行を整理したりするだけでも、スマホでの見やすさが大きく改善されることがあります。
多くの制作案件で見てきた中で、「パソコンで見たら完璧な表なのに、スマホだと読めない」というケースは非常に多いです。表を作成したら「スマホでの確認」を習慣にしていただくのがおすすめです。
表を効果的に活用する場面と使い方のコツ
WordPressの表は、情報を整理して伝えたいあらゆる場面で活躍します。ただし、すべての情報を表にすればよいわけではありません。「表にしたほうがわかりやすい情報」と「文章で伝えたほうがよい情報」を見極めることが大切です。
表が効果的な場面として、代表的なものをいくつか挙げてみましょう。料金プランの比較、営業時間やアクセス情報の一覧、サービスの機能比較、商品のスペック表などは、表で整理すると読者が情報を素早く把握できます。
逆に、ストーリーや経緯の説明、1つの項目についての詳しい解説などは、文章で伝えたほうが読者に伝わりやすいでしょう。
表を作るときのコツとして、プロの視点から3つのポイントをお伝えします。1つ目は「1つの表で伝えるテーマは1つに絞る」ことです。複数のテーマを1つの表に詰め込むと、かえってわかりにくくなります。
2つ目は「列の順序を読者目線で並べる」ことです。読者がまず知りたい情報（項目名やプラン名など）を左の列に配置し、詳細情報を右に展開していくのが基本の考え方になります。
3つ目は「情報量を適度に抑える」ことでしょう。表のセルに長文を入れると、表本来の「一目で比較できる」というメリットが失われてしまいます。表のセルにはキーワードや短いフレーズを入れ、補足が必要な場合は表の前後に文章で説明を加えるとよいでしょう。
よくある質問
WordPressの標準機能でセルの結合はできる？
標準のテーブルブロックには、セルの結合機能が備わっていません。セルの結合が必要な場合は、プラグインの「Flexible Table Block」を導入するのがおすすめです。
Flexible Table Blockでは、結合したいセルを選択してツールバーから「セルの結合」を実行するだけで、かんたんに操作できます。ヘッダー行をまたぐ見出しを作りたい場合や、カテゴリ別にグループ化した表を作りたい場合にぜひ活用してみてください。
テーブルブロックとプラグイン、どちらで表を作るのがおすすめ？
結論としては、まずは標準のテーブルブロックで作ることをおすすめします。シンプルな料金表や比較表であれば、標準機能だけで十分に対応できます。
プラグインの導入を検討するタイミングは、「セルの結合が必要」「横スクロール対応が必要」「並べ替えや検索機能が必要」といった、標準機能では実現できない要件が出てきたときでしょう。
プラグインを増やしすぎるとサイトの表示速度に影響が出ることもあるため、「本当に必要な場合だけ導入する」というのが制作現場での基本的な考え方です。
表が崩れてしまうときの対処法は？
表が崩れる原因として最も多いのは、「列数が多すぎる」ことと「セル内の文字量が多すぎる」ケースです。
まずは列数を見直して、本当に必要な列だけに絞ってみてください。5列以下に抑えるのが目安です。次に、セル内の文字を短くまとめられないか検討します。
それでも崩れる場合は、テーブルブロックの設定で「セル幅を固定」をオンにしてみてください。列幅が均等に揃い、レイアウトが安定することがあります。
スマートフォンで表がはみ出す場合は、Flexible Table Blockの横スクロール機能を使うと、表全体を左右にスワイプして閲覧できるようになります。
まとめ
この記事では、WordPressで表（テーブル）を作成する方法について解説しました。
WordPressで表を作る方法は、「テーブルブロック（標準機能）」「エクセルやスプレッドシートからのコピペ」「プラグインの活用」の3つがあります。シンプルな表であれば標準のテーブルブロックで十分ですし、セルの結合や横スクロール対応が必要な場合はFlexible Table BlockやTablePressなどのプラグインを活用するとよいでしょう。
表を作成したら、必ずスマートフォンでの表示を確認することが大切です。パソコンでは見やすい表でも、スマホでは文字が小さくなったり、表がはみ出したりすることがあります。
表は情報整理の強力なツールですが、何でもかんでも表にすればよいわけではありません。「比較・一覧・整理」が必要な情報に絞って活用することで、読者にとってわかりやすいホームページが作れます。