Out of the box, WooCommerce gives you the ability to display product categories on the shop and archive (categories & tags) pages. In many cases, you will need to show product categories in different places like the home page, sidebar, or in the top menu. In this tutorial, you will learn how to add WooCommerce categories to any place you want on your website. Let’s dive right in. Display categories on the shop page Open the theme customizer by going to your admin dashboard -> Appearance -> Customize. Select WooCommerce -> Product Catalog -> Shop page display. There are three options. Select the one you like: Show productsShow categories: displays top-level categories only, no subcategories.Show products & categories Display subcategories on the category pages Again, open the theme customizer -> WooCommerce -> Product Catalog -> Category display. There are three options: Show productsShow subcategories: this will display the subcategories of the current categoryShow subcategories & products Display categories on any page using a shortcode The WooCommerce categories shortcode [product_categories] is really helpful, it is a WooCommerce built-in shortcode that can be used with Gutenberg, any theme, or any page builder you have. You can add this shortcode to any page or post to display the categories. This shortcode has a lot of parameters to define which categories to display: ids: specifies which categories to display by their ids. Here you add the ids separated by a comma.limit: here, you add a number to specify how many categories to display.columns: The number of columns to display. Defaults to 4hide_empty: accepts “1” and “0” the default is “1” which will hide the categories with no products.parent: set to a specific category ID if you would like to display all the subcategories. Alternatively, set to “0” to show only the top-level categories.orderby: you can order the categories by “name”, “id”, “slug”, or “menu_order”.order: ascending (ASC) or descending (DESC). The default is ASC. You can read more about this shortcode in the WooCommerce docs here. Display WooCommerce categories using our Woo Categories module If you are using Divi theme, then our plugin – the WooCommerce builder – is an excellent option for you. You can use the plugin to customize everything about your WooCommerce store. The plugin comes with a dedicated categories module; no need to mess with shortcodes or anything. Just add the module to any Divi page, and with a few mouse clicks, you can display WooCommerce categories anywhere. The module works with Divi’s theme builder and can display all the categories, selected categories, or dynamically based on the current page. This means if you are viewing the shop page, you can display the top-level categories only. Also, when you open a specific category page, you can set the module to show the child categories of the current page. All this is done with almost no effort; select some options, and you’re done. The Woo Categories module main options Module title: sets a title for the categories list. If you have no categories, nothing will be displayed.Which Categories to Display: Select which categories to display; all categories, specific categories, or dynamically based on the current category.Order By: Order categories by name (default), id, slug, or order_menu.Order: States whether the categories order is ascending or descending.Columns Number: Choose how many columns to display. Default is 3.Hide Empty: Hide categories that have no products.Hide Subcategories: Show top-level categories only.Hide Products Count: Hide the products count next to the name of each category.Show Category Description: Show the category description under the title.View Products Button: Add a button to take the user to the category page.Plus tons of the design options for each element. Display WooCommerce categories in the sidebar WooCommerce has a built-in widget for the sidebar, and it is called “Product categories.” You can find it under your admin dashboard -> Appearance -> Widgets. The product categories widget options: Widget titleOrder by Show as dropdownShow product countsShow hierarchyOnly show children of the current categoryHide empty categoriesMaximum depth Display WooCommerce categories in the menu To add the categories to the menu, you will first have to enable a little option. Go to your admin dashboard -> Appearance -> Menus. On the top of the page, click “Screen Options.” From the opened modal, check the “Product categories” option. Next, you have more than one menu, make sure you select the menu you want. From the list menu, click “Product categories.” You will get a list of all the WooCommerce categories you have, check the ones you want, and add them to the menu. In the end, I hope you found this article helpful. If you have any questions, please, let me know in the comments below. Share this guide Facebook X LinkedIn WhatsApp Email
The Woo Categories module is a premium module, you can find it here https://divikingdom.com/product/woo-categories-module-divi-woocommerce/ Reply
Divi Tutorials How to Build a Website in Minutes Using Divi Quick Sites Building a website can seem like a scary task, especially if you’re not familiar with the technical side of things. But the truth is, with the right tools… September 26, 2024
Code Snippets WooCommerce Direct Checkout [FREE]: How to Skip the Cart and Boost Your Sales Fast Struggling with losing sales at the final step? You’re not alone. Nearly 70% of shoppers abandon their carts because the checkout process is just too complicated. It hurts,… September 11, 2024
Code Snippets How to Customize Checkout Fields in WooCommerce Using Custom Code (Ultimate Guide) Learn how to customize checkout fields in WooCommerce without using a plugin. Use a custom code for a quick loading website. This guide provides step-by-step instructions to enhance… September 10, 2024