A. Demo video

• 

• 

• 

• 

• 

• 

B. Configuration

Link to config: Go to Admin panel > choose [App Builder] > Select a template that you want to update > Choose option [Product List] on the dropdown.

1. Config tab

App bar
Type Appbar	There are 3 types: – Scroll: Appbar will be scrolled following the content – Floating: Appbar will be scrolled following the content BUT when user scrolls back, it will be displayed on the top. – Fixed: Appbar always stays on the top
Enable center title	Enable: The title category will be displayed in the center Disable: The title category will be displayed in the left
Enable count product item	Show/hide product item counter
Enable Cart	Show/hide cart icon
Enable search	Show/hide search icon

2. General tab

Refine position	– Bottom: the filters form will be displayed from the bottom refer here – Left: the filters form will be displayed from the left side refer here – Right: the filters form will be displayed from the right side refer here
Refine Item style	There are 2 available styles to display refine item: – List title: refer here – Card: refer here
Item Per Page	Set up the item number will be displayed on a page

3. Stype tab

Padding/Margin	Set Padding/Margin for whole section
Config item
Text color	It applies for Product name
Sub text color	It applies for Category name (if [Enable category] = Yes on General tab) and Rating icon
Price color	Set color for price (when price without discount)
Sale price color	Set color for sale price
Regular price color	Set color for Regular (original) price
Border Radius image	Set radius for product image
Label New	Users are able to set: Background color, On color, Border radius for “New” label
Label sale	Users are able to set: Background color, On color, Border radius for “Sale” label

4. Layout tab

There is only available layout: default