Online shop

Sub Category-wise listing of products in woo-commerce 3.6

If you want to list products subcategory-wise in WooCommerce on WordPress, you should override the default WooCommerce product listing.

The listing products in subcategory-wise in WooCommerce uses the archive-products.php file in plugin/woo-commerce/templates in woo-commerce. Now you have to override the archive-products.php file to your theme/woocommerce folder.

If the WooCommerce folder is not present, create a folder named WooCommerce and place your PHP file there. Here you can edit the file. The code between the woocommerce_product_loop_start(); and woocommerce_product_loop_end(); lines can be deleted and your custom code for grouping products can be placed there. 

Step-by-Step Guide

1. Create a woocommerce Folder in Your Theme

First, you need to copy the archive-product.php file from the WooCommerce plugin to your theme.

  1. Navigate to wp-content/plugins/woocommerce/templates/.
  2. Find the archive-product.php file.
  3. Copy this file.
  4. Paste it into your theme’s directory: wp-content/themes/your-theme/woocommerce/. If the woocommerce folder doesn’t exist in your theme, create it.
  5. Replace the default product loop with your custom code to list products by subcategory.
<?php
// Start of the product loop
woocommerce_product_loop_start();

// Your custom code for displaying products subcategory-wise

woocommerce_product_loop_end();
// End of the product loop
?>

Sample Code for Subcategory-wise Listing

Here is a basic example of how you can list products by subcategory in WooCommerce:

<?php
// Start of the product loop
woocommerce_product_loop_start();

// Get product categories
$terms = get_terms( 'product_cat', array( 'hide_empty' => true ) );

if ( ! empty( $terms ) && ! is_wp_error( $terms ) ){
    foreach ( $terms as $term ) {
        echo '<h2>' . $term->name . '</h2>'; // Display the subcategory title

        // Query for products in the current subcategory
        $args = array(
            'post_type' => 'product',
            'posts_per_page' => -1,
            'tax_query' => array(
                array(
                    'taxonomy' => 'product_cat',
                    'field' => 'slug',
                    'terms' => $term->slug,
                ),
            ),
        );
        $loop = new WP_Query( $args );

        if ( $loop->have_posts() ) {
            while ( $loop->have_posts() ) : $loop->the_post();
                wc_get_template_part( 'content', 'product' ); // Display each product
            endwhile;
        } else {
            echo __( 'No products found' );
        }
        wp_reset_postdata(); // Reset the post data
    }
}

woocommerce_product_loop_end();
// End of the product loop
?>

Edit the archive-product.php File

Now that the archive-product.php file is in your theme, you can customize it.

  1. Open the archive-product.php file located in your theme’s woocommerce folder.
  2. Locate the code between woocommerce_product_loop_start(); and woocommerce_product_loop_end();.

If the case archive-product.php file cannot be overridden you should add this line of code to functions.php in your theme.

function mytheme_add_woocommerce_support() {
    add_theme_support( 'woocommerce' );
}
add_action( 'after_setup_theme', 'mytheme_add_woocommerce_support' );

By following the steps above, you can customize the WooCommerce product listing to display products subcategory-wise. This enhances the shopping experience by organizing products into relevant categories, making it easier for customers to find what they are looking for.

Recent Blogs


Posted

in

,

by

Tags:

To Know Us Better

Browse through our work.

Explore The Technology Used

Learn about the cutting-edge technology and techniques we use to create innovative software solutions.