はじめに
TablePressはWordPressにExcel風の表を簡単に作成できるプラグインです。ショートコードで投稿・固定ページに埋め込めるほか、CSVやExcelからのインポート、DataTablesによるソート・検索機能にも対応しています。
症状・原因
- WordPressの投稿に見やすい表を作りたい
- ExcelやCSVのデータをWordPressに取り込みたい
- 表にソート・検索・ページネーション機能を追加したい
- テーブルのCSSデザインをカスタマイズしたい
解決手順
ステップ1：TablePressをインストールする
wp plugin install tablepress --activateステップ2：テーブルを作成する
TablePress → 新しいテーブルを追加
→ テーブル名: 「料金表」
→ 行数: 5 / 列数: 3
→「テーブルを追加」をクリック
セルに入力:
→ A1: プラン名 / B1: 月額 / C1: 機能
→ A2: スタンダード / B2: 980円 / C2: 基本機能
→ A3: プロ / B3: 1,980円 / C3: 全機能
テーブルオプション:
→「1行目をテーブルヘッダーとして使用」: ON
→「テーブルフッターを表示」: OFF
→「変更を保存」ステップ3：表をページに埋め込む
ショートコード（自動生成される）:
[table id=1 /]
Gutenbergブロック:
→「+」ブロック追加 → TablePress → テーブルを選択
投稿エディターに貼り付けるだけで表が表示されますステップ4：DataTablesオプションを設定する
テーブル設定 → DataTablesオプション:
→「テーブルのソートを有効にする」: ON
→「テーブルの検索/フィルタリングを有効にする」: ON
→「テーブルのページネーション」: ON（20行ごと）
→「テーブルを幅100%で表示」: ONカスタムDataTablesオプション（JSON）:
{
"order": [[1, "asc"]],
"pageLength": 10,
"language": {
"search": "検索:",
"paginate": {
"previous": "前へ",
"next": "次へ"
}
}
}ステップ5：CSVからテーブルをインポートする
TablePress → テーブルのインポート
→ インポート元: CSV
→ ファイルを選択 → 文字コード: UTF-8
→「既存のテーブルに追加」または「新しいテーブルとして作成」
→「インポート」をクリック# WP-CLIでTablePressのテーブルを確認
wp post list --post_type=tablepress_table --fields=ID,post_title,post_name
# テーブルのJSONデータを取得
wp post get {ID} --field=post_content | python3 -m json.toolステップ6：テーブルのCSSをカスタマイズする
/* 外観 → カスタマイズ → 追加CSS */
/* ヘッダー行のスタイル */
.tablepress thead th {
background-color: #1d2327;
color: white;
font-weight: bold;
padding: 10px 12px;
}
/* 偶数行のストライプ */
.tablepress tbody tr:nth-child(even) td {
background-color: #f6f7f7;
}
/* ホバー効果 */
.tablepress tbody tr:hover td {
background-color: #e8f0fe;
}注意事項
- TablePressのデフォルトCSSを無効化するには「TablePress → プラグインオプション → CSSを使用しない」をONにしてください
- DataTablesを使うとjQuery依存が増加するため、パフォーマンスを重視する場合はOFFを検討してください
- 大量データ（500行以上）はサーバーサイドレンダリングを検討してください
まとめ
TablePressはショートコード [table id=1 /] で簡単に表を埋め込めます。DataTablesを有効化するとソート・検索・ページネーションが追加され、CSVインポートで既存データも活用できます。