Product Catalog

The WooCommerce Customizer allows you to set the general configuration of your product catalog.

This page explains:

  • How to configure what (products/categories) displays on the shop page.

  • How to configure what displays on category pages.

  • How to sort products in a Category.

  • How many products to show in a single row.

  • How many rows of products to display on a page.

To edit the product catalog settings, navigate to Appearance > Customize > WooCommerce > Product Catalog. The next few sections of this page will explain each of these settings in more detail.

Shop Page

Your Shop Page can display Products, Categories, or both. We recommend selecting either Products or Categories to help your customers find the products they want to buy quickly. Here’s how you configure the shop page:

  1. Select Products or Categories from the Shop page display dropdown menu.

  1. Preview your selection on the right side of the screen:

  1. Click Publish to save and for the settings to go live.

Category Display

Much like the shop page, Category pages can display Products or Subcategories within a Category, or both. Again, we recommend selecting only one.

Follow these steps to configure the shop’s category pages:

  1. Select Products or Subcategories from the Category display dropdown.

  1. Preview your selection on the right side of the screen

  1. Click Publish to save and for the settings to go live.

Default Product Sorting

Default Product Sorting allows you to control the order in which products are displayed, which influences how products are viewed by default on Shop and Category pages. Visitors still have the option to sort products in a different way, if desired.

Default sorting (custom ordering + name) – display products alphabetically by name. Where the product sort order has been customized, that custom order is considered first, and alphabetically by name second (if products share the same order positions). In your store, customers will see this as Default Sorting.

Sort by Popularity (sales) – display products according to amounts sold, from most to least. Customers see Sort by Popularity.

Sort by Average rating – display products based on average review ratings, from highest to lowest.

Sort by most recent – display products in the order they were added to the store, newest to oldest. Customer see Sort by Latest.

Sort by price (asc / desc) – sort product by price either lowest to highest (asc) or highest to lowest (desc). Customer see either Sort by price: low to high, or Sort by price: high to low.

To choose a Default Sort Order:

  1. Select an option from the dropdown

  1. Preview your selection live. You can be viewing the Shop page or a Category page.

  1. Click Publish to save and for the settings to go live.

Products per Row

Products per Row allows you to choose the number of items that appear in a single row on the Shop and Category pages.

Be sensitive to:

  • Size of a product image

  • Space on a computer/laptop, tablet or mobile device

  • The optimal experience for a customer viewing and buying your products

  1. Use arrows to increase/decrease the number of products.

  1. Preview your selection live. You can be viewing the Shop page or a Category page.

  1. Test on different devices. Below is an example of different views, using the same settings.

Computer/laptop screen

Tablet Screen

Mobile Device

*Scaling of image size and appearance will vary, depending on the theme you’re using. Screenshots above are with our free Storefront theme.

  1. Click Publish to finish.

Rows per Page

Rows per Page allows you to choose the number of rows that appear on Shop and Category pages.

Please consider the following:

  • Size of product images

  • Number of products you sell

  • Space on a computer/laptop, tablet or mobile device

  • The optimal experience for a customer viewing and buying your products

  1. Use arrows to increase/decrease the number of rows.

  1. Preview your selection live. You can be viewing the Shop page or a Category page.

  1. Test on different devices. Below is an example of different views, using the same settings.

Computer/laptop Screen

Tablet Screen

Mobile Device

*Scaling of image size and appearance will vary, depending on the theme you’re using. Screenshots above are with our free Storefront theme.

  1. Click Publish to finish.

Last updated