WooCommerce – How to Show Categories on the Shop Page (with video)

how categories on the Shop Page

Last updated - July 12, 2024

Nobody likes clutter when they are shopping! Proper organization and streamlining increase user engagement on ecommerce sites. Properly showing categories on the shop page is essential for optimizing and setting up your WooCommerce site. The intuitive navigation is to have products in systematic order, which will help customers easily locate the product they have been looking for. Not only that, having an SEO-aligned website will help get more visibility, and for that categories need to be laid out properly.

We have already read about how categories help an ecommerce website. If you haven’t read it, click here.

In this blog, we will learn how WooCommerce, by default, allows its users to categorize their website’s shop page and alternative methods that help with the same. 

Well, let’s not waste time and get down to business.

Step-by-Step Guide to Show Categories on Shop Page using WooCommerce

When you start with your ecommerce store, it will be ideal to start off using the default customization that WooCommerce provides.

Shop Page Display

Go to WP Admin Dashboard > Appearance > Customize

categories on the shop page

In the next window, click on “WooCommerce” and then on “Product Catalog”.

product catalog

Now, the Product Catalog sidebar will show “Shop Page Display” which will help you decide how the shop page should look like.

  • When you click on “Show Products”, only the products will display.
show products
  • When you click on “Show Categories”, it will show only the categories you have categorized your products into.

When dealing with numerous products and various categories, it’s important to prioritize easy navigation, and showing all products may not be ideal. If you prefer, you can go for the second option, which will only show categories. By clicking on a specific category, users can see a list of all the products within that category.

show categories
  • When you click on “Show categories and products”, both the categories and products will be on display.

Now, if you want to give the best of both worlds to your customers, you can choose the third option. Here, both products and categories will be displayed. Those who want to navigate to a product through categories can go to the category page. And those who prefer to go directly to the product page can do so.

show categories and products

Category page display

WooCommerce also provides options to determine the layout of category pages as well. If you display the categories on the shop page, and a customer clicks the category name and lands on the category page. How will you control the display on the category page? The next setting is for this.

Again, you have three options – you can show products, subcategories, or both products and subcategories.

You will find three options to modify the category page display as well.

Let’s see each. 

If you select products, all the products in a category will be displayed on the category page.

On the category page, you will see only products if you choose the first option.

subcategories

By selecting subcategories, you can display all the subcategories in that category. Customers can click a sub-category to see products inside that. 

Instead of products, display all the subcategories on the category page.

subcategories1

The third option is to display both subcategories and products on the category page. Based on what is suitable for your store, you can choose.

subcategories and products

The category page can display both subcategories and products together.

The Product Catalog customizer also gives you the option to change the default product sorting, where you can choose to display products based on popularity, average rating, etc.

popularity

Users can rearrange the way products are displayed on the shop page using the options provided by WooCommerce.

You can also modify the number of products displayed in a row and the number of rows displayed on your Shop page.

products per row

You can change the number of products in a row and the number of rows displayed on the Shop page.

How to use shortcodes for setting up categories?

To show categories on the Shop page using shortcodes, you can simply go to the edit page and add in a block called “shortcodes”. The shortcode is:

[ product_categories ]

To make it as customizable as possible, you can also shortcodes for adding additional attributes:

  1. For showing categories on the shop page by category ID in ascending order:

[ product_categories orderby = “id” order = “ASC” ]

  1. To show a specific category on the shop page:

There’s a requirement for the slug for the specific category which you can get from the backend.

The shortcode is as follows:

[ product category category=”slug” ]

  1. To display products by popularity on the shop page

Most popular products can help catch the customer’s eye easily.

The shortcode is as follows:

[ products orderby=”popularity” ]

Plugins that help in adding categories on the Shop page

  1. TaxoPress
  2. Category Order and Taxonomy Terms Order
  3. WooCommerce SEO & Categories
  4. YITH WooCommerce Category Accordion

Final Wrap

The key to achieving optimal business results from your ecommerce site lies in maintaining well-structured pages, particularly for the shop page. By including categories on the shop page, you strategically ensure that your customers do not get confused while browsing, ultimately enhancing their shopping experience. 

FAQs

  1. How do I show only categories on my shop page?

To show only categories on your WooCommerce shop page, follow these steps:

  • Navigate to the WordPress dashboard.
  • Go to Appearance > Customize > WooCommerce > Product Catalog.
  • In the “Shop page display” dropdown, select “Show categories”.
  • Save your changes.
  1. Why are my categories not displaying on the shop page?

Double-check if the settings are right, and whether the products are entered correctly with categories and sub-categories. See if any plugins are restricting you from showcasing the categories on the shop page. 

  1. Can I display subcategories on the shop page?

Yes, you can display sub-categories on the shop page.

  1. What are the different ways in which you can customize categories on the shop page?

You can use WooCommerce Default Settings, Plugins, and even shortcodes. Some of the plugins are TaxoPress, YITH WooCommerce Category Accordion, etc.

Further reading

5 COMMENTS

  1. Thank you for sharing. When I choose “Show Categories” under “Shop page display.” However, in my shop page I still see only the products. Do I need to modify the shop page somehow?

    I appreciate your time.

    • It could be an issue with the theme you are using. Can you try switching to another theme and check.

  2. Thanks for the article. Helpful when getting started with WooCommerce.

  3. This was super helpful. Thank you! How do I change the pictures of the categories?

Comments are closed.