Web Tables

Here’s the 411 on tables in WordPress pages for product pricing, etc. I’m going to give you a few options for using tables on the site. Let me know which method works best for you and I can implement on your pages as required.

1. HTML

There is no built-in feature for using table in WordPress. The existing tables are built with HTML. If you open the Flatware page in the page editor  and view in Text mode, you can see the HTML code that makes up the table. It looks something like this:

<table width="400" cellpadding="5">
<tbody>
<tr bgcolor="#333333">
<td bgcolor="#333333" width="300"><span style="color: #ffffff;">Item</span></td>
<td><span style="color: #ffffff;"> Price </span></td>
</tr>
<tr>
<td>Dinner Fork</td>
<td>0.35</td>
</tr>
<tr bgcolor="#e5e5e5">
<td>Salad/Dessert Fork</td>
<td>0.35</td>
</tr>
</tbody>
</table>

If you know HTML, it’s a fairly simple process to change background and text colors or add new rows to the table, but that’s not a realistic option for most people. I created the HTML tables by saving data from an Excel spreadsheet as a CSV file, importing into Dreamweaver and styling, then pasting the resulting code into the WordPress page – it’s way easier than it sounds. If you’re not planning on changing your products/prices more than annually, I can easily create and insert new data for you and we can move on.

There are other options for tables in WordPress using plugins. I’ve installed two plugins on the site for your evaluation; Easy Tables and TablePress.

2. Easy Tables

Easy Tables uses an easy to learn/use shortcode to create simple tables. By entering the following code, you get the resulting table:

shortcode
[eztable width=”500″ colwidth=”400|100″] ITEM,PRICE
item one,$0.00
item two,$0.00
item three,$0.00
[/eztable]

I built a working sample page using Easy Tables for your further review HERE.

3. TablePress

TablePress is a much more full-featured plugin that allows you to create tables in the TablePress editor and add them to your pages using the TablePress button in your page editor. I have built a test table and inserted it below.

There is a sample page using TablePress HERE. Setup for TablePress forms can be accessed from the Dashboard menu.

I think inserting new HTML tables is the easiest solution, but it’s your call. Please let me know if you have any questions and how you would like to proceed.

TOP