Collection list
Overview:
The Collection List section allows you to display a curated selection of collections in various layouts: scroll marquee, grid, collage, or slideshow. It's highly customizable, offering layout controls, text alignment, image settings, and animation options.
Section Configuration:
Heading & Description
| Setting | Description |
|---|---|
| Heading | Title displayed at the top of the section. Supports rich text. |
| Heading Size | HTML tag used for heading: H1 to H6. Affects styling and SEO. |
| Heading Weight | Font weight for the heading (300–900). |
| Description | Optional rich text paragraph below the heading. |
| Description Size | Font size for the description. |
| Description Weight | Font weight for the description (300–900). |
| Max Content Width | Restricts content width as a percentage of the page width. |
Card Settings
| Setting | Description |
|---|---|
| Image Ratio | Controls the aspect ratio of collection images: adapt, square, portrait, or landscape. |
| Image Width | Custom width for collection images in scroll layout. |
| Card Heading Size | Font size for the collection title (for non-collage layouts). |
| Card Heading Weight | Font weight of the collection title (300–900). |
| Text Alignment | Aligns text inside the collection card: left, center, or right. |
| Show Custom Tags | Displays custom tags on the collection card. |
Layout Options
| Setting | Description |
|---|---|
| Layout View As |
Defines how collections are displayed: • scroll (horizontal marquee) • grid • slideshow • collage |
| Enable Overlay Animation | Adds sticky animation for collage layout (applies only when layout is collage). |
Grid Layout (if selected)
| Setting | Description |
|---|---|
| Desktop Columns | Number of columns (2–5) for desktop view. |
| Mobile Columns | Number of columns (1 or 2) for mobile view. |
Marquee Layout (Scroll)
| Setting | Description |
|---|---|
| Direction | Scroll direction: forward (right-to-left) or backward. |
| Pause on Hover | Pauses scrolling when hovered. |
| Speed | Controls marquee speed (10–50, lower = faster). |
Slideshow Layout
| Setting | Description |
|---|---|
| Pagination Dots | Displays navigation bullets below the slideshow. |
| Progress Bar | Shows a progress indicator for auto-playing slides. |
| Navigation Arrows | Displays left and right navigation arrows. |
| Auto Play | Enables automatic slide transitions. |
| Autoplay Interval | Sets time between slides (2000–9000 ms). |
Section Styling
| Setting | Description |
|---|---|
| Padding – Top | Adds top spacing to the section (0–100px). |
| Padding – Bottom | Adds bottom spacing to the section (0–100px). |
| Container Width | container for boxed layout or container-fluid for full-width layout. |
| Container Padding | Adds/removes horizontal padding inside the container. |
| Text Alignment – Desktop | Aligns heading/description on desktop: left, center, or right. |
| Text Alignment – Mobile | Same as above, for mobile devices. |
| Color Scheme | Applies a theme-defined color palette to this section. |
| Grid Gap | Space between cards or slides (0–60px). |
Blocks Configuration:
Each block represents a single collection.
| Block Setting | Description |
|---|---|
| Collection | Selects a collection to display. |
| Custom Image (image) | Optionally overrides collection’s default image. |