booster addons
creative elementor bundle
Purchase Now
Purchase Now
Purchase Now

Home - Widgets - Woo Categories

Woo Categories

Preview Widget
Preview Widget
Getting Started
Global Settings
Layout Settings
Content Styling
Container Styling

More Widgets

• Woo Modern Products
• Woo List Products
• Simple Images Slider
• Filter Showcase Images

# Getting started

The Woo Categories widget, as its name dictates, is the perfect tool to display your products categories in a fancy way. Choose from different showing and hovering effects, customize the layout, fonts, and colors to create your own design.


You can find the options down below.

Global Settings

The global settings section is going to be used to define the category type, sorting order and various other settings.

  • Category Type : Select if you want to display the latest categories or use a custom list.
  • Latest :

Number of Categories to Show :  Define the number of categories to be displayed

  • Custom List :

Custom List :  Select the woo custom list that you want to use.

Sort Order : Choose either ascending or descending.

Columns Number : Choose the desired number of columns for the categories listing. Up to 5 columns can be used.

Enable Gutter & Gutter Value : Enable this if you want the categories to be separated by white space. You can also change the gutter value to control the separating space.

Show Effect : Change the categories showing effect. Select one of the many animations available.

Layout Settings

Under the layout section, you will be able to change the category item height and the positioning of your content inside the widget. 

  • Item Height : Define the category item height.
  • : Horizontally align your content (the button and text) inside the category item container. 
  • : Vertically align your content (the button and text) inside the category item container. 
  • Hover Effect : Choose one of the multiple hover effects available in the list.


Under the styling tab, you will have full control over the styling of the text and other aspects of the widget.

  • Font Settings

Customize the text properties for the category title, description, and slug. Change the font size, font family, line height...

  • Color Settings

Alternate the color style for the widget elements.

-Normal & Hover : Select​ which state you want to customize. Normal for the idle state of the category items and hover for when an item is being hovered. Note that every option in this section will only affect the selected state.(The cart icon and button only appear on hover, so they are excluded)

-Color : Change the color of the widget elements using their respective controls. The slug background color can also be changed.

Container Styling

Under the container styling, you can customize the category items overlay as well as add borders and shadows.

  • Overlay Background : Customize the overlay background with the desired color.
  • Border : Alternate the borders values to add more design to your product items.
  • Box Shadow : Apply a box shadow to the product items to create unique effects. Changing the shadow color is also possible.

  • Distances

Control the margins & distances between each of the widget elements to customize the layout.

Get Help From Professionals

Can't find what you are looking for?

If you can't find what you are looking for any our documentation website, please feel free to open a support ticket  & get help from our support team.

Open a Ticket
Open a Ticket


We are a group of talented WordPress developers & designers from Earth our main goal is to create great products & provide the best services to our customers.




Email :

WebSite : Certain Dev

Made with love from Earth!

Certain Dev | all rights reserved © 2020