Showcase products with WooCommerce catalog mode
Whether you're looking for a WooCommerce catalog mode plugin that displays products without purchase options, or lists them in a catalog-style format, we've got you covered. In this complete guide, I'll show you how to create both types of WooCommerce product catalog.
The phrase "WooCommerce catalog mode" can be a bit confusing. That's because people use it to refer to different things:
- Catalog mode definition 1: Showing products in an online store without ecommerce functionality - either globally or so that certain user groups can view but not purchase.
- Catalog mode definition 2: Displaying products in a structured table-based layout which replicates traditional printed product catalogs.
Whichever type of WooCommerce product catalog you want to create, I'll show you how to do it.
We'll use the YITH WooCommerce Catalog Mode plugin to achieve definition 1; and WooCommerce Product Table for definition 2. You can either use them alone, or together if you want to list products in a structured table with purchasing disabled. Either way, you can easily put your store in catalog mode without writing any custom PHP or CSS.
Option 1: Put WooCommerce in catalog mode with purchasing disabled
This definition of catalog mode involves creating a WooCommerce store in which products are available for everyone to view, but not everyone can purchase them. You might disable purchasing for all users, or guest users without an account.
For example, many WooCommerce wholesale-only stores like public users to be able to browse their full product catalog, but only approved wholesalers can purchase. Alternatively, you might want to disable online ordering if customers can only buy from you in person or over the phone.
Next, I'll tell you about a choice of 2 excellent plugins which you can use to put WooCommerce into catalog-only mode.
WooCommerce Wholesale Pro
If you're running a wholesale store, then WooCommerce Wholesale Pro has everything you need. It has a 'Hide Price Until Login' feature which puts the store into catalog mode for all logged out users. When they log into their account, the prices become visible and people can purchase the products.
This is how to set it up:
- Purchase and install WooCommerce Wholesale Pro on your WordPress site.
- Go to WooCommerce → Settings → Wholesale.
- Enable the 'Hide prices until login' checkbox.
When wholesale users log into their account, they will see the products with prices and add to cart buttons as usual. Everyone else will see the products listed without prices or buy buttons. You can optionally display a notice which non-wholesale users will see, like this:
Further reading: Complete guide to hiding prices until login in WooCommerce.
YITH WooCommerce Catalog Mode
For non-wholesale stores, the YITH WooCommerce Catalog Mode plugin offers an excellent way to put stores in catalog mode.
It disables the ability for some or all of your customers to order from your WooCommerce store. The products are listed in catalog-only format, without the usual ecommerce functions.
The free plugin is perfect for testing out the waters. The premium version has lots of extra features. For example, it lets you enable catalog mode for users without an account only:
This is how to set up the premium version:
- Purchase and install YITH WooCommerce Catalog Mode.
- Head over to YITH → Catalog Mode in the WordPress admin dashboard.
- From the Settings tab, configure the following plugin settings:
- Make sure the checkbox next to Enable YITH WooCommerce Catalog Mode is ticked.
- Tick the checkbox next to the Hide in product detail page option.
- Tick the checkbox next to the Hide in other shop pages option.
- Optionally, you can choose to tick the checkbox next to the Hide and disable “Cart” page, “Checkout” page and all “Add to Cart” buttons This essentially lets you remove e-commerce features (i.e. cart and checkout pages) from your WooCommerce store.
Customers can see your WooCommerce products listed in catalog mode, without an option to buy. Once they click on a product, they will be redirected to the single product page. Alternatively, you can choose to redirect them to a custom URL.
The YITH catalog mode plugin removes add to cart buttons and prices from single product pages. This means customers won’t be able to add products to cart from the product table or from the single product page. However, they can view all product details from individual product pages. Of course, it also disables the cart and checkout pages.
Option 2: Create an interactive catalog with WooCommerce Product Table
Now, we get to the second definition of "WooCommerce catalog mode". This refers to displaying your products in a structured catalog layout, similar to a printed product catalog. We'll do this using the WooCommerce Product Table plugin.
WooCommerce Product Table is incredibly flexible. You can choose what product data to display, change the sort order, and much more. You can list products in a fully functional catalog-style order form like this:
Alternatively, you can list products without prices, add to cart buttons or links to the single product page like this:
Either way, this type of WooCommerce catalog plugin is ideal for creating a 1-page view listing some or all of your products. It makes it easy for customers to sort products and find what they're looking for.
A catalog layout displays products in a neater and more compact way to the default Woo store layout. This makes it possible to display more products per page, so customers can view them all together. It's perfect if you need a larger WC product catalog table, for example if 100's or 1,000's of products.
This type of product catalog layout has many possible uses, such as:
- WooCommerce order form - Your product catalog can include Add to Cart buttons or tick boxes to add multiple products to the cart. This lets it double as a fully functional order form for WooCommerce. Or you can hide the add to cart facility to create a read-only WooCommerce catalog.
- WooCommerce restaurant food ordering system - A restaurant or takeaway business can use the catalog plugin to let people view menus and order food online.
- Product directory - A product catalog can also function as a complete WooCommerce directory, with large numbers of products listed in an easy-to-find format.
- WooCommerce wholesale - Use it with the WooCommerce Wholesale Pro plugin to list all your wholesale products in a structured catalog layout to help trade users quickly find and order their products.
1. Setting up a product catalog table
Next, I'll show you how to list products in a table-based catalog. This is all about the layout, and doesn't affect whether or not people can purchase your products. (However, you can do this by choosing not to include an add to cart column in the table and by disabling the links to the product page.)
Watch this video about how to add a catalog-style table to your site, or read the instructions below:
- Purchase and install WooCommerce Product Table.
- Go to Products → Product Tables → Add New to launch the table builder.
- On the first page, choose whether you want to enable the product catalog view for your main shop pages, or add the catalog manually to another page.
- You can then use page 2 to either select which shop pages to display the catalog on; or to select which products to include in the catalog.
2. Customizing the catalog display
The next step of the product table builder lets you choose which product data to include in the catalog. Add columns as needed:
If you want your products to be purchasable from the catalog page, then include an Add to Cart column.
You can also edit each column name. Disable the 'Show column heading' toggle to prevent people from clicking through to single product pages. This is a good idea if you're using WooCommerce Product Table as a read-only catalog, as single product pages contain 'Buy' buttons. (Tip: If you want to use catalog-only mode and single product pages, then use WooCommerce Product Table together with YITH WooCommerce Catalog Mode. This disables the add to cart buttons from the single product page, too.)
3. Adding search and filter
The 'Search & sort' step of the table builder lets you add filters which appear above the WooCommerce product catalog. Add filters if you'll be displaying lots of products on the same page of the catalog:
Tip: The product catalog plugin also supports all the WooCommerce filter widgets. These include a widget to show the active filters, a layered nav filter listing product attributes, a price slider and ratings filter:
4. Add the WooCommerce product catalog to a page
Ignore this step if you already enabled the product catalog on your main shop pages.
Now, go to the page where you want to display the WooCommerce product catalog. Add a 'Product Table' block. Or, if you're not using the WordPress block editor, then get a shortcode from Products → Product Tables and insert that instead.
Publish the page and click View Page to see your WooCommerce catalog table. You'll see a dynamic catalog listing all your WooCommerce products.
Example without online purchasing:
Example with online purchasing:
Advanced catalog features
Role-based pricing
Lots of stores that use catalog mode like to charge different prices to different types of user. Wholesale stores can use the WooCommerce Wholesale Pro plugin for this, which we discussed earlier. Alternatively, other types of store might prefer the WooCommerce Discount Manager plugin. This provides a wide range of discounts and deals which you can create for specific user roles only.
Further reading: WooCommerce role-based pricing: Everything you need to know.
Adding inquiry forms or "Request a Quote" buttons
Other stores that use catalog mode need a way for customers to request a quote. That way, they can disable purchasing while allowing customers to request pricing and then order later.
To learn how to do this, read our tutorial about WooCommerce request a quote plugins.
Create a WooCommerce PDF catalog
Before we finish, I should mention that there's actually a third definition of WooCommerce catalog mode. It involves creating a WooCommerce PDF catalog, which lists downloadable PDF documents on the product page.
This is a different type of product catalog because it involves listing PDF's in a catalog, instead of listing actual products. You can easily do this by installing the Document Library Pro plugin. Upload your PDF's, categorize or tag them based on which products you'll display them on, and then insert the appropriate WooCommerce PDF catalog into the product description.
To make the best use of space on the product page, it's best to add the PDF library to a dedicated 'Downloads' tab on the product page. You can do this with the WooCommerce Product Tabs plugin, just like we did in this screenshot:
Next steps: Get started with WooCommerce catalog mode
In this tutorial, I have shown you 2 ways to create a WooCommerce product catalog:
- Use either WooCommerce Wholesale Pro's 'Hide Price Until Login' feature or YITH WooCommerce Catalog Mode to put your store in catalog mode with purchasing disabled.
- Alternatively (or as well!), use WooCommerce Product Table to list products in a structured table, either with or without online purchasing.
Whichever type of catalog mode you're adding to WooCommerce, follow the above instructions to get up and running in no time 🚀
17 Comments
Hi, With using the product table plugin, will the table format apply site wide. Or for different category of products can you have different views. eg some categories you might want as catalogue only, and other categories you might have as the full able to purchase with add to cart.
Also, what additional plugin do you recommend to run woocommerce as an "add to quote" style site, where the cart when complete then gets emailed so you can price it up.
By default, the product table will only appear on pages where you add the shortcode that comes with the plugin. If you prefer, you can use these instructions to automatically use the table layout throughout your store.
If you want to use the table format on some categories and not others, then the easiest way is to create normal pages for the pages that you want to add tables to. To stop people from using the actual category pages for these categories, you can use the free 'Redirection' plugin to redirect the actual category pages to the page containing the product table for this category.
Alternatively, you could hire a developer to modify the sample category page template that we provided in the link above so that it only uses the table format on specific categories.
YITH have provided some code snippets that allow you to use their Add to Quote button with the product table. We've provided a tutorial about this here.
Is it possible to have a column with image "alt" (alternative) text? thanks
Hi Frank, unfortunately this isn't possible because the image alt tag is stored against the 'attachment' post type in the Media Library rather than the WooCommerce product, and WooCommerce Product Table only displays information that is directly attached to the product. Instead, I recommend that you create a custom field (e.g. using the free Advanced Custom Fields plugin), manually add the information that you wish to display in the table, and include this as a column in the table instead.
Is it possible to add Pop up link to description and also to custom fields ?
Because my description text is too long and I want to be in Pop up,
Also can I add and custom fields with text or some download section ?
Best regards,
Hi, the plugin doesn't have an option to add popup links. However, you can achieve this by adding the code for the popup to your description or custom field. If you add shortcodes="true" to the WooCommerce Product Table shortcode ( e.g. [product_table shortcodes="true"] ), then the product table will correctly render the HTML so your popup will work.
Yes, you can add anything you like to a custom field - for example a link to download a document. If you add the HTML for the link then this will appear correctly in the table. See this link for instructions.