Do you need to present data on your site, calculate formulas, share a spreadsheet, or organize a lot of information for your visitors? If so, your site can benefit from using HTML tables to present the information in an easy-to-read format. In our TablePress review, you’ll find out how to create tables in WordPress to show off your data.
When Should You Use HTML Tables?
In the early days of the web, almost every website was formatted using tables. Headers took up one full row, the main body and sidebar were in two separate columns, and the footer was the last full row in the table.
But with the development of CSS and semantic HTML, table markup began to be used for its original purpose: to present data.
Tables can be used to format data that’s a bit more complicated than a list. You might use tables to format:
- product comparisons
- plans and pricing information
- accounting and financial information
- info on people, such as members of a team or organization
- formulas and calculations
- and more
Using tables instead of just listing the data makes it easier for your visitors to read and understand it.
Create Tables With TablePress, No Code Necessary
Coding a table by hand can be a slow and error-prone process.
Looking at code like
<colspan> makes it difficult to visualize the end result as you’re designing your table.
And HTML can be very unforgiving. Forget to end a row, and the rest of your table could be thrown off. Finding and fixing the error can take up even more time.
That’s why using a plugin like TablePress is a good idea. TablePress allows you to build tables from the WordPress dashboard without having to code. It can save you a lot of time and effort in creating and updating your tables.
Add Anything to Your Tables
TablePress allows you to enter more than just text into your tables. You can also use HTML to add images, links, special formatting, or anything else you need.
It even lets you use mathematical functions and formulas that reference other table cells, just like in a spreadsheet.
How to Create a Table With TablePress
After installing and activating the plugin, you can navigate to TablePress » Add New Table to get started.
Enter the table name, a description (optional), and the number and rows and columns you want to start with.
(You can always add or remove rows or columns when editing.)
Click Add Table to continue.
Now you can add content to your table cells. Just drag and drop them to rearrange the rows. Don’t forget that the first row will be your header row, so add your labels there.
Below that, you can add or delete rows or columns, or add links or images.
Under Table Options, you can choose options such as including a table header or footer, alternating row colors, highlighting rows on mouseover, etc.
Click Save Changes when you’ve completed your table.
Displaying Your New Table
To display your table, just use the shortcode displayed at the top of the page. The shortcode for your first table should be [table id=1 /].
You can also get your shortcode by navigating to TablePress » All Tables and clicking the Show Shortcode link beneath the table name. A pop-up will display your shortcode in a form field so you can copy it.
There are a number of addons available for TablePress that add new functions for even more advanced tables.
All addons are available for download from the official TablePress website, though a few are marked “Premium” and have a suggested donation amount.
- Responsive Tables: make your tables look good on any size screen
- Automatic URL conversion: bare URLs in table cells are automatically linked
- PHP code in table cells: PHP code in your table will be parsed and executed
- Row Filtering: pre-filter the data that displays in your table using shortcode attributes
- Single Cell Content Shortcode: retrieve the value of a single table cell using a shortcode
- Table Row Order: show rows in random, reversed, or sorted order each time
- DataTables Sorting plugins: correctly sort certain data types such as currency values
- DataTables Buttons: add special buttons to your table such as “Copy to Clipboard,” “Save to PDF,” etc.
- DataTables FixedHeader: fix the header row of a table to the top of the screen when scrolling
- DataTables FixedColumns: fix columns of wide tables to the sides of the table
- Pagination Length Change “All” Entry: add an “All” entry to the Pagination Length Change dropdown
- Change DataTables strings: change displayed strings of the features like Search and Pagination
- DataTables Column Filter: add filtering boxes to the table foot row
- DataTables ColumnFilterWidgets: add filtering dropdown boxes above the table
- DataTables Counter Column: add a “counter row” for the row number to the table
- Change the [table] Shortcode: customize the shortcode used to display your tables
- Change the Admin Menu Name: customize the dashboard menu label for TablePress
- Larger Edit Input fields: increases the size of all input fields for editing tables
- Automatic Periodic Table Import: automatically import data from a CSV file
Support and Documentation
TablePress is developed by German PhD student Tobias Bäthge in his spare time. Basic information, tutorials, and answers to frequently asked questions are provided on his website.
The developer is very active in the support forums and attempts to help everyone who posts there. Most support threads are resolved quickly, and the plugin is very highly rated by users.
If you need to display any kind of data more complicated than a simple list, we recommend you give TablePress a try.
We give TablePress 5 out of 5 stars. Here is the breakdown of our review scores:
If you liked this article, then please consider following us on Twitter and Facebook. If you have any questions, please let us know by leaving a comment below.