Product List is a comprehensive widget of ShopEngine letting you do bottomless customization of your shop or archive page. Whether it’s an issue of typography, color, margin, or border size of your shop page or archive page, Product List can do the tricks for you.
How to Use Product List Widget #
At first, search for the Product List widget on the search field or find it scrolling down under the ShopEngine Product Archive section. Then, drag and drop the Product List widget on the designated area as shown in the screenshot below.
Configure Product List widget #
You can configure the product list widget from the General and Settings sections.
Under the General section, you can control the product display per page. You can set the product Order by date, name, popularity, etc. You can show Products Query by category, tag, product, rating, and more.
In the setting section, you can configure the Badge, Title, Product Hover, Price, Category, and Rating settings.
For the Badge, you can Show the sale badge, Show the discount percentage, show the tag, and set the Badge position. After that, you can choose the action for Out of Stock Visibility. You can decide to Show or Hide or keep the Default setting of the site.
For the Title, set the Chracter to Show on the title.
Decide to show Show Product on Hover and
Customize Product List style #
From the Style tab, take control of the content alignment, background color, column gap, row gap, etc., and make the necessary tweaks to suit your needs.
You can change the product image background and margin from the Product Image section.
With the Product badge parameter, you can alter the badge typography, color, background, space in-between badge, and so on.
The category of every product shows up above the product title which can be spiced up by tweaking typography, color, padding, etc. from the product category section.
From the Product title section, you can tinker around the title typography, color, and padding to make the text more appealing and catchy.
Make use of the Product Rating section to adjust the rating star size, set the start color, count color, count typography, padding, etc. and give a compelling look to the stars.
With the Product Price section, you can modify the color of your products’ regular price, sale price, typography. You can also spice up the price discount badge altering both the text color and background color.
Product Hover section lets you control different parameters like color, font size, item padding, etc. of icons showing up while hovering on a product. You can view the changes in the existing icons like quick view, add to cart, reaction, etc. while hovering.
The Global Font section applies to the text of the entire page. Pick and choose your favorite font for the texts to display on the page.
With so many sections and parameters of the Product List widget, you can beautify your archive page or shop page.