WooCommerce Category Grid Widget
The WooCommerce Category Grid widget allows you to display WooCommerce product categories in a responsive grid layout inside Elementor pages. This helps visitors quickly explore product categories and navigate your store more efficiently.
Instead of showing categories in simple lists or menus, this widget lets you present them in a structured grid layout with images, titles, and category information.
The widget is commonly used on WooCommerce shop pages, homepage category sections, or custom landing pages.
Part of WooCommerce Elementor Widgets #
The WooCommerce Category Grid widget is included in the WooCommerce widget collection available in Spexo Addons. These widgets allow you to design WooCommerce layouts directly inside Elementor.
When to Use the WooCommerce Category Grid Widget #
This widget is useful when you want to visually showcase product categories so customers can quickly navigate your store.
It works well with layouts that include the Product Price Widget and sections that display the Product Rating Widget.
Requirements #
Before using the WooCommerce Category Grid widget, confirm that the following setup requirements are completed.
- WooCommerce plugin installed and activated
- Spexo Addons plugin installed and activated
- Product categories created in WooCommerce
- Elementor installed and active
How to Activate WooCommerce Category Grid #
To use this widget, search for Woo Category Grid in the Elementor widget panel.
Drag and drop the widget into the Elementor section where you want the category grid to appear.
After adding the widget, the category grid layout will appear inside your Elementor page.
Content Settings #
After adding the widget, open the Content tab to configure category display settings.
General #
The General settings allow you to control the overall category display layout and define how many categories appear in the grid.
Query #
The Query settings allow you to choose which WooCommerce product categories should appear in the grid. You can select specific categories or display all available categories.
Layout #
The Layout section lets you control how category cards appear, including column structure and spacing.
Title #
The Title settings allow you to configure how category titles appear in the grid.
Meta #
The Meta section allows you to display category metadata such as product counts.
Excerpt #
The Excerpt settings allow you to display a short category description beneath the category title.
Button #
The Button settings allow you to add a call-to-action button for each category card.
Style Settings #
To customize the design of the category grid, open the Style tab in Elementor.
You can adjust typography, colors, spacing, borders, and hover effects for the category cards.
Common Issues and Fixes #
If categories do not appear in the grid, confirm that WooCommerce product categories exist and are assigned to products.
If the widget does not appear in Elementor, review the Configuring Widgets guide and confirm the widget is enabled.
Frequently Asked Questions #
Why are WooCommerce categories not showing? #
The widget requires existing WooCommerce product categories. If categories are not created or assigned to products, the grid may appear empty.
Can I control how many categories appear in the grid? #
Yes. The General and Query settings allow you to control which categories appear and how many are displayed.
Can I customize the category grid design? #
Yes. The Style tab allows you to customize typography, colors, spacing, and card design.
If you need assistance, feel free to Contact Our Support Team.
Navigation:
