Customizing Your Product Catalog

With store editing you can build exactly the shop page you want by editing your Product Catalog templates and customizing the layout and styles with blocks in the site editor. In this document we cover the templates and blocks included in WooCommerce for you to manage and cusotmize your shop’s catalog pages.

Beyond your main shop page, WooCommerce will display your catalog of products in different templates depending on the context. There are built-in templates to showcase your products by category, tag, or attribute. 

When you use a block theme, you can customize these different kinds of product archives to meet the distinct needs of your shop. You can also create distinct templates for specific attributes, categories, or tags. All in the no-code editor.

Templates

↑ Back to top

WooCommerce uses a number of included templates to manage the display of your products in your shop. Your theme may override or introduce theme-specific versions of these templates. No matter, you can edit them to fit your design needs. Learn how to access your site’s templates in our Templates overview.

Built-in Templates

↑ Back to top

By default, the display of your store’s product catalog is controlled in the following templates:

  • Product Catalog – controls the display of your main shop page, as set in WooCommerce > Settings > Products > General
  • Products by Category – controls the appearance of your shop’s product category archive pages.
  • Products by Tag – controls the appearance of your shop’s product tag archive pages.
  • Products by Attribute – controls the appearance of your shop’s product attribute archive pages.
  • Product Search Results – controls the appearance of your shop’s product search results pages.

Note: Since the different kinds of product archive pages (i.e. tags, categories, attributes) are controlled by different templates, it’s not possible to edit all of the product archive templates at once. However, if you’d like to replicate the same design across all product archive templates, you can customize one of the templates, save your design as a template part or pattern, and insert the template part or pattern in the other templates to quickly give them all the same look.

Product Catalog Blocks

↑ Back to top

The following WooCommerce blocks are central to displaying your catalog around your shop, and can be customized to meet a variety of designs and use-cases. There are several other product display blocks, however the majority of these are being deprecated in favor of the more robust and customizable Product Collection Block.

Product Collection Block 

This multi-purpose block has a number of pre-built collections to choose from for common use cases, or you can make a custom collection to show exactly the products you want, how you want. Read more about the Product Collection block.

Product Filter Blocks 

There are a number of filtering options to use on your product catalog pages, whether you want your customers to filter by attribute, rating, price, or stock status. Read more about Product Filter blocks.

Patterns 

To help you get started more quickly, there are a variety of pre-built patterns that you can select to display your product collections in different configurations of grids, rows, etc. Learn more about patterns, including how to make your own reusable patterns, in our introduction to store editing patterns.

How to: Create Custom Product Catalog Templates for Specific Product Types

↑ Back to top

In addition to customizing the default templates listed above, what if you want to create a special template that’s used for a specific category of products? With store editing, it’s easy!

To create a custom template:

  1. Head to the site editor at Appearance > Editor.
  2. Click “Templates” then the plus sign to add a new template.
  3. Choose the “Product Category” or “Product Tag” option, depending on what product taxonomy you want the template to apply to. 
  4. Select the specific product category or  product tag that this new template should apply to.
  5. If you’d like to start from a pre-built pattern, select a pattern when prompted.
  6. Edit the category specific template to meet your needs for that specific product category or tag.

Questions and Support

↑ Back to top

Do you still have questions and need assistance? 

This documentation is about the free, core WooCommerce plugin for which support is provided in our community forums on WordPress.org. Searching there you’ll often find that your question has been asked and answered before.

If you haven’t created a WordPress.org account to use the forums, here’s how.

  • If you’re looking to extend the core functionality shown here, we recommend reviewing available extensions in the Woo Marketplace.
  • Need ongoing advanced support, or a customization built for WooCommerce? Hire a WooExpert agency.
  • Are you a developer building your own WooCommerce integration or extension? Check our Developer Resources.

If you weren’t able to find the information you need, please use the feedback thumbs below to let us know! 🙏