You can boost the customer shopping experience by displaying all the products in a list on your WooCommerce store.
By displaying the products in a list the users will be able to view and add multiple products to the cart from a single page.
So in today’s article, I’ll be explaining how to display all WooCommerce products in a list view with the help of the WooCommerce Product Table.
Preview
On This Page
How to List all WooCommerce Products?
Here, I’ll show you how to list all WooCommerce products. I’ll explain this in a few simple and easy-to-follow steps with the help of the WooCommerce Product Table plugin.
Follow the following steps to list all products.
1. Install and Activate the WooCommerce Product Table Plugin
Note: You can skip this step if you have already installed and activated the WooCommerce Product Table plugin.
To install the WooCommerce Product Table plugin, you will need to install the Woosuite Core plugin and activate it with the help of a license key. We have created a Quick Start Guide for you to figure out how to install and activate the WooCommerce Product Table plugin.
2. Create New Table
Once you have installed and activated the plugin, Now to display the products in a list view on the WooCommerce shop page, follow the given steps:
1. Add New Table
Navigate to Woosuite » Product Table from your WordPress dashboard and click on the Add New Table button.
Once you click it, you’ll see a screen where you can create and control the different table settings.
2. Order Form Display
Give an internal name to the table.
3. Order Form Information
Now expand the Order Form Information by clicking on the (▾)
Now, specify the columns you want to add to the table. To add a column just drag the column from the Available columns section and drop it in the selected columns sections.
You can also adjust the other settings like the image size and description length. I am keeping them as the default.
4. Bulk Add to Cart
Now expand the Bulk Add to Cart by clicking on the (▾)
4.1. Select the Add to Cart Button Display
Now select how you want to display the individual add to cart button in the table. You can display it in three ways: ‘Buttons Only’, ‘Checkbox Only’, and ‘Buttons and Checkbox’. You can select any of them you like but I am selecting the ‘Buttons and Checkbox’.
4.2. Enable the Quantity Selectors
Enable the quantity selectors in the add to cart columns.
4.3. Select the Variations Display
Now select how you want to display the variations in the table. You’ll get three options in the dropdown: ‘Link to Product Page’, ‘Dropdown list in the add to cart column’, and ‘Separate rows in the table(one per variation)’.
For this tutorial, I am selecting the ‘Dropdown list in the add to cart column’.
4.4. Select The Position Of The Bulk Add To Cart Button
Finally, select the position of the bulk add to cart button. You’ll get three options in the dropdown: ‘Above table’, ‘Below table’, and ‘Above and Below table’. For this tutorial, I am selecting the ‘Above table’.
5. Order Form Controls
Now expand the Order Form Controls by clicking on the (▾)
Here, you’ll get a few options.
5.1. Sort Products
You can select how you want to sort the products in the table and add product conditions to filter the products by categories, tags, and attributes. I have kept the sort order as default and haven’t added any product conditions for this tutorial.
5.2. Product Filters
In the dropdown you’ll get three options: ‘Disabled’, ‘Show based on columns in the table’, and ‘custom’. For this tutorial, I have chosen ‘Show based on columns in the table’.
5.3. Page Length
Select the position of the 'Show [x] products' dropdown list. I have selected ‘Above table’.
5.4. Search Box
Select the position of the search box. As we are displaying the table on the shop page so I have enabled its position ‘Above table’.
5.5. Product Totals
Now select the position of the product totals, e.g. 'Showing 1 to 5 of 10 products'. I have selected ‘Above table’.
5.6. Pagination Buttons
Select the position of pagination buttons as ‘Above table’ from the dropdown.
5.7. Pagination Type
Now, you need to select the type of the pagination buttons from the dropdown. I have selected the ‘Prev/Next + Numbers’.
5.8. Reset Button
Finally, enable the reset button.
6. Save Changes
Once you have created the table, now click on the Save Changes button on the top to save the changes.
3. Set Woosuite Product Table As Default Shop/Category Page Layout
To set the Woosuite product table as the default shop page layout, go back to the General Settings of the plugin by clicking on the back arrow at the top.
Now select the table you just created, from the Shop Pages and Product Category dropdown and click on the Save Changes button to save the changes.
4. Final Results
Now if you visit the Shop Page or the Product categories pages, you’ll see all the products are being displayed in a list view.
Wrapping Up
Now you know the method to display the WooCommerce products in a list view.
By following this method you can boost the visibility of all the products and make the buying experience more enjoyable for clients. Customers will be able to view all of your products in a table format without having to navigate through a single product page.
If you have any queries, you can ask them in the comments or contact our customer support. Our dedicated customer support team typically replies within 48 hours.
To get started, download the WoCommerce Product Table plugin today!