CODEWITHSUNDEEP
wordpresswoocommercecustomization
YunaM
YunaM

Reputation: 41

Display of WooCommerce Product SubCategories with Parent

I am setting up Woocommerce 2.6.7 on WordPress 4.6.1 .

My set up in the WooCommerce Settings / Product Display :

'Shop Page Display' = 'Show categories'
'Default Category Display' = 'Show subcategories'.

My goal is to have the layout of both the Shop page AND the page that displays the Subcategories to display with 3 columns, like the screenshot:

screenshot1

And to have the page that actually displays the Products belonging to a Category or a Subcategory, display in one column. I'm new to Stack Overflow, so it wouldn't let me post more than 2 images, but if you see the next image, you'll get the idea.

With some CSS and the code snippet I found in the Woocommerce documentation, I've managed to have the Products belonging to a Category display the way I want.

  add_filter('loop_shop_columns', 'loop_columns');
    if (!function_exists('loop_columns')) {
    function loop_columns() {
    if ( is_product_category() || is_product_tag() ) {
    return 1;
    } 
    // for other archive pages and shop page
    else { 
    return 3;
    }}}

But now I have SubCategories also display in one column, like this:

screenshot2

How can I make this page display with 3 columns, like on the Shop Page, and not affect the 1-column display of the Products ?

Essentially, since I already have the Shop display the way I want, via Woocommerce Product Display Settings, I think I will need a way to target only the SubCategories that have a Parent, and have them display with 3 columns.

Any ideas or suggestions would be welcome.

Upvotes: 3

Views: 2366

Answers (1)

YunaM
YunaM

Reputation: 41

After some trial and error, I found and altered the code I found at : This site

The most difficult thing was to get the code that goes into the functions.php. The rest is just CSS.

This did the job for my purposes : 

function ym_are_there_subcategories() {
global $wp_query;

$current_page = get_queried_object();
$children = get_term_children( $current_page->term_id, 'product_cat' );

return ( empty( $children ) ? false : true);
}


add_filter( 'loop_shop_columns', 'loop_columns' );
if ( ! function_exists( 'loop_columns' ) ) {
function loop_columns() {

if ( is_shop() || ym_are_there_subcategories()  ) {

return 3; 
} else {
return 1; 
} // end if subcats
} // end loop_columns()
} // end if function_exists

I hope someone else find it useful. It was a baffle to me, for a couple of days.

The page that displays SubCategories now looks like this:

screenshot

Upvotes: 1

Related Questions