Customize Products Per Page & Sorting Order in WooCommerce

Imagine a shop that’s both elegant and user-friendly, showcasing only the most relevant products. This isn’t magic; it’s the art of mastering WooCommerce display settings. By clearing the clutter, you can unleash your online store’s true potential.

Stop the scroll! Endless product listings can overwhelm your customers. But with WooCommerce, you have the power to create a user-friendly shopping experience.

Here’s how:

• Customize Products Per Page: Decide how many products your customers see at once. A smaller number creates a cleaner, more focused experience, while a larger number can be useful for product categories with many options.
• Sorting Made Easy: Let your customers choose how they browse! Enable sorting by price, popularity, average rating, date added or even custom sorting. This empowers them to find what they need quickly and efficiently.

Why Do You Need to Change Products Per Page And Rearrange Your Products?

• Goodbye, Scrolling Fatigue: By displaying a manageable number of products per page, you eliminate endless scrolling and information overload. Customers can focus on what matters – browsing and discovering your amazing products.
• Effortless Navigation: Strategic sorting options, like price, popularity, or newest arrivals, act as a compass, guiding customers to the products they seek faster. No more aimlessly wandering through pages, just a seamless shopping journey.
• Increased Satisfaction: When customers find what they need quickly and easily, satisfaction soars. A well-organized store fosters trust and a positive shopping experience, keeping them coming back for more.
• Reduced Bounce Rate: Frustrated customers who can’t find what they’re looking for are more likely to abandon your store. Streamlined displays and intuitive sorting keep them engaged and exploring.
• Improved Click-Through Rates: When relevant products are front and center, customers are more likely to click on them, delve deeper into product details, and ultimately add them to their cart.
• Higher Conversion Rates: By making it easy for customers to find the perfect product, you remove friction from the buying process, leading to a higher conversion rate and more sales for you.

Get ready to learn how to become an expert in product listing and sorting. We’ll explore WooCommerce customization, including how to adjust the WooCommerce number of products per page and sorting those products. 

From creating the ideal grid layout to using intuitive Product Sorting for WooCommerce, this guide will help you transform your WooCommerce store.

Change Number of Products Per Page in WooCommerce

Solution 1: Utilizing the Theme Customizer

This is the simplest approach, but it relies on your theme having built-in support for this customization.

1. Log in to your WordPress admin panel.
2. Navigate to Appearance > Customize.
3. Look for WooCommerce Settings or similar options within the customizer.
4. Locate the Product Catalog section and search for Products per Row.
5. Adjust the number of products you want displayed per page and the number of rows (if applicable).

Solution 2: Implementing Custom Code (for advanced users)

For granular control, you can use a code snippet added to your child theme’s functions.php file. This approach requires some coding knowledge. Here’s a general idea (refer to WooCommerce documentation for specifics):

1. Access your child theme’s functions.php file.
2. Include below code snippet that defines the desired number of products per page.
3. Save the changes.

add_filter( ‘loop_shop_per_page’, ‘custom_products_per_page’, 20 );
function custom_products_per_page( $cols ) {
  // Set your desired number of products per page here
  $new_cols = 8;  // Adjust this value as needed (e.g., 6, 12)
  return $new_cols;
}

Code Explanation

• add_filter: This line hooks into the loop_shop_per_page filter, which controls the number of products displayed on your shop page.
• custom_products_per_page: This defines the function that will be called when the filter is triggered.
• $cols: This variable holds the current number of products per page set by your theme.
• $new_cols: This variable defines your desired number of products per page. Change the value of 8 to your preference (e.g., 6 for a more compact layout or 12 for a wider layout).
• return $new_cols;: This line returns the modified value of $new_cols, effectively setting the new number of products per page.

Important Notes:

• This is a basic example. You might need to adjust it based on your theme’s specific requirements.
• Always ensure you have a child theme before adding custom code to your functions.php file. This protects your customizations from being overwritten during theme updates.

Sorting Products in WooCommerce

You have just changed the number of products displayed per page, now let’s move to sort products.

WooCommerce offers built-in options for sorting products within categories, but unfortunately, it doesn’t provide a native way to define separate sorting for subcategories and tags. 

However, you can try another way to achieve product sorting for each category, subcategory, and tag using WooCommerce Plugin.

Install and Activate 

Getting started with the Sort Products for WooCommerce plugin is simple. Just follow these steps to add it to your WooCommerce store:

1. Download the Plugin: Download the Sort Products for WooCommerce and save the .zip file.
2. WordPress Admin Panel: Go to the Plugins section in your WordPress dashboard. Click ‘Add New,’ then ‘Upload Plugin,’ and upload the .zip file you downloaded.
3. Upload and Activate: After the .zip file is uploaded, install the plugin and activate it.
4. Click on Sort Products Product WooCommerce to configure the sorting products options for your WooCommerce store.

Key Features of Sorting Products for WooCommerce

Customizable Product Sorting 

This plugin allows you to define how products are displayed within each category, subcategory, and tag page. You can choose from various sorting options like:

• Name: Sort alphabetically by product name (ascending or descending).
• ID: Sort by product ID (ascending or descending).
• Sales: Sort by the number of units sold (high to low or low to high).
• Price: Sort by product price (high to low or low to high).
• Products in Stock: Sort by the number of products available in stock (high to low or low to high).
• Date: Sort by the product creation date (newest to oldest or oldest to newest).

Custom Sorting with Drag & Drop

This feature provides a user-friendly interface for manually arranging products within a category, subcategory, or tag. You can simply drag and drop products to your desired order.

Boosted Conversions

By organizing your product displays with relevant sorting options, customers can find what they’re looking for faster, leading to a potentially higher conversion rate.

Various Sorting Options

The plugin offers a good selection of sorting criteria beyond the basic options found in WooCommerce, allowing for more intricate organization.

Hide WooCommerce Sorting Dropdown

You can choose to hide the default WooCommerce sorting dropdown on the front-end, keeping your chosen sorting method as the primary way to browse products.

Highlight Desired Products 

This feature allows you to showcase specific products with increased visibility within a category, subcategory, or tag.

Addressing Your Requirement:

Sort Products for WooCommerce directly addresses your need for sorting products within each category, subcategory, and tag. It provides a user-friendly interface and various sorting options, allowing you to customize how products are displayed for each section of your store.

Final Word

In conclusion, mastering product display and sorting in your WooCommerce store isn’t just about aesthetics; it’s a strategic weapon for boosting customer satisfaction, sales, and overall store management efficiency.

By implementing the tips explored here, you’ll transform your store from a cluttered maze to a user-friendly haven, ensuring a smooth shopping journey and a thriving online business.