Collapsible rows on front-end

Data Product Generator provides you the feature to create a tables  with collapsible rows on front-end.

You have an option to make certain rows collapsible, so that when visitors arrive at a page with a table, they see data table with “table of contents”. If to click on a category, that category expands to show all the rows associated with it. You are able to select which row to make the main one, and which rows to be associated.

If you add collapsed rows, then the first row of the selected rows becomes the “main” row. It is always visible and a “+” sign appears on the left. The other selected rows under it are collapsed by default, and when you click on the “+” – the collapsed rows unfold.

In addition, you can use not only hidden fields, but the tooltips for cells: convert the cell content into icon with tooltip.  Also, the search option is available for collapsible rows of data tables, making navigation much more convenient for users.

ID	Customer	Address	City	Phone
10220	David Domingos	Grand Via, 10	Madrid, Spain	034-255-44-12
	Order ID	Order Date	Shipped on	City
	2231001	04/10/17	05/10/17	Madrid
	Track №	PE2035514sp	ADD 07/10/17
13001	Monica Taren	Walden st. 103/10	London, UK	44-363-778-15
	Order ID	Order Date	Shipped on	City
	2450035	07/10/17	09/10/17	London
	Track №	PE2096542uk	ADD 11/10/17	2 days Premium delivery
18244	Luce Baren	Wellington st. 10/2f	Leeds, UK	44-544-364-10
	Order ID	Order Date	Shipped on	City
	2450036	07/10/17	08/10/17	Leeds
	Track №	PE2096546uk	ADD 19/10/17	Free delivery
22654	Scott Numm	Road st. 225/36a	Batley	044-169-477-73
	Order ID	Order Date	Shipped on	City
	2231008	08/10/17	09/10/17	Batley
	Track №	PE2037776uk	ADD 11/10/17	2 days Premium delivery

1. On the left navigation menu click “Add new table”.
2. Enter the name of data table and choose the number of rows and columns.
3. Click “OK” button.
4. Open “Editor” tab in the table parameters.
5. Add data to the WordPress table.
6. Select row and check this icon. First collapsible row become the “main” row with control button. Other collapsible rows will be hidden by default – user might show / hide them by pressing on control button of “main” row.
7. To convert the cell content into icon with tooltip, select the cell and check the icon. 
8. To enable the searching feature for hidden fields, move to Settings, Feature Tab and check the necessary option.  When a search term is entered, the collapsed rows would automatically expand to show the rows that contain keywords related to that search term.

Create and manage your data tables without any efforts using WordPress Data Table Generator.

Data Table by Supsystic is perfectly capable to extend table functionality to your WordPress site. Take a closer look at all Data Table Examples.