Easy Table is The Easiest Way to Create Table in WordPress

easy table wordpress plugins

Easy table wordpress plugins screenshot

Hello, this is the official post about my newest WordPress plugins, Easy Table. As it’s name, Easy Table is WordPress plugin to create table in post, page, or widget in easy way using CSV format. This can also display table from CSV file.

Easy Table is a WordPress plugin that allow you to insert table in easy way. Why it’s easy? Because you don’t need to write any complicated HTML syntax. Note that this plugin is not a graphical user interface table generator, so you can simply type your table data directly in your post while you writing. No need to switch to another window nor click any toolbar button.

Easy Table using standard CSV format to generate table data, it’s easiest way to build a table.

Some Features

  • Easy to use, no advanced skill required
  • Display table in post, page or even in widget
  • Read data from CSV file and display the data in table
  • Sortable table column (using tablesorter jQuery plugin)
  • Fancy table design (using Twitter CSS bootstrap)
  • WYSIWYG safe, I mean you can switch HTML/View tab in WordPress editor without breaking the table data.

Example:

1. Basic Example

[table]Year,Make,Model,Length
1997,Ford,E350,2.34
2000,Mercury,Cougar,2.38[/table]

Result:

Year Make Model Length
1997 Ford E350 2.34
2000 Mercury Cougar 2.38

 

2. More complicated table data:

[table]Year,Make,Model,Description,Price
1997,Ford,E350,"ac, abs, moon",3000.00
1999,Chevy,"Venture ""Extended Edition""","",4900.00
1999,Chevy,"Venture ""Extended Edition, Very Large""","",5000.00
1996,Jeep,Grand Cherokee,"MUST SELL! air, moon roof, loaded",4799.00[/table]

Result:

Year Make Model Description Price
1997 Ford E350 ac, abs, moon 3000.00
1999 Chevy Venture "Extended Edition" 4900.00
1999 Chevy Venture "Extended Edition, Very Large" 5000.00
1996 Jeep Grand Cherokee MUST SELL!
air, moon roof, loaded
4799.00

In the second example above, the cell data that has commas and quote should be wrapped with ” (double quote).

 

3. Table with no heading

[table th="0"]
row1col1,row1col2,row1col3
row2col1,row2col2,row2col3
row3col1,row3col2,row3col3
[/table]

Result:

row1col1 row1col2 row1col3
row2col1 row2col2 row2col3
row3col1 row3col2 row3col3

 

4. Table with caption, custom class and no tablesorter

[table caption="This is example table in WordPress" class="table table-bordered" tablesorter="0"]
row1col1,row1col2,row1col3
row2col1,row2col2,row2col3
row3col1,row3col2,row3col3
[/table]

Result:

This is example table in WordPress
heading1 heading2 heading3
row1col1 row1col2 row1col3
row2col1 row2col2 row2col3
row3col1 row3col2 row3col3

 

5. Table with auto index, start from number 1 (since 0.9)

[table ai="1"]
 head1,head2,head3
row1col1,row1col2,row1col3
row2col1,row2col2,row2col3
row3col1,row3col2,row3col3
row4col1,row4col2,row4col3 
[/table]

Result:

No.head1 head2 head3
1row1col1 row1col2 row1col3
2row2col1 row2col2 row2col3
3row3col1 row3col2 row3col3
4row4col1 row4col2 row4col3

 

6. Table with new line in a cell (since 0.9)
Any nl value would be replaced with new line while rendered. nl could be one character or more. Be wise to use character here, make sure it’s not very common character that may used in your data.

[table nl="~~"]
head1,head2,head3
row1col1,row1col2,this~~should~~be~~in~~one cell
row2col1,row2col2,this~~
also~~
should~~
be~~
in~~
one~~
cell
row3col1,row3col2,row3col3
row4col1,row4col2,row4col3
[/table]

Result:

head1 head2 head3
row1col1 row1col2 this
should
be
in
one cell
row2col1 row2col2 this
also
should
be
in
one
cell
row3col1 row3col2 row3col3
row4col1 row4col2 row4col3

7. Table from file

[table file="http://img.takien.com/2012/05/test.csv"][/table]

Result:

a b c
d e f
g h i

Download latest version


Download from WordPress.org or directly from your wp-admin, search “Easy Table” in the plugin installer.

Note:

  • If you creating custom theme, please make backup to another directory or local before update plugins
  • After installing you have to go to Settings->Options and click Save once to load the default settings.
  • Backward compatibility of function str_getcsv is not work. So if your PHP version is lower than 5.3.0, the table will only show first row. Fixed in version 0.2, please update if you have installed the previous version.

Video Tutorial

Still confusing how to install and create first table? Check out this video tutorial.

(video by: webdesy.com)

 

Leave a Reply

*

Comments (1,003)

  1. Hi I’m a teacher and use tables as illustrations to convey a topic, and since what I’m teaching goes beyond one word, I need to punctuate the sentences within the tables with commas. I see instructions in the documentation on how to do so for a series in a certain column in a table (i.e., apples, bananas, and oranges), but I’m looking to punctuate introductory sentences like this one for example within a table: Once their need for deliverance is exposed, it will deflect attention away from them. I have tried placing the comma itself in single and double quotes as the documentation suggests, but neither of those add the comma. Can anyone help me with this? Thanks.

    Reply
    1. Try to put the whole sentence in quotes like this: “Once their need for deliverance is exposed, it will deflect attention away from them.”

      Reply
  2. Hello, I am trying to create a table with Chinese characters, but the Chinese does not show up correctly. What can I do? Thanks

    Reply
  3. Is it possible to create a table that automatically sorts alphabetically? For example, a table of helpful links on a page that is added to periodically with the result being an alphabetically sorted table by the contents of the first column. Thanks ……

    Reply
  4. I inserted a table into the site I’m building. When you mouseover the lines it highlights them in white. When this happens you cannot see the text because its a dark backround with white text can that be shut off? over the highlight color changed??

    Reply
  5. I’m having a problem hyperlinking a phrase that has a comma. Does anyone know how to do this? I’ve tried multiple combinations of quotes/double quotes in different places to no avail.

    Reply
  6. Hi there, thanks for the easy to use plugin! Is it possible to configure a cell (or row) within a table to display as a heading? i.e. so we can have multiple headings? OR is it possible to apply a class to a TR?

    Reply
  7. Hi there. I’m trying exclude the first column (which is the no.1,2,3.. etc) from sorting – I just cant seem work that out. One more issue – i need the sorting to be done around the the numbers (1.97,3.27..etc) from the Overall score column and everything else follow (except first column 1,2,3 etc)

    Hope that makes sense :) Thankyou.

    [table caption="Test" colalign="center|center|center|center|center|center|" ai="1" ]

    Place[attr rowspan="1"],Espresso[attr colspan="1"], Latte[attr colspan="1"], Overall Score[attr colspan="2" sort="desc"]

    Cup1, 1.70, 2.25, 1.97,Poor

    Cup2 ,2.00, 4.55,3.27, Good

    Cup3, 3.10, 3.53, 3.31, Good

    Cup4, 2.20, 1.00, 1.60,Poor

    [/table]

    Reply
    1. figured how to do this. But now i wanna know if its possible to keep that coloumn dynamic?

      I’ve tried making the sort attribute equal to false, however when i add a different sort attr to another coloumn then the auto colomn changes as well.

      I’m creating a football league table.

      I just want the first (auto increment) colomn to be static, not changing at all, regardless of other data within the table. It should remain the way it is at all times, is there a way to do this please?

      Reply
  8. I have two questions,
    1. Is there a way to make certain cells linkable?
    2. Is there a way to make the whole table “searchable” for certain columns?

    Reply
  9. UniversityPhysicsTutorials

    Hi can someone help please; The column widths are all over the place. I’d like to specify the width of each column and wrap the text accordingly. Can anybody help? Thanks in advance

    Reply
  10. Thanks for awesome plugin – my table looks great. I’d really love to be able to highlight some individual rows with a new background colour or even just a different colour or strength for the text. Can you please offer some code additions for me?

    Reply
  11. I have TH set to ON by default, but I have one table where I don’t want the first row to be a header – but I can’t figure out the code to stop it

    Sorry, missed it in Docs, found it now – th=”0″

    Reply
  12. Can’t get load from csv to work.

    I’m using basic 2 column, 1 row + header csv as a test. URL i’m using loads in browser. PHP version is 5.3.x, file name is ‘test1.csv’, no funny chars in csv itself, allow csv from file is checked in settings. Stumped on where else to look to get this thing working! Any tips appreciated. I am a new wp user although not new to this type of stuff.

    Many thanks in advance

    Reply
  13. Hi
    I tried and used easy table. very very good.
    I’d like to add a link per line. when onmousehover each line, a click would bring me to a each different page par ligne. (a link that i could store on each line via lin= or something like that)
    how to do this ?
    I tried to add a href link for the entire line (3 cells) but only the first cell is the link.
    best regards

    Reply
  14. i’m looking for a table like 1 weeks now, this one is closes to what i want BUT there one thing that i want to do. It is no add click box in every string in list and after that member can click these and send them to me. In short version user can chose from list and create a then send them to me via email. Is it possible and how ? Can you make pro version with these featues ?

    Reply
  15. Hi! I’ve noticed that characters ÆØÅ are not shown if they are first character in a cell content.
    Example:
    [table width="600" colwidth="150|150|150|150" colalign="left|left|left|left"]
    Åse, Olsen , Assitant Managing Director ,Oslo
    [/table]

    Reply
    1. Try to wrap those characters with double-quote.


      [table width="600" colwidth="150|150|150|150" colalign="left|left|left|left"]
      "Åse", Olsen , Assitant Managing Director ,Oslo
      [/table]

      Reply
      1. Thanks! Worked as a charm.
        Is there anyway to make the tables responsive? Do you have any tips for css I could add so that the tables do not keep the full width on mobile devices?

        Reply
  16. Hi Takien, Just a quick question I can not see a solution to. Is it possible to add a paragraph break in a cell? I have tried ~~~~ but this changes the style of the text after it. Any pointer appreciated. Tony

    Reply
    1. Use custom terminator for newline, then use linebreak as usual

      [table terminator="|"]
      one
      one1
      one2
      one3,
      two
      two1
      two2
      two3 |
      three
      three1
      three2
      three3,
      four
      four1
      four2
      four3

      [/table]

      Reply
  17. How can I wrap text in post around table

    I want it like this:

    texttexttexttexttexttext
    table table texttexttexttext
    table table texttexttexttext
    texttexttexttexttexttexttexttext

    Reply
  18. Hey bro, I don’t found the check for activate Easy Table in one widget :( . Is perfect when I put the code in a simple page, but I want to put the same code in Widget, don’t show. I hope that you can to help me. Greetings from Venezuela.

    Reply
  19. It appears on Firefox too,
    I think its not caused by Easy Table plugin, please remove characters around the table cell (including whitespace).
    Do you copy/paste text from PDF?

    Reply
  20. I trying to get the table display as striped in a widget .. but it is not working .. for some reason the same code works in the preview page. Also how can I get the header to stand out ? Thanks

    Reply
  21. When I activate Easy Table the icon that allows me to use it doesn’t show up in my toolbar or side menu. Is there a setting somewhere that I’m missing?

    Reply
  22. Hello and thank for this marvelous plug-in !

    There is a strange behavior when I use an accented character like “é”, the name with it, is placed at the bottom in the sorted column, i.e. bédouin, bleu, briller, in the sorted column I have: bleu, briller, bédouin), but if a remove the accented it’s correctly sorted, bédouin, bleu, briller.

    Any idea ?

    Thank you.

    Reply
  23. I posted this question several days ago, I have not had a reply…..can anyone help? takien?

    I would like to change the font within each column. i.e font style & colour. Can you advise how this would be possible. If CSS please can you supply a sample code to enable me to understand this in future?

    Many thanks

    Reply
    1. Hello, sorry for that.
      To change style you have to write CSS in your current theme ( Under Appareance => Editor)
      all table has class .easy-table,

      example, to change font and font size

      table.easy-table tr td {
      font-family:Arial;
      font-size:20px;
      color:red

      }

      Reply
      1. Hi, thanks for that.

        What about individual Columns rather than the whole table. I would like Column 2 to be a different font and column 3 and 4 to be different again?

        Reply
        1. You can use nth-child CSS selector

          Example:

          1. This will only applied to first column


          table.easy-table tr td:nth-child(1) {
          font-family:Arial;
          font-size:20px;
          color:brown
          }

          2. And this will only applied to second column


          table.easy-table tr td:nth-child(2) {
          font-family:Arial;
          font-size:20px;
          color:red
          }

          3. And this for both column 3 and 4


          table.easy-table tr td:nth-child(3),
          table.easy-table tr td:nth-child(4) {
          font-family:Arial;
          font-size:20px;
          color:blue
          }

          Reply
  24. Hi guys,

    I want to add two colors to my tables, Green for “Win” and Red for “Loss” but after months of trying, I really can’t figure it out. Any help?

    [table caption="Romario Manoel da Silva (23-10-1)" class="table table-bordered" tablesorter="0"]

    Result,Opponent,Method,Round – Time,Event

    Win,Erimilson da Silva Cavalcante,Submission (Guillotine Choke),2 – 2:06,OX MMA – OX MMA

    Win,Fabian Gustavo Armoa,Submission (Guillotine Choke),1 – 1:39,Elity – MMA 10

    Loss,Jay Hieron,Technical Submission (Brabo Choke),2 – 2:04,LFC 12 – Legacy Fighting Championship 12

    Win,Jaime Jara,Unanimous Decision,3 – 5:00,Shark Fights 19[/table]

    Reply
    1. Use cell attribute on each cell you want to customize.


      [table caption="Romario Manoel da Silva (23-10-1)" class="table table-bordered" tablesorter="0"]
      Result,Opponent,Method,Round - Time,Event
      Win[attr style="color:green"],Erimilson da Silva Cavalcante,Submission (Guillotine Choke),2 - 2:06,OX MMA - OX MMA
      Win[attr style="color:green"],Fabian Gustavo Armoa,Submission (Guillotine Choke),1 - 1:39,Elity - MMA 10
      Loss[attr style="color:red"],Jay Hieron,Technical Submission (Brabo Choke),2 - 2:04,LFC 12 - Legacy Fighting Championship 12
      Win[attr style="color:green"],Jaime Jara,Unanimous Decision,3 - 5:00,Shark Fights 19[/table]

      Reply
  25. I used double quotes around phrases that contain a comma, but the double quote shows up on the actual table and words are displayed in different columns. Tried double, double quotes and the same thing happens. Any advice??

    Reply
    1. Double quote must exactly wrap the cell, ensure that there’s no space or other character outside the double quote.

      Reply
      1. No, there isn’t. Still not working.

        Also, how do I change the hover colour of the row? (i.e. the background colour when the mouse is hovered over a particular row)

        Reply
        1. Another alternative is to preceding comma with backslash immediaely before comma.

          one, two, three, four

          These comma wont be parsed as columns

          Reply
  26. Hi guys how do i create a static header and load a csv file? i need this because i want to sort the column by defult. im busy with this so i might get it by the time you guy answer, thanks in advance

    Reply
  27. I have a suggestion for EasyTable: allow us to specify post IDs in the settings to only use easytable on those posts. Right now the javascript and css show on every post I’ve made though I only use it on one.

    Reply