Products slider

What is the Products Slide section?

The Products Slider section is a modern, visually dynamic feature that showcases your products with a dedicated background and accompanying imagery. This section pairs each product with its own unique background and a second column containing customizable text and images, which update seamlessly as users navigate through the slider.

With smooth and lightweight animations, the Products Slider ensures a sleek and polished browsing experience that highlights your product offerings in an engaging and elegant way. Perfect for creating a lasting impression while keeping your store stylish and user-friendly.

Main settings

General

• Heading: Set the title for the section to introduce your products slider.
• Make section full width: Enable this setting to make the slider span the entire width of the screen.

Products

• Text alignment: Align the product text to the Left, Center, or Right.
• Product name style: Choose between Heading or Body styles for the product name.
• Show vendor: Toggle this option to display the vendor name alongside the product.
• Show product rating: Enable this option to showcase product ratings within the slider.

Layout

• Products slider position: Choose whether the product slider appears on the Left or Right side of the section.

Promo Slide Heading Size

• Heading scale large screen: Adjust the size of the heading for large screens (percentage-based scaling).
• Heading scale mobile: Adjust the size of the heading for mobile devices (percentage-based scaling).

Colors

• Heading color: Set the color for the heading text. The default is Transparent, inheriting global settings.
• Section background color: Choose the background color for the section. The default is Transparent.

Section Spacing

• Distance from the top: Adjust the spacing from the top of the section to nearby elements.
• Distance from the bottom: Adjust the spacing from the bottom of the section to nearby elements.

Customize Product block

Click one of the preloaded Product block to customize it.

Mobile view example