Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPBカップ
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

WordPressの投稿とページにテーブルを追加する方法(HTML必須なし)

WordPressの投稿やページにテーブルを追加することで、データを整理し、読者が情報を消化しやすくすることができます。WordPressは、HTMLコーディングを必要としない簡単なツールを提供することで、このプロセスを簡素化しています。

このガイドでは、WordPressでテーブルを簡単に作成・管理する方法を紹介します。テーブルを挿入する基本的な方法だけでなく、ソートや検索などの高度な機能でテーブルを強化する方法も学びます。すべてプラグインは必要ありません。

この投稿が終わるころには、コンテンツのプレゼンテーションと機能性を向上させるためにテーブルを効果的に使用する知識が身についていることだろう。

Adding tables in WordPress without writing code

動画チュートリアル

Subscribe to WPBeginner

文章での説明がお好きな方は、このまま読み進めてください。

WordPressブロックエディターでテーブルを作成する

WordPressでは、初期設定のブロックエディターを使ってテーブルを追加するのがとても簡単です。

投稿やページを新規作成するか、既存の投稿やページを編集するだけです。コンテンツエディターに入ったら、「+」マークをクリックして新規ブロックを追加し、テーブルブロックを選択します。

テキスト」セクションで見つけることができるし、検索バーに「テーブル」と入力することもできる。

Add table block

次に、表のカラム数と行数を選択するプロンプトが表示されます。どちらも初期設定は2です。

テーブルのカラムや行は後でいつでも追加・削除できるので、正確な数が100%わからなくても心配しないでください。

Table columns and rows

行数とカラム数を入力し、「テーブルを作成」ボタンをクリックするだけです。

するとブロックが表をジェネレータで生成し、画面に表示する。

Table preview

表のセルに文字を入力すると、各セルのコンテンツ量に応じて自動的にリサイズされます。

セルを固定幅にしたい場合は、このオプションを右側に設定できます。ここでは、テーブルのヘッダーやフッターセクションを追加することもできます。

Table options panel

設定パネルから「スタイル」タブに切り替えることもできます。

WordPressテーマには、テーブルブロックのスタイルがたくさん用意されているかもしれませんし、背景色やテキスト色を選ぶこともできます。

Table style and colors

新しい行やカラムを追加したい場合は、表の追加したい箇所のセルをクリックするだけです。次に「表の編集」ボタンをクリックする。

テーブルに行やカラムを追加したり削除したりするオプションがたくさん表示されます。

Add or remove table rows and columns

初期設定では、テーブルのカラムのテキストは左寄せになっています。

列の内側をクリックし、’Change Column Alignment’ボタンをクリックすることで変更できます:

Align table columns

投稿やページ内のテーブル全体の配置を変更することもできます。

アライメントの変更」ボタンをクリックし、リストからオプションを選択するだけです。

Table alignment

これらのオプションは、投稿エリアの通常の境界を超えてテーブルを表示させることができることに注意してください。

投稿日:WordPressのサイト上では奇妙に見えるかもしれませんので、投稿やページをプレビューして、テーブルがどのように表示されるかを確認してください。

これは、私たちのデモサイトに表示されるように「ワイド幅」に設定されたテーブルです:

Table live preview

ご覧のように、投稿エリアの左右の余白を越えて広がっている。

Gutenbergエディターにビルトインされているテーブルツールは、テーブルの表示に多くの柔軟性を与えてくれます。テーブルブロックを使って、読者にデータをわかりやすく表示することができます。

しかし、このブロックには検索フィルターやカスタマイザーなどの高度な機能はない。

また、サイドバーウィジェットや他のページなど、WordPressサイトの複数のエリアで同じテーブルを効率的に使用することもできません。

高度なテーブルを作成するには、WordPressのテーブルプラグインを使用する必要があります。

TablePressプラグインを使ってテーブルを作成する

