The other day I wanted to create a table to the wordpress blog post. In fact I had already created the table in excel -- which I prefer as a very fast way of creating tables and essentially wanted to just copy paste it in the wordpress post. This is when I realized that using tables in wordpress was not all that simple. To insert a table in to wordpress either I had to use a plugin like WP-Table or write some html code to achieve the same.
However, after some experimentation, I could figure out an easy way to do so without the need for either a plugin or HTML. All you need to do is a small copy paste and a one line edit -- and your are done. Lets see how to do it ( Steps validated on WordPress 2.9 ).
Step 1 -- Create the table
As I mentioned above, I prefer to create my table in excel( you can also use word if you are comfortable with it ). I can quickly enter data in cells and change column widths to get the desired output. Refer the snapshot below to see the sample table created in excel.
Just select this table and copy it using Ctrl-C or the Edit->Copy menu.
Step 3 -- Bring Table to WordPress Post
In the wordpress post editor, there is an option called <Paste From Word>. Select that option from the editor after choosing the place in the post content where you need to insert a table in the post. Refer snapshot below ( notice the red circle )
Press <Ctrl-V> and paste the table that was just copied from excel in the pop-up window that appears. Click on <Insert> button on right bottom which should paste your table in the wordpress post.
Step 4 -- Format Your Table
Once you paste the table in the post as mentioned above, it would look like the snapshot below. Note that there is no border around the table.
Now to get the border, all you need to do is a one character edit by switching to HTML view ( by clicking on HTML tab on top right of above snapshot ). Followng snapshot shows the corresponding HTML code generated for the table pasted above. In case you pasted the table eg in middle of the post content, to locate the code of your table -- you can look for the piece of text below which you inserted the table in the HTML view.
Now all you need to do is change <table border=”0” to <table border=”1” and your are done!! This tells the code to draw border around the cells of the table. The final snippet should look like the one below ( notice border=”0″ changed to border=”1″ )
Now your are all set, do a preview of the post and table would look like the following.
The interesting thing is that now you can tune your table by going back to the Visual view ( we went to HTML view to change table border ). You can click inside a cell and align the text within it to left or right using the post edit menu. You can also increase/decrease size of the table by pulling the pointer at the corners of the selected table. As an example, I made the first row headings in bold just by selecting the top row cells and clicking on <Bold> icon in the post edit menu and also increased the size of the table. The result is as given below which finally enables to conveniently add a table to wordpress post.
So next time you need to create a table in wordpress post, do try the above method and let us know your feedback. If you liked this post and found it useful, do share it using the buttons available below this post. You can also submit to us any usefool tools/web services that help improve productivity.
If you know of any other better way to insert tables in wordpress post -- do share it with us in the comments section.