Products Archive Widget
Use the widget to display products archives.
Content
Content
Product Template: Choose between Default and Custom product template.
Custom template allows choosing the needed Entry template that should be displayed.
Columns: Set the number of columns for desktop, tablet and mobile.
Masonry: Slide to YES to enable masonry displaying.
Sorting: Slide to YES to enable sorting.
Show Result Count: Slide to YES to show the amount of results.
Pagination
Type: Choose the pagination type between Pagination, Infinite scroll and Load more.
View: Choose the view between Previous/Next, Numbers and Both.
Page Range: Choose how many pages should be shown on the start and the end of pagination and to either side of current pages.
Load via AJAX: Slide to YES to enable loading via AJAX.
Scroll into view: Slide to YES to enable scroll.
Enable Icon: Slide to YES to enable the icon and set it.
Text: Add the text for Previous and Next pages.
Advanced
Add the needed Nothing found message.
Style
Products
Image
Border Type: Choose the desired Border Type from the dropdown and set it.
Border Radius: Set an image border radius for desktop, tablet and mobile.
Spacing: Set the spacing between image and title for desktop, tablet and mobile.
Title
Color: Choose a title color for Normal and Hover modes.
Typography: Set a Typography using settings from the dropdown.
Spacing: Set the spacing between title and other elements for desktop, tablet and mobile.
Rating
Star Color: Choose a star color for Normal and Hover modes.
Empty Star Color: Choose an empty star color for Normal and Hover modes.
Star Size:Set a star size.
Spacing: Set the spacing between stars and price for desktop, tablet and mobile.
Sale Price
Color: Choose a sale price color.
Typography: Set a Typography using settings from the dropdown.
Regular Price
Color: Choose a regular price color.
Typography: Set a Typography using settings from the dropdown.
Button
Show button: Slide to YES to enable product button (as an example Add to cart, Select options, Read more)
Typography: Set a Typography using settings from the dropdown.
Background Type: Choose between Color and Gradient types.
Background Color: Set a background color.
Text Color: Set a text color.
Border Color: Set a border color.
Text Decoration: Choose the desired decoration from the dropdown.
Border Type: Choose the desired Border Type from the dropdown and set it.
Border Radius: Set a button border radius for desktop, tablet and mobile.
Text Padding: Set a text padding.
Spacing: Set the spacing between a button and other elements for desktop, tablet and mobile.
View Cart
Color: Choose a view cart color.
Typography: Set a Typography using settings from the dropdown.
Product Box
Box Shadow: Choose desired settings from the dropdown (for Normal and Hover modes).
Background Color: Choose background color from a color palette or Global colors (for Normal and Hover modes).
BorderColor: Choose a border color from a color palette or Global colors (for Normal and Hover modes).
Alignment: Choose between Left, Center and Right alignment.
Border Width: Set the desired border width.
Border Radius: Set the needed border radius.
Padding: Set padding for desktop, tablet and mobile.
Sale Label
Sale Label: Slider to SHOW to enable the label.
Text Color: Choose a text color from a color palette or Global colors.
Background Color: Choose background color from a color palette or Global colors.
Typography: Set a Typography using settings from the dropdown.
Border Radius: Set the needed border radius.
Width: Set the label width.
Height: Set the label height.
Position: Choose Left or Right label position.
Distance: Set the label distance.
Header
Container
Background Color: Choose background color from a color palette or Global colors.
Border Type: Choose the desired Border Type from the dropdown and set it.
Padding: Set padding for desktop, tablet and mobile.
Border Radius: Set the needed border radius for desktop, tablet and mobile.
Spacing: Set the spacing between header and products for desktop, tablet and mobile.
Result count
Text Color: Choose a text color from a color palette or Global colors.
Typography: Set a Typography using settings from the dropdown.
Sorting
Text Color: Choose a text color from a color palette or Global colors.
Background Color: Choose background color from a color palette or Global colors.
Typography: Set a Typography using settings from the dropdown.
Padding: Set padding here.
Border Type: Choose the desired Border Type from the dropdown and set it.
Border Radius: Set the needed border radius for desktop, tablet and mobile.
Layout
Columns Gap: Set the columns gap for desktop, tablet and mobile.
Rows Gap: Set the rows gap for desktop, tablet and mobile.
Border Type: Choose the desired Border Type from the dropdown and set it.
Pagination
Layout type: Choose between Left, Center, Right and Justified layouts.
Typography: Set a Typography using settings from the dropdown.
Background Color: Choose background color from a color palette or Global colors.
Border Type: Choose the desired Border Type from the dropdown and set it.
Border Radius: Set the needed border radius for desktop, tablet and mobile.
Top Gap: Set the top gap for desktop, tablet and mobile.
Padding: Set the padding for desktop, tablet and mobile.
Pagination: Numbers
Min Size: Set the pagination numbers minimum size for desktop, tablet and mobile.
Set Normal, Hover and Active modes.
Text Color: Choose a text color from a color palette or Global colors.
Background Color: Choose background color from a color palette or Global colors.
Text Decoration: Choose the needed setting from the dropdown;
Box Shadow: Choose desired settings from the dropdown.
Text Shadow: Choose desired settings from the dropdown.
Space Between: Set the space between numbers for desktop, tablet and mobile.
Border Type: Choose the desired Border Type from the dropdown and set it.
Border Radius: Set the needed border radius for desktop, tablet and mobile.
Padding: Set the padding for desktop, tablet and mobile.
Nothing Found Message
Color: Choose a message color from a color palette or Global colors
Typography: Set a Typography using settings from the dropdown.
Advanced
Set the Advanced options that are applicable to this widget