TablePressは、市場で最高のWordPressテーブルプラグインの一つです。無料のプラグインで、テーブルを簡単に作成・管理できる。さらに、テーブルを区切り編集したり、大量の行を追加することもできる。

もしあなたが、テーブル機能を持たない過去のWordPressクラシックエディターを使っているのであれば、TablePressは投稿やページにテーブルを追加する最良の方法でしょう。

まず、TablePressプラグインをインストールして有効化する必要があります。詳しくは、WordPressプラグインのインストール方法のステップバイステップガイドをご覧ください。

WordPressダッシュボードにTablePressメニュー項目が表示されます。TablePress ” 新規追加で新しいテーブルを作成します。

Tablepress add new

テーブルの名前を入力し、行とカラムの数を決めます。テーブルの行やカラムは後でいつでも追加したり削除したりできる。

テーブル名、行、カラムを追加したら、「Add Table」ボタンをクリックしてテーブルを作成します。

次に、テーブルの情報が表示される画面と、コンテンツを追加できるエリアが表示されます。

TablePress Edit Table

表のセルに必要なデータを入力するだけです。

行やカラムの追加や削除、並べ替えを行うには、テーブル内で右クリックするだけです。オプションメニューが表示され、そこでさらに変更を加えることができます。

Right click table options

テーブル操作」などの詳細オプションは、「テーブルコンテンツ」エリアの下にある。

ここから、行の追加、削除、複製ができます。

Table manipulation options

テーブルオプション」では、ヘッダー行やフッター行を追加することができます。

また、テーブル名と説明を表示する場所を決めることもできる:

Advanced table options

最後に、「サイト訪問者のためのテーブル機能」セクションで様々なオプションを設定することができます。

これらの設定により、読者がフィルター、検索、ソートできるレスポンシブテーブルを作成できます。

Table features site visitors

テーブルが完成したら、「変更を保存」をクリックします。

その後、Tableショートコードをコピーしてください。次のステップで必要になります。

テーブルを表示したい投稿またはページを編集し、エディターにショートコード・ブロックを追加する。

Add shortcode

その後、先ほどコピーしたショートコードをショートコード・ブロックに追加する。

更新または変更を保存することを忘れないでください。

一方、クラシックエディターを使っている場合は、ショートコードをそのまま投稿に追加するだけです:

Shortcode in classic editor

将来テーブルを変更したい場合は、ダッシュボードのTablePressに戻って変更することができます。テーブルを使用している投稿やページは自動的に更新されます。

TablePress では、スプレッドシートや CSV ファイルからデータをインポートすることもできます。同様に、TablePress のテーブルデータを CSV ファイルにエクスポートし、Microsoft Excel や Google Sheets などのスプレッドシートプログラムで開くことができます。

この投稿が、HTMLを使わずにWordPressの投稿やページに表を追加する方法を学ぶのに役立てば幸いです。WordPress で目次を作成する方法や、WordPress のエキスパートが選ぶ最高のテーブルプラグインもお勧めです。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

情報開示 私たちのコンテンツは読者支援型です。これは、あなたが私たちのリンクの一部をクリックした場合、私たちはコミッションを得ることができることを意味します。 WPBeginnerの資金源 をご覧ください。3$編集プロセスをご覧ください。

アバター

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

究極のWordPressツールキット

ツールキットへの無料アクセス - すべてのプロフェッショナルが持つべきWordPress関連製品とリソースのコレクション!

Reader Interactions

130件のコメント返信を残す

  1. Harindu Perera

    How to show grid lines in TablePress???

  2. Lorraine

    Many thanks. This made things so clear.

  3. Can Erik

    Great article. Thank you very much. Easy to install and understand to use. Cheers!

  4. mangi khumakcham

    Good table plugin but not mobile friendly.
    The table right side get clipped in mobile view.

  5. Sany

    Hey

    Can someone show me, how I can create dynamic table?

    I am new to WordPress. I like to maintain a database of gadgets say phones. I want an interface for me as admin to enter the specs and a picture of the item. For users, they will have the option to filter by brand and also compare 2 or more of these gadgets in a table format. They should also query an item and see all the specs in a table format. Please advice as to how this can be easily managed or maybe you have an article already for this!?

    thanks

  6. Stephen Ainsworth

    Amazing people don’t know how to use

    and have to use a plugin. Sigh.

  7. Noman S Baranian

    That is nice thing to learn and gain.. nice blog

    • Thanks for this! Now, how do I...

      Please, other readers, don’t be to harsh with me (especially using the R word). I am very new to all of this and feel successful in creating my first table. Now, how do I change the look and feel of the text in the table? I am using it to link to materials contained further on the page and highlight important pieces.

      • a guy

        You need to use CSS. There’s a bit of a learning curve to all this (in your case, you might want to style the table, rows, table cells, paragraphs in table cells, links, hover effects etc etc), so only start if it’s really important.

    • Tablepress - warning

      I just lost a Table that I created using Tablepress. I don’t know how it was deleted, but I also just found out that there is no way to recover a deleted table. Since I don’t know how the table was deleted, I am worried about relying on Tablepress.

  8. Lilli

    Great! Great! Just what I was looking for! Thanks a million :)

  9. David

    Is it me or Wordpress is retarded? I mean any WYSIWYG editor can do a table on the fly these days, but the biggest CMS can’t? I must be missing something here, but using a plugin or iframes is so much trouble for a simple table… I’ll code it myself.

    • Vituz Andersen

      David,- I am with you. I dont get it. My first HTML editor back in 1998 had tables…. how come it has become easy to make a CMS based website, but you cant make a table…. Hellooooooo!!

    • Mayur

      Hi David,

      I initially wanted to code it in myself, but wordpress kept formatting my table all over the place. Is there a specific was to use HTML in a page?

      Many Thanks

  10. Sirje Koop Palmqvist

    I copied a table from Word into Wordpress and the code is neat and clean. It works well. Now I want to try the same table with the FooTable plugin to make it responsive, althought it already is responsive in a way. Thought that a webdesigner keeps the material on the local computer anyway and thus can make changes in Word and replace the table in WP. This might be cheating but it works. Sirje

  11. Radu

    TablePress is an amazing plugin.

    Thank you for this post.

    Actually today I downloaded it and already donated some money to their team.

    Have a fantastic day everyone.

  12. Emily

    Use it with FooTable to make it Responsive. They both support each other. Perfect!

  13. Ernest

    Hi,

    Is there any way to remove the table lines from showing?

  14. Neal

    The problems with plugins like this is that if you ever abandon the plugin the content linked to that plugin is busted across your entire site.

    While very slick plugin I try to minimize my database dependency on them as much as possible.

    • WPBeginner Support

      Neal, you are right about that. However, TablePress uses custom post types for tables. This means your tables are stored in the database even if you deactivate the plugin. You can still export the data.

      管理者

  15. Group Of Oceninfo

    Hello Wpbeginner Team,

    Is it possible to call script in same way ?

    For ex. I have 1000 different scripts for 500 different post.

    I want to call 2 table in each post and in that table Want to run script not text so Is it possible to call two scripts in table ?

  16. ore

    Thanks for this! what resources can I use to create a table in which my clients can log in and post the prices of items they want to either buy and sell and which remains visible to the public

  17. Balaji

    Thanks for helping me find the plugin.

  18. Rátkai Tamás

    I’m interested in adding a table to a form or page. So if a user goes to the page, he can add the Quantity in the cells and at the bottom of the form he can send the table to me.

    Basically it would be a really simple order page without any payment options.

  19. um

    how many table we can add in a wordpress without using plugin

  20. Pierre

    I’v been trying to insert a table in a blog post by using the tablepress plug in. Suddenly, the word Edit inside a pair of brackets has been appearing in the lower left corner of each page of my web site. I can’t get rid of it. Do you know how I can fix this?

    Many thanks!

    Pierre

  21. Jennifer

    Exactly what I needed to create my press page. You rock.

  22. Nouman Younas

    superb… i just install it after reading this post… i am having some issues when i go for mobile preview… lets see, overall great plugin and post (Y)

  23. sady

    How to add Subscribe form like yours??

    Thanks

  24. Alicia Rades

    Wow! I love this plugin. Thank you!

  25. Anil Anvesh

    Ok, I installed the plugin and used a short code to add table to post. Now my query is what google reads short code or table content? Is it seo friendly? Give me a linke to your post where you used this plugin?

  26. Andrew

    I like the plugin, but I cannot figure out how to customize the width/height of the columns/rows, or how to have a particular cell be only as large as the contents inside it. Is there any way to do this? Thank you.

      • reGz

        How to split a column in Combine cells?
        any idea?

        Thanks

  27. Sylvester

    Please, is the data entered using tablepress stored in MySQL tables?

    • Simon

      Good question, I’m interested in the answer too. Anybody knows. Thanks! I’ll see if I can check.

  28. Arnel leo Aranquez

    is there a way to use this plugin in viewing data from mysql?

    • WPBeginner Support

      No we don’t think it was written for that. However you can export a mysql table as CSV and import it in TablePress.

      管理者

      • Lindberg

        It would be awesome if it could view any mysql tables in the database.. should be an easy thing to fix and increase usefullness of this plugin so much

  29. Helen Edwards

    How do I remove the “Show xx entries” at the top of the table and “showing 1 to 6 of 6 entries” at the bottom?

    • Emily

      Actually it is out there when you add row and table. The setting is just below it. Look carefully.

  30. Jaya

    Hi,
    how can i use the tablepress form in my post section to particular user can able to add tables using copy, import files… Please help me to use…Thank you.

    regards
    Jaya

  31. Bamboo

    This is a huge time saver. Thank you!

  32. Amanda

    This is a great plugin. i have one question – i nee ot make the font bigger for the info that’s in my table. is there any way to do this other than entering code for each cell individually?

  33. Amy

    So which WordPress version are you writing for? WordPress.com or WordPress.org, because I can’t find the plugin option on my dashboard. You really should specify this … now I’m back to writing code by hand after getting my hopes up.

  34. Jimi Mikusi

    Wow.

    I’m not easily impressed but this managed to do it.
    Within minute after adding the plugin I had a visual pleasing and easily maintainable table on my site.

    Thanks!

  35. Eddu

    Love this plugin.
    Tried to style the table with Headway. No luck so far. Did someone else tried also? Would be great if it would be possible to do so.
    Again, great plugin :-)

    Ed.

  36. William Lower

    What a treasure this was to find! This non-programmer was having a serious non-day trying to create tables with code.

  37. Chrissy

    Thanks for this ! Ive been searching the web trying to find a solution because I see all these awesome pricing tables on websites and Ive been using the TinyMCE plugin, which works but its not what I am really needing. Thanks again you guys rock

  38. Vickie

    Thanks for another very useful post!
    Please does anyone know if it is possible to add code into a cell? I need to add paypal code into a table but not sure the best way to do it?

    • Jeff Cohan

      Did you try simply pasting the code into the cell?

  39. Yvonne Finn

    Thanks so much for this relatively simple to use plugin. It has saved me from much frustration as I am no techie and don’t actually want to spend hours doing what can be done with a plugin.

    I tried some of the other plugins for creating tables and was not impressed with their user-friendliness or lack thereof.

    Much appreciation!
    Yvonne

  40. Jon Mason

    THIS is a work of art! Nicely done and it is responsive too!

  41. M.Aswad Mehtab

    Thanks for This post very helpful for those who are not good with html and css !!

  42. David

    This looks like Tables Reloaded, which we use on some sites. However, it looks easier to use and manage. How well does it work with caching plugins like w3 total cache?

    • Editorial Staff

      This is the successor of WP Tables Reloaded plugin worked on by the same developer (Tobias). Tobias also commented on this post saying that the next version will be compatible with W3 Total Cache.

      管理者

  43. Jeff Cohan

    Absolutely agree: TablePress is THE BEST plugin for creating tables in WordPress (IMHO).

    Just a few things to add:

    1) TablePress is the successor to what USED TO BE the best plugin for creating tables in WordPress: WP-Table Reloaded (now retired). Both are the work of developer Tobias Bathge.

    2) Tables built with WP-Table Reloaded can be migrated to TablePress.

    3) Tobias’ support is extraordinary. When I first used TablePress in November of 2012, I encountered a bug in the HTML import function and reported it in the support forum at WordPress.org. Within an hour, Tobias published a fix to Github. But don’t take my word for it. Check out the support forum.

    Jeff Cohan

  44. Keith Davis

    Thanks Guys
    This could be the table plugin for me.

    In the past I’ve created tables in Dreamweaver then cut and pasted the code.

    I’ll throw out a few tweets on this one.

    • Editorial Staff

      Keith, this is by far the best one we found so far as well. Totally appreciate the social media love that you send us :)

      管理者

  45. Jason

    I just got this plug in last week as an alternative to using google docs iframe functions. This works great and allows a client to update the table without updating the pages or posts. I did find that you have to make sure you empty the caches if you are using the W3 plugin, or else you will get a cached version of the table. Great write up.

    • TobiasBg

      Great to hear that you like the plugin!
      What you say about caching plugins, like W3 Total Cache, is true. Good thing though: The next version of TablePress will automatically clear the W3 Total Cache page cache, to make sure that all shown tables are up-to-date :-)

      Best wishes,
      Tobias
      Author of TablePress

  46. Rod Salm

    Seems odd to put a table creating tab in the main Wordpress menu. The menu is supposed to be for top level functions. It seems that it should be in tools maybe, or in the post menu, where you select the tables, have the table making function accessible in the edit functions. Most times people are creating tables in posts and pages and would need to edit the table as well as the data within it.

    Having said that, it’s a pretty slick table maker.

    ­Rod Salm

    • TobiasBg

      I agree that the main menu is not always the best option, like when you only maintain a few tables once in a while. So, I made this an option :-) In the TablePress Plugin Options, you can actually choose where you want the TablePress menu entry to appear. Moving it to “Tools” or “Posts” is no problem with that :-)
      (The predecessor of TablePress put its menu under “Tools” by default. I then however got questions from users who couldn’t find it, after activating it. That is why TablePress will sit in the main menu by default.)

      Best wishes,
      Tobias
      Author of TablePress

    • Artem Russakovskii

      You can change the placement in the plugin settings.

    • Editorial Staff

      Not odd at all. It is done for organizational purposes similar to contact forms, sliders, etc. By doing it this way, you can easily go to the menu and look at all the tables you have ever created rather than searching through the individual posts.

      管理者

  47. Blograzzi

    This is good. I use it. But I want to ask something. What if i have 7 column and 10252 rows excel table?

    • Editorial Staff

      10,000 rows? Why in the world would you want that to be part of your blog post? Attach it as a separate file, so those who want to download it can do so if they like. It would freak the user out to see how long the page is if you have that many rows.

      管理者

    • TobiasBg

      As the editorial staff pointed out already, there are better methods for such large tables, like offering a download, or using a custom PHP/mySQL solution.
      You can certainly try using TablePress with a table of that size, but I don’t really recommend it. It should work, but it will probably be slow, especially on the “Edit” screen of the table.

      Best wishes,
      Tobias

  48. ivica

    Absolutely THE best table WordPress plugin at the moment. I tried them all, and this one is the most robust/powerful and yet at the same time the most simple to use. Good choice! :-)

返信を残す

コメントありがとうございます。すべてのコメントは私たちのコメントポリシーに従ってモデレートされ、あなたのメールアドレスが公開されることはありませんのでご留意ください。名前欄にキーワードを使用しないでください。個人的で有意義な会話をしましょう。