Firstly, you need to create a new block by clicking the Add content button > Product Grid then start adjusting your content.

You can choose Product Grid v2 for more flexible customization.


1 - Layout Settings

Tick off the boxes to activate/enable the features below:

  • Boxed layout: Add a padding around whole section
  • Padding items: Add a padding around a product
  • Border for the main price
  • Carousel layout (slider)

Special settings for your Carousel

  • Carousel - 2 rows layout: A slider with 02 rows display. Only works when the Carousel option above is on
  • Center mode: Unique effect for the center item
  • Auto play mode: Auto switching items one by one
  • Enable loop
  • Show Next & Prev arrows: Left & right arrows
  • Dots: Small dots which represent the number of available pages
  • Smooth auto play mode: This option does not work when the Center mode is activated

2 - Content Settings

Section titles


  • Heading
  • Subheading
  • Countdown clock: Insert the value in order of MM/DD/YYYY
  • Tick off the check box to show View All button at the top right corner of the current section

Display items

  • Section's main content will be taken from the chosen collection.
  • To set the items per row for different types of devices, please insert the values in order of desktop - tablet - mobile and separate them using commas.
  • Total items number is the maximum quantity of products in the whole section.

Special item

Big product & Big image: Choose an item which you want to catch more attention with a bigger display

  • Position: First/ last or middle (not for carousel layout)
  • Image width on desktop and mobile can be adjusted using the related fields and they only work with Row layout
  • Image height: Auto - normal, Fill  - cropped to fit the space