Woocommerce Display Child Category Shortcode

(1 customer review)


Buy any 3 plugins for a 20% discount (excludes sale items)

Version 1.3 – changed image call from full to woocommerce_thumbnail to reduce page download speeds

This plugin allows a basic insert of child categories into a parent category page using a shortcode. Woocommerce can show child categories at the start of the list of products if you select to show in the Woocommerce settings. You don’t have a choice over the placement though. This plugin was put together so I could show child categories in the description of a parent category by using a shortcode.

There may be occasions when you want to display the child categories of a parent category in Woocommerce. While Woocommerce is a powerful eCommerce plugin for WordPress it does not do everything. I developed this plugin to work in conjunction with my Category Tinymce plugin but the shortcode can be used anywhere.

This plugin allows for child category listings in the category description of parent product categories. It is a neat and simple way to help develop your category listings pages and make them more powerful SEO optimised landing pages. It also boosts user engagement by offering a bright and graphic menu for navigation.

Display child categories of current parent category in Woocommerce

It is a fairly simple plugin in that there are no settings to use. If you have used the standard shortcode for product categories in Woocommerce you know that the shortcode will produce a display of all the categories in your store including the parent categories. This is fine when you want to display categories on pages outside of Woocommerce or on the main Woocommerce shop page. It does not work so well if you want to display sub-categories contained within a certain parent category.

This plugin tackles that. It looks at the parent category of the page on which you have put the shortcode and only displays child categories of that parent category. The other thing that makes this plugin useful is that you have control of where the child categories are shown.

It has a limited use but for those times where you are trying to build a powerful landing page of a parent category and you want to make it easy for your visitors to go to sub-categories in you shop then this works really well with the Category Tinymce plugin and you can call the subcategories in either the top description area or the bottom description area.

You can see this plugin in operation at Wildlife News where on the Optics main category page  I use the plugin to display parent categories, This category page, you can see it being used to display child categories within the parent category.

The shortcode to call the display of child categories is simply [ prodsubs ] (without the spaces).

Display of Woocommerce sub-categories CSS styling

For a long time, the standard way of displaying items from the WordPress loop is to contain output within a list. This has worked well for many years but modern options in CSS mean using lists is outdated and restricted. This latest update contains the Woocommerce products within divs to make it easier to style into grids. Many of the new CSS grid options cannot be used on elements within a list. You can now choose your grid CSS of choice when displaying Woocomerce child categories.

The new CSS options allow you to choose between blocks, grid or flex options to display. As an example, the display of sub-categories on the Optics category of Wildlife News uses the inline-block to produce the grid with the following CSS:

#childcatcol img{max-height:200px; margin-bottom:15px;}

#childcatcol {text-align:center; font-weight:400; font-size:16px;vertical-align:bottom;display:inline-block; width:22%;margin:1%;}

Video tutorial on using Child Category Shortcode plugin

Spread the love

1 review for Woocommerce Display Child Category Shortcode

  1. Sally M.

    Nice and easy, drop in the shortcode and all child categories are displayed.

Add a review

Your email address will not be published. Required fields are marked *