TablePress Plugin Tutorial for WordPress Users

In our previous article, we have explained how to add tables in WordPress site using different methods. Gutenberg block editor has an in-built Table block making the use of additional plugin obsolete. However, TablePress is one of the plugins allow users to add attractive tables on WordPress site easily. You can use Microsoft Excel like interface in your admin panel or directly import an Excel sheet to create a table. In this article, let us explore the features and how to use TablePress plugin.

Why TablePress Plugin?

Navigate to “Plugins > Add New Plugin” option in WordPress admin panel and search for the keyword “Table”. You will find thousands of plugins for creating different type of tables, find TablePress from the list to install and activate the plugin.

• It is a freemium plugin by author Tobias Bäthge. You can install the free version from WordPress plugins section and need to purchase a premium plan from the developer’s website. Earlier, the developer used to offer separate extensions which are now part of the premium version.
• 700K+ active installs with 5 star rating from almost 4.5K users can’t be a wrong judgement.
• Decent documentation and very good support on the forum.
• Create uniform looking tables throughout the site and also customize any particular table’s look using custom CSS.

Features of TablePress Plugin

The free plugin version has the following features which is sufficient to create tables for most of general purposes:

• Tables can be created and embedded on any pages on your site as a shortcode or using a Gutenberg block.
• Import tables from Microsoft Excel in XLS, XLSX and CSV formats. Also, importing by manual copy paste and from JSON/HTML format is possible.
• Tables can be exported in CSV, JSON and HTML formats.
• Individual tables can be customized with custom CSS.
• Complex data tables with search box, pagination and filtering can be created easily.

You have Pro and Max premium plans available for $89 and $189 respectively for a single site license. These plans offer features like responsive tables, fixed row / column, custom action buttons like download to PDF, column filtering, etc.

How to Use TablePress Plugin?

After activating the plugin, you can find an admin menu is created by the plugin as shown below. You can change the position of the TablePress menu under “Plugin Options” section.

The plugin has the following sections:

• All Tables – shows a list of all created tables.
• Add New – allows creating a new table.
• Import – offers various options for importing single and multiple tables.
• Export – offers various options for exporting single and multiple tables.
• Plugin Options – individual tables can be customized with CSS under this section.
• About – shows the details about the plugin and other details.

Creating Table in TablePress

Navigate to “Add New” tab where you can enter basic details like table name, short description and choose number of columns and rows to create a table.

The next screen will show you plenty of options with multiple sections. You can easily become familiar with these options by creating one or two sample tables.

Table Information Section

Here you can view the basic details you had entered on the creation screen along with the shortcode for your table.

Table Content

Here is where you need to enter the actual content of your table in rows and columns similar to Microsoft Excel. The first row is by default considered as a table header which you can change it under the “Table Options” section.

Table Manipulation

This section offers the following features:

• Add rows and columns to your table.
• Hide, show, delete, duplicate and insert rows and columns.

• Select a cell and then click on the “Insert Link” button to open the default WordPress insert link pop-up. You can also directly add links using HTML anchor tags.
• Similar to links, click on the “Insert Image” button to insert images from WordPress Media Library. You can also directly add images using HTML img tag.
• The advanced editor allows you to add formatted content using simple editor.

• Use rowspan and colspan options to combine cells on rows and columns. Note that rowspan and colspan attributes can’t be used on advanced data tables with sorting feature.

Table Options

Here you can define the header, footer, different colors for alternate rows and highlight row on hover. You can also display the table name and description above or below the table.

Add extra CSS classes to customize the appearance of the table, you need to use these CSS classes at theme level and define styles.

Table Features for Site Visitors (DataTables)

When you have enabled the first row of the table as header under “Table Options” section, then the table can be converted to a data table by enabling the features under this section.

• Sorting based on the any of the column just by clicking on the column header.
• Searching / Filtering – allows to show a search box on top right corner of the table and users can filter the results by entering a keyword. This is a very useful feature especially when you have many rows and the content is not visible due to pagination.
• Pagination – enable pagination to show “previous / next” pagination links at bottom right corner of the table. You can also allow the user to filter and view particular number of rows by enabling “Pagination Length Change” option.
• Enable horizontal scrolling if you have many columns in the table and add custom commands if you know how to use advanced data tables.

Once you have completed the options, preview the table and save the changes. You can also delete, copy and export the table from the same screen.

Inserting Table on a Post or Page

Each TablePress table has a unique id which can be seen on the “Table Information” section. You can use this as a shortcode in Gutenberg editor or insert the table code on Classic editor using TablePress icon. There is also a Gutenberg block available to select and insert a table from the list.

Viewing All Tables

All the tables created with TablePress can be seen under “TablePress > All Tables” menu. You can carry out actions like copy, export and delete on individual tables as well as on bulk.

Importing Tables

Though creating a table is easy on the screen, it will be tedious task for large tables. In such scenarios, you can create tables using Excel spreadsheet in XLS, XLSX or CSV format and import it on your WordPress site under “Import” tab of TablePress plugin. It is also possible to import HTML, ODS and JSON formats. Navigate to “Import” tab to see the below options:

• Importing source can be from a file on your local computer, from a URL, from a file on a server or a manual input.
• Based on the source, either upload the file from your local computer or provide the required details.
• Choose whether to create a new table or modify or append an existing table. Choosing replace and append options will show a dropdown list of all existing tables from which you can select a table.
• Click on the “Import” button start uploading your data.

The plugin allows importing multiple tables as a zip file. For example, if you have five XLSX spreadsheet tables, put all files in a single folder and compress it in a zip format. Just upload the zip file to create five tables. Note that only the first sheet in Excel sheet will be imported as a table and remaining sheets will be ignored by the plugin.

Exporting Tables

Similar to importing, all existing tables can be exported to CSV, JSON or HTML format to your local computer. Also the plugin allows selecting multiple tables and exporting as a zip file.

The CSV and HTML formats only export the table content and JSON format includes the table options as well.

Customizing Tables in TablePress

Till now what we have seen are the default options and under “Plugin Options” tab  you can enter custom CSS to control either all tables uniformly or control individual table’s display.

Below are the selectors to define your style:

• .tablepress – all TablePress tables should have this class.
• .tablepress-id – used to style a specific table.
• .column-id – used to style the column of a table.
• .row-id – used to style the row of a table.

Below is an example table created with TablePress, let us assume the id as 3.

Heading 1	Heading 2	Heading 3	Heading 4
Cell 1	Cell 2	Cell 3	Cell 4
Cell 5	Cell 6	Cell 7	Cell 8

Here are some of the options for customizing the table and you need to add the CSS code in the text area under “Plugin Options > Custom CSS” and ensure to check the option “Load these “Custom CSS” commands to influence the table styling”.

Change the width of the second column to 200px:

.tablepress-id-3 .column-2 {
width: 200px;
}

Change background color of row 2 to red:

.tablepress-id-3 .row-2 td {
Background-color: red;
}

Change the color of alternative rows:

.tablepress-id-3 .odd td {
background-color: red;
}

.tablepress-id-3 .even td {
background-color: blue;
}

Change color of row on hover:

.tablepress-id-3 .row-hover tr:hover td {
background-color lightgrey;
}

General Issues

There are few basic issues we noticed while using the TablePress plugin:

• By default, tables are not responsive on mobile devices and you need a premium plan for this feature.
• Inserting tables on footer or sidebar of the site is not possible with Classic Editor. This can be addressed by using template tags with “$query” as string or array. For example, below is an example to get the table data for the table id=1:

<?php tablepress_print_table( array( 'id' => '1', 'use_datatables' => true, 'print_name' => false ) ); ?>

If you face any other specific issue on your site, refer the plugin’s WordPress forum page to see whether it was previously addressed and checkout the developer’s documentation before raising the support query. We noticed most of the issues have been addressed in one of these places.

Note: Inserting HTML tags in table cells are not supported, though you can use image tag, link tag, use advanced editor.

TablePress Premium Features

Though the basic needs can be satisfied with the free version of the plugin, you can get additional features by purchasing the premium Pro or Max plan. Below is the list of premium features and out of all features, we found “Responsive Tables” is the one you may need to make the tables viewable on mobile devices.

• Responsive tables with horizontal scroll, flip, stack, collapse and modal options.
• Fixed row(s) when scrolling vertically and fixed columns when scrolling horizontally.
• Custom pagination options.
• Set default layouts and colors.
• Add custom action buttons like print, PDF, CSV, etc.
• Highlight cell / row and column indexing.
• Additional filtering and searching options.
• Automatic table import and export.
• Fuzzy search with advanced loading.

You have 30 days money back guarantee and you will get one year free support and updates with the purchase.

TablePress SEO

The most important aspect of creating tables with TablePress plugin is the SEO as the tables are more search engine friendly. Below is an example of a Google search result showing the table content in more appealing manner with the total number of items:

Google shows the table in the search result if your page gets enough traffic for the keywords within the table content. Though the meta description of the page is not displayed in this case, we noticed the table view attracts more users than the simple text.

Summary of Pros and Cons of TablePress

WordPress offers Gutenberg table block and there are also many other plugins available for this purpose. Here is a summary of pros & cons of TablePress to help you make a decision on where to choose this plugin for your needs.