is tablepress responsive
We’d like to hear from you. What is your favorite method to make a table responsive?
There are several good plugins for creating responsive tables. With many of the plugins the tables are created separately from the page or post and then inserted using a shortcode. Some of these plugins let you manage your tables, reuse them, and import or export them, while others make your current HTML tables responsive.
A common use case is text in column 1 and images in column 2. In this case, you may find that the images are resized much smaller than you want. Here is an example:
- Create your TablePress table as usual.
- Create a separate new page (or erase the contents of an old page) that will act as a staging area for your images.
- On the new page with the Visual tab selected, click the “Add Media” button. This opens the add media dialog. Either select an existing image from your Media Library or click “Upload Files” and add the file you want.
- Using the form at the right side of the Insert Media window, add any metadata and/or link you wish.
- Click “Insert into page” which returns you to the staging page you created in step 2.
- Click on the “Text” tab and copy all the displayed HTML for the image.
- Switch to the TablePress editing window and paste the HTML.
- Click “Plug-in Options” under TablePress and enter the following in the “Custom CSS” text box:
- Go to “Tools > TablePress > Add New” menu and start creating a table and customize the options.
- Alternatively, go to “Import” tab and import a table from external data source. For example, you can simply upload your Excel sheet data to create table.
You can install and activate the TablePress plugin from your WordPress admin dashboard similar to any other plugin. However, the default TablePress tables are not responsive similar to Gutenberg tables. You need to install an extension to make the responsive tables.
The table rows are shown as columns, so that the table is more narrow and appears to have only one column. This will work nicely on small screens, but will require a lot of vertical scrolling in large tables.
[table responsive=flip responsive_breakpoint=”phone” /]
- Easily filter and sort data in the table
- Import/Export tables to use on another website
- Filter table using custom values
- Duplicate tables in a click
- Pagination for easy blending with your website design
- Easy configuration for getting started
- Easy integration with Google Sheets
- Easy integration with WooCommerce
- SEO friendly as the content can be picked by Google as a rich snippet
- Bordered table
- Multiple table colors and customizations
The main idea to use this plugin is to avoid instances like- text going out of the screen, text size too big to appear to the mobile screen, etc.