Install #1 Page Builder App for FREE and get deal 6 months of Standard Plan. Hurry up! See Detail  

Header background

Product Items

Mie Tran

Written by Mie Tran

Last updated


On this page

This section helps you configure the product item. The setting will apply for the product grid of all sections on Home page, Collection page, Product Recommendation & Product recently viewed on the Product page.


1. How to choose a Product Design

First, on the homepage, in each section, you can choose the Product Item Design from General Options that the theme provides for the product items. From here, the theme provides many product item designs.


2. Config Product Design

Go to Sections Sidebar > Product Items to config for the Product item design. If you don't see the Product design you are using, please click 'ADD BLOCK' to add more design blocks.


You are allowed to config the colors for some buttons: add to cart, quickview, wishlist, compare, size list. Please check the video below:

3. Product Items settings

3.1. Product Title, Product Price

Helps you configure the style of the title, price product.


3.2. Other

Change the space between elements


3.3. Product button

Change button round corners


3.4. Color Options

Change colors for Product title, price, sale price, vendors


3.5. Color overlay

Choose an overlay for product image when hovering the product. You can set the value is 0% to disable the overlay background.


You can check this video to config Product Items in detail:

[Private Offer] EComposer Partner Plan

Exclusively for The4 users, when you bougth any theme from us, you can get Ecomposer - Theme Partner Plan for ZERO and start making beautiful, high-converting store pages today:

  • FREE 100% EComposer Standard plan for 6 months (save you $114)
  • Build ANY Shopify pages: Landing page, Sale Funnel page, Lead pages, & other custom pages tailored for your marketing campaigns.
  • Create advanced sections & add to your theme with ease
  • 100+ professtional, stunning designer-made templates
  • Build pages with a love drag-drop editor, no coding required

How to claim offer. Install EComposer HERE. Then open chatbox icon in EComposer dashboard and leave a message with subject "Theme name+EComposer" to upgrade for free

Cheers, The4.

We highly recommend Shopify apps from our partners.

We uses cookies to ensure you get the best experience on our website.