Scrolling Product List

The section is designed to display products in a horizontally scrollable row, emphasizing interactive and space-efficient browsing.

This design allows customers to explore multiple products within a limited horizontal area, making it ideal for featuring bestsellers, new arrivals, or recommended products in a compact format.

Products are displayed in uniform cards that include images, product names, vendor, price, review stars, and optional badges such as Sale, Sold Out, or Feature. The scrolling layout allows multiple products to be shown without taking up excessive vertical space, giving the section a clean and streamlined appearance.

The section supports slider functionality with desktop and mobile navigation options such as arrows or dots, hover effects on product images, and interactive buttons like “Add to Cart.” Responsive design ensures the scrollable list works smoothly on all devices, maintaining visual clarity and usability.

Location: Sections -> Templates -> Products: Scrolling Product List

---

Scrolling Product List – Options Overview

Option Group	Option	Description
Collection	Collection	Select the product collection that will be displayed in the scrolling line.
Heading	Subheading	Adds a small text label above the main heading.
	Heading	Sets the main title for the section.
	Description	Adds supporting text under the heading.
	Heading alignment: Left / Center	Aligns the heading and description text.
Layout	Top spacing: None / Small / Medium / Normal	Adjusts the space above the section.
Settings	Products	Selects the number of products to display in the ticker.
	Ticker time	Sets the scrolling speed (time it takes for products to move across the screen).
	Direction of move: Left / Right	Controls the direction the product list scrolls.
	Show divider	Adds a visual separator between products.
	Image ratio	Defines the shape of product images.
	Image size: Small / Big	Controls how large product images appear.
	Show second image on hover	Displays the product's secondary image when hovered.
	Customize	Opens product card design customization settings.
Dividing line	Show	Displays a horizontal line above the section.
Background	Background: Hide / Color / Gradient / Image	Sets the background style for the section.
Colors	Base	Adjusts base text and UI elements color.
	Accent	Sets highlight and focus element color.
	Lines	Controls the color of dividing lines and borders.
Collection	Vendor	Color for the vendor name text.
	Heading	Color for the product title.
	Heading hover	Hover color for product title.
	Regular Price	Color for the product’s standard price.
	Sale Price	Color for the discounted price.
	Old price	Color for the crossed-out previous price.
Review stars	Stars active	Color for filled rating stars.
	Stars base	Color for unfilled (inactive) rating stars.