1

So I’ve been looking for days now to either find a snippet of code or plugin online that somebody else has created to do this as well as trying to modify pieces of code that do something similar that I found while digging through the Woocommerce core files and can’t find anything that works.

What I am trying to do is take the existing “Product Categories” page that displays each of the main product categories with a thumbnail and category title and I want to add a list of subcategories under each of the main categories.

So what I have right now is a page that just displays my main product categories like this: https://imgur.com/a/Kxm4VhY

And what I have been trying to create is a page that looks like this: https://imgur.com/a/hu9WLtb

Currently the Product Categories are displayed within the loop as list items using the template content-product_cat.php which looks like this:

<?php
/**
 * The template for displaying product category thumbnails within loops
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/content-product_cat.php.
 *
 * HOWEVER, on occasion WooCommerce will need to update template files and you
 * (the theme developer) will need to copy the new files to your theme to
 * maintain compatibility. We try to do this as little as possible, but it does
 * happen. When this occurs the version of the template file will be bumped and
 * the readme will list any important changes.
 *
 * @see     https://docs.woocommerce.com/document/template-structure/
 * @package WooCommerce/Templates
 * @version 2.6.1
 */

if ( ! defined( 'ABSPATH' ) ) {
    exit;
}
?>
<li <?php wc_product_cat_class( '', $category ); ?>>
    <?php
    /**
     * woocommerce_before_subcategory hook.
     *
     * @hooked woocommerce_template_loop_category_link_open - 10
     */
    do_action( 'woocommerce_before_subcategory', $category );

    /**
     * woocommerce_before_subcategory_title hook.
     *
     * @hooked woocommerce_subcategory_thumbnail - 10
     */
    do_action( 'woocommerce_before_subcategory_title', $category );

    /**
     * woocommerce_shop_loop_subcategory_title hook.
     *
     * @hooked woocommerce_template_loop_category_title - 10
     */
    do_action( 'woocommerce_shop_loop_subcategory_title', $category );

    /**
     * woocommerce_after_subcategory_title hook.
     */
    do_action( 'woocommerce_after_subcategory_title', $category );

// Begin my edit to display Subcategories

    $categories = $category->children;

    foreach ( $categories as $category ) {
        ?>
            <li class="wc-block-product-categories-list-item">
                <a href=" <?php esc_attr( get_term_link( $category->term_id, 'product_cat' ) ); ?>">
                    '<?php esc_html( $category->name ); ?>'
                </a>
            </li>
            <?php
    }

// End my edit to display Subcategories

    /**
     * woocommerce_after_subcategory hook.
     *
     * @hooked woocommerce_template_loop_category_link_close - 10
     */
    do_action( 'woocommerce_after_subcategory', $category );
    ?>
</li>

I pulled and altered the code in between the edit lines from the file ProductCategories.php as this code is used to display the child categories within the full hierarchical category list that can be added as a block in the wordpress page builder. It is part of the Woocommerce core files.

I’ve tried adding an action that calls a function in the functions.php file as well as just directly modifying the template as above and I can get it to display plain text in the space below each main category but no matter which way I try I can’t get it to display the child categories.

Does anybody know what I’m doing wrong or if I’m going about this the wrong way or something?

  • If you add a var_dump($category); and var_dump( $categories); right before the foreach() what do you get? – Tony Djukic May 4 at 4:09
0

Ok so after some more searching online and using the right combination of search terms I stumbled across this guide here:

https://www.themelocation.com/how-to-display-all-the-subcategories-from-a-specific-category-in-woocommerce/

From that guide I created this snippet of code that can be added to your theme's functions.php file so that the subcategory list appears under the main category title in the main categories loop. No modification of the content-product-cat.php template needed. So if anybody else needs the code here it is:

// Adding Child Category List to Main Category Display Grid

add_action('woocommerce_after_subcategory_title', 'woocommerce_subcats_from_parentcat_by_ID', 20);

function woocommerce_subcats_from_parentcat_by_ID($category) {
    $parent_category_ID = $category->term_id;
    $args = array(
        'hierarchical' => 1,
        'show_option_none' => '',
        'hide_empty' => 0, // Set to 0 to show empty categories and 1 to hide them
        'parent' => $parent_category_ID,
        'taxonomy' => 'product_cat'
    );
    $subcategories = get_categories($args);
    echo '<ul class="woo_subcategory_list">';
    foreach ($subcategories as $subcategory) {
        $link = get_term_link( $subcategory->slug, $subcategory->taxonomy );
        echo '<li><a href="'. $link .'">'.$subcategory->name.'</a></li>';
    }
    echo '</ul>';
}
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.