Can I add product tables within tabs, toggles or accordions?
The WooCommerce Product Table plugin works beautifully within unusual layouts such as tabs, toggles or expandable accordions.
- You might want to create an alphabetical product listing with a separate tab for each letter of the alphabet. When someone clicks on a letter, they see products tagged with that letter.
- Maybe you’re creating a restaurant order system and want to add an expandable/collapsible accordion or toggle for each section of your menu. Users can click on ‘Starters’ to open up the ‘Starters’ section listing the products from that category, and so on.
How to create tabs, toggles or accordions
The vertical or horizontal tabs, toggles and accordions need to come from your theme or another plugin – they’re not part of WooCommerce Product Table.
The leading all-purpose WordPress themes such as Avada and Divi come with built-in styles for tabs, accordions, etc. If your theme comes with these, then we recommend using them because they will match the overall design of your site.
If your theme doesn’t come with these styles, then we recommend the Elementor page builder plugin. Our customers tell us that it works beautifully with WooCommerce Product Table.
How to add your WooCommerce product tables
Add a separate product table shortcode for each tab, toggle or accordion. Use the options described on this page to set each table to list different products, e.g. based on their category, tag, or a custom field or taxonomy term.