Create Responsive and Beautiful Tables in WordPress with TablePress

Hello guys, in this video I will explain how to use the TablePress plugin, which is used to make tables in our WordPress Post.

We can download this free plugin from the same WordPress repository

In addition, TablePress has very good extensions that are also free and will help us a lot. One such extension is Responsive Tables, which makes our tables Responsive. This extension is Premium but you can download it for free, they only ask us to donate $9 for all the work they do to maintain this plugin, but donating is not mandatory.

Tables typically have this form:

But if we make them Responsive it will turn the header into a column, like this:

This way, when you see it on an iphone or any device, the table will adapt and you will always see it well.

Let's see how Table Press is configured:

The first thing you have to do is download the TablePress Plugin and its extension.

Once installed, I go to TablePress and create table. We put a name to our table, if we want we can also add a description, and we choose the number of rows and columns that our table will have:

We click Add Table and now you could put the information. For my example I would have:

Underneath it gives me the option to enhance the content, if I wanted to edit a cell.

I click Advanced Editor, it asks me to select the cell I want to edit, you select it and I could put Bold, underlined, etc….

If I would like to add more rows or columns to my table, I can do so in the same section by clicking:

Once I finish editing my table, I click save changes and at the top it shows me the identification code. If I wanted to see my table inside a Post, I would have to paste this code.

I open an input and paste the code, the result would be the following:

But we can realize that this is not the Responsive format

If I wanted to convert my table, I must go to the documentation section and copy the code that tells me what to add: responsive=”all”

Now if I do this, you can see that my header was converted from a row to a column.

And you could see it on any mobile device without losing the information, you would simply scroll horizontally to see all the cells you want.

As we can see, this is a very cool way to make tables.

I hope it has been as useful to you as it has been to me.

If you are not subscribed to the Premium Zone you can give sign up for €10/month here

BYE NOW!