Collection: Slideshow

Overview

The Collection Slideshow section displays products from a selected collection in a slideshow-style layout. You can choose the collection, control whether a “View all” link appears, configure slideshow navigation and autoplay, and adjust grid visibility (columns, product count, gaps). Additional settings control product card appearance (media ratio, tag display style, variant display behavior), plus container width, alignment, color scheme, and responsive spacing. The preset includes a heading block (collection title + description) and a product card structure used for each item.


Section Configuration:

Collection

Setting Description
Collection Selects the collection whose products will be displayed.
Show “View all” When enabled, displays a link/button that directs customers to the full collection page.
View all label Sets the text used for the “View all” link/button.
Open link in new tab When enabled, the “View all” link opens in a new browser tab/window.

Card

Setting Description
Media ratio Sets the aspect ratio used for product card media (Adapt, Square, Portrait, Landscape).
Variant row index Defines which product option/variant row is used for variant-related display behavior (theme-dependent).
Product tags display Controls how product tags appear on the card (Static or Overlay).

Slideshow

Setting Description
Show arrows Displays previous/next navigation arrows for the product slideshow.
Show pagination Displays pagination indicators (such as dots) for the product slideshow.
Auto play Automatically cycles through slides when enabled.
Interval Sets the time between slide changes when auto play is enabled (milliseconds).

Grid settings

Setting Description
Desktop columns Sets how many products are visible at once on desktop (2–4).
Products to show Sets how many products from the selected collection are displayed (2–8).
Mobile columns Sets how many products are visible at once on mobile (1 or 2).
Gap Controls the spacing between product cards.

Layout

Setting Description
Container layout Controls how the section is sized on the page: page-width (boxed), contained-content, or container-fluid (full width).
Container size (Desktop) Sets the maximum section width on desktop as a percentage (50%–100%).
Color scheme Applies a theme color scheme to the section styling.
Text alignment (Desktop) Controls text alignment on desktop (left, center, right).
Text alignment (Mobile) Controls text alignment on mobile (left, center, right).

Inner padding

Setting Description
Top (Desktop) Adds space above the section’s inner content on desktop.
Bottom (Desktop) Adds space below the section’s inner content on desktop.
Left (Desktop) Adds space to the left of the section’s inner content on desktop.
Right (Desktop) Adds space to the right of the section’s inner content on desktop.
Top (Mobile) Adds space above the section’s inner content on mobile.
Bottom (Mobile) Adds space below the section’s inner content on mobile.
Left (Mobile) Adds space to the left of the section’s inner content on mobile.
Right (Mobile) Adds space to the right of the section’s inner content on mobile.

Outer padding

Setting Description
Top (Desktop) Adds space above the section (outside the section content) on desktop.
Bottom (Desktop) Adds space below the section (outside the section content) on desktop.
Left (Desktop) Adds space on the left side of the section (outside) on desktop.
Right (Desktop) Adds space on the right side of the section (outside) on desktop.
Top (Mobile) Adds space above the section (outside) on mobile.
Bottom (Mobile) Adds space below the section (outside) on mobile.
Left (Mobile) Adds space on the left side of the section (outside) on mobile.
Right (Mobile) Adds space on the right side of the section (outside) on mobile.

Blocks Configuration:

Heading

A  heading block that displays the selected collection title and a description.

Block Description
Collection title Displays the selected collection’s title with heading size controls.
Description Displays supporting text beneath the collection title.

Product Card

Block Description
Product card image Displays the product’s main image/media area.
Tags Displays product tags/badges such as custom tags, stock, or sale labels.
Content Displays product information such as reviews, title, vendor, swatches, and custom features.
Price + ATC button Displays product pricing and an add-to-cart action area.

Rating / tags blocks (inside the card)

Block Description
Reviews Displays the product’s review summary.
Title Displays the product title.
Vendor Displays the product vendor/brand.
Swatches Displays variant swatches for the product.
Price Displays product pricing information.
Add to cart Displays an add-to-cart action for the product card.
Custom tag / Stock tag / Sale tag Displays tag-style labels used for promotional or status indicators.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us