Product Categories Element


Displaying product categories is very important for website, especially for e-commerce website. The Riode Product Categories Element offers many ways to show various kinds of product categories. One of the best ways to add product categories to a page is to use Riode Product Categories Element.

Riode Product Categories Element allows you to place your product categories on any page. And it also offers you display specific product categories. And you can control the number of product categories which are going to be shown.

Riode Product Categories Element also offers you three kinds of layouts. They are Grid Layout, Slider Layout and Creative Grid Layout. These layouts are very flexible and they will show you good performance. And it has 10 product category types. If you want to see them, just go to Product Categories Element Page.

Riode Product Categories Element will give you specified and unique product category settings. With this, you can give some styles you like.

Post Image

Please go to Product Categories Element Page to see how it shows for a visual overview.

How To Use The Product Categories Element

Step 1. Create, or choose the Column you want to add Element into. Click on Add New Element.

Step 2. Select Riode Product Categories Element from the Element List.

Step 3. Configure the Riode Product Categories Element to some place you want in your site. And then, existing product categories will be shown with default layout (grid) and default type. The Riode Product Categories Element has 3 different layouts and 10 different types for you to choose. And they can be customized to you liking. There are many settings to list for this element, but if you start with your preferred layout, and then slowly go down the options list, customizing its appearance to match your demands. After that processes, you will be able to get the product category section you are looking for.

Element Content Options

Categories Selector – Controls the product category IDs and counts.

Category IDs – Controls which specific product categories to display.

Run As Filter – If this option selected, this widget works as category filter for other product widgets in its section.

Show Subcategories – Controls whether subcategories are shown or not in your site.

Hide Empty – Controls whether empty categories are shown or not in your site.

Category Count – Controls the number of product categories to display on a certain page.

Order By – Controls how to order the product categories. Choose among ID, Title, Date, Modified, Author and Comment Count.

Order Way – Controls the sorting order of the product categories. Choose Descending or Ascending.

Categories Layout – Controls the product categories layout. Choose among Grid, Slider, Creative Grid options. Notes: If you choose Creative Grid option, you can have 13 different presets. Among them, you can choose one in your mind.

Image Size – Controls the product category image size.

Load More – Allows you to set the pagination type. Choose among No, By button, By Pagination and By Scroll.

Columns – Controls the number of colmns of product categories per row.

Columns Spacing – Controls the column spacing for product categories.

Category Type – In this field, you can choose product category types you like. Here, we have 10 different product category types.

Follow Theme Option – If you want to follow global product category type, you can active this control.

Overlay Effect – Controls overlay effect of product categories.

Element Style Options

Category Box – Controls product category padding, min height, background color and color.

Category Content Box – Controls Category Content’s position, height, width, Padding, Content Align, Border radius, Color and Background for product caregory name.

Category Name Box – Controls Category Name’s color, typography, text shadow and margin.

Category Box – Controls Margin, Color and Typography for product category.

Products Count Box – Controls color, typography and shadow for products count.

Button Box – Controls typography, shadow, color, background color, border color, border radius, box shadow, margin and padding of button.

Demos