Responsive Table For Mobile And Tablet
Time needed: 5 minutes.
In this tutorial, I will create a responsive table. In the mobile version, we will display only two columns. But we will display all information as a desktop version! How can we do that? let's see
- Add a blank column.
We will add two blank columns. Those columns are for mobile. First column keyword 'mobile_col_1' and second column keyword 'mobile_col_2'
- Active Columns For Mobile
From the 'DEVICEWISE COLUMN SETTING' section, click on the 'Mobile' tab and select the'mobile_col_1' and 'mobile_col_2' columns.
- Set mobile_col_1 column
Click and expand 'mobile_col_1'. Give the column a name ( I gave it the name "Image"). Select which columns you want to display in this column as inner items from the 'Select multiple inner items' section.
- Set mobile_col_2 column
Do exactly the same as in step 3.
All done. Now hit the Publish/Update table to save those changes. Note that you can follow the same steps for Tablet version.