Product grid section

Adding a Product grid section to your Shoplazza storefront can help you better showcase items in your shop. In this tutorial, we will demonstrate how you can set up this section in your Shoplazza theme editor with Nova 2022.

This section is useful when:

  • You want to showcase a list of products.
  • You want to grab the attention of customers by displaying what you have to offer in your store.

Adding a product grid section

1. From your Shoplazza Admin, go to Online Store > Themes and click the Customize button.

2. Click the Add section to see more available sections for this theme.

3. Under Theme sections, click Show more to find the Product grid section and customize your configurations.

4. If you would like to reposition the Product grid section, use the Drag indicator to place anywhere on the layout.

5. In the added Product grid section, use the Heading column to edit your title for this section.

6. Click Select collection to assign an existing collection to this section.


Please refer to here if you need help creating your first collection.

7. Use the sliders to adjust the number of products displayed per row and the total number of rows.

8. Toggle on the view more option to allow your customer to explore your entire collection.


You need to have a collection assigned to see this feature in the preview.

9. There are two types of layouts you can choose to display your product details:

  • Show price and title: This option displays both prices and names of products.
  • Only show price: This option only displays the prices of products.

Section padding

1. The padding editor is used to generate extra space around the section you create. Activate the "linkage icon" and type a value (measured in pixels) in any of the 4 columns to add buffers around the section or you may manually adjust each input by disabling the "linkage icon" in the centered area.

2. The screenshot below is an example use of 50px spacing on each side.

3. Here, you can select to preview on desktop or mobile.

Now you know how to create a product grid section. Go ahead and create your own to showcase your product!

Related topics

Product carousel section

Was this article helpful?
0 out of 0 found this helpful



Please sign in to leave a comment.