Hero:Product carousel section

The product carousel section enables you to showcase and promote your product in a minimalistic, interactive slider that is easy to use. An effective product carousel section makes it easier for your customers to browse your collections and potentially convert more sales.

This section is useful when:

You want to optimize the design of your store and improve useability by allowing more customer interactions.
You want to highlight specific products in a more effective way.

In the steps below, we will demonstrate how you can create a Product carousel section in Hero.

Creating a Product carousel 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 Additional sections, select the Product carousel section and customize your configurations.

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

Editing a Product carousel section

Headings

1. In the added Products carousel section, edit your heading text displayed.

Collections

2. Here you can import a created section in your Shoplazza storefront.

Note: Please refer to our help doc here if you would like to know how to create your first collection.

Descriptions

1. The description box allows you to further describe and provide more details about a collection you would like to promote.

Other features

1. Toggle on to display the View more button and redirect traffic to your product landing page.

2. Move the slider to adjust the number of products viewable on one slide.

3. The Show products slider limits how many products are shown in your collection from the carousel.

4. The Auto-change products feature rotates the slides into view. You are also able to set a time frame with the slider below.

Colors

1. Here you can change different savings display styles, showing the amount or percentage.

2. Here you can customize the appearance of this feature by using the colour palette.

3. The Heading font menu allows you to customize the font style. You may click on Change to browse the font list and change the heading size.

4. Here you can customize the appearance by choosing the edges.

5. Also, you can customize the appearance of the quick shop popup by choosing the edges.

6. You can customize the appearance of the "View more" button by using the colour palette.

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 of using 100px spacing on each side.

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

The product carousel section gives you the opportunity to showcase your products with an interactive interface. It helps newer customers navigate through your collections and potentially convert more sales.