Skip to main content

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​