Join 9,000+ Readers

Publishing Tables in WP Admin Editor using TablePress

by Jake Rocheleau

on March 17, 2013

in Wordpress

How many times have you been writing a page or blog post and run into the nuisance of coding out a custom HTML table. It doesn’t happen all too often, but when you don’t have prebuilt styles it feels like a hindrance towards building your content further. This may be corrected by styling your own custom tables ready in advance for your posts.

open source tablepress plugin wp screenshot

But I feel there are other solutions which offer much more versatility. Most notably the WP plugin TablePress has gained a lot of attention over the recent months. In this article I would like to explain how we can go about configuring this plugin and getting code ready for your webpage. The settings are not too complex, although there are many options and advanced features for power users who are always finding themselves stuck working with tables.

What is Possible?

You may be asking why this plugin is even worth the time for testing. Well TablePress has a live demo which you can check out for yourself. This includes automatic column sorting with Ajax-style pagination. You can actually split up tables into multiple pages so that content isn’t streaming down the page into 100s of rows.

Similarly you may combine content using colspan and rowspan to generate some more thrilling layouts. Keeping your design neat & organized is the most important step. I feel that TablePress can help with all of these needs, plus many more useful interface features. One of the biggest features includes alternate row colors known as “zebra striping”. Also when you hover over individual rows the background will highlight so it is easier to read across the data columns.

wordpress open source demo tablepress plugin

There are an enormous amount of possibilities with TablePress. It can be difficult to know if this is the right plugin for you, or if this would ever come in handy down the road. If you have read this far try installing TablePress through the Admin panel and give it a quick test run.

Basic Installation

Open up your administration panel and go to Plugins -> Add New. From here you may search for the tablepress plugin and it’s only a one-click install. From here you will have the option of setting up new table IDs and adding them into your posts via shortcodes.

The beauty of this plugin is how the content may be separated from all your inner post data. I feel this is important to explain because when adding your codes into the post it will not show up within the editor. You should skim the documentation page to learn a bit more about their shortcodes. But the GUI will also include a small button icon inside the text editor, so this is always another option.

If you do not want to write out all the table content in TablePress’ plugin area you may add content into external documents and import them to WordPress. The importer function supports CSV and plain HTML tables. Both of these formats are fairly typical to understand, and you may even export CSV from Excel or an alternative spreadsheet editor. You will never miss hand-coding tables unless you have to include specific rows or columns within the HTML.

Customizing Styles

One final topic I always read about is customizing the table designs. This is obviously a big idea and will require some time fooling around in the CSS. On the website’s FAQ you will notice a series of CSS-related topics. These all relate to coloring the table rows, header rows, and alternating rows.

On the plugin page inside WP Admin there is a small textarea labeled Custom CSS. This is what you want to edit for recoloring tables or adding new IDs and classes. These CSS styles pertain directly towards the tables you enter on any WP post. Additionally you may consider editing styles in the plugin when first getting started, then porting them over into your own stylesheet. This will keep your codes a lot more organized and much easier to edit in the future.

Closing

It is true that HTML tables are not as popular as they used to be. This doesn’t imply that they serve no purpose, but that other HTML5 elements have come along as a better replacement. Nowadays tables are used solely to build actual content tables, and I hope this plugin may be of assistance to those who still need them. Feel free to check out the TablePress official website and dig through their FAQ for more solutions.

About Jake Rocheleau

Jake is a freelance writer and web developer. He writes articles for numerous blogs on freelancing, Wordpress, CSS3, and jQuery. You can find him all throughout Google and follow his tweets @jakerocheleau. Connect with Jake on Google +