Collection carousel

A row of collections on a track that runs off the edge of the page. Each Collection block is one card, and the row is swiped on a phone or dragged with a mouse on a desktop.

What it does: Puts more departments in front of a visitor than a grid would fit, without making the page taller. Because the row visibly runs off the edge, it reads as something to be moved rather than as a grid that has been cut off.

Key settings (in the section’s settings):

Setting	What it does	Default
Color scheme	Section colors.	scheme-paper
Heading width	Narrow, Normal, Wide, or Full width.	Wide
Heading alignment	Left, center, or right.	Left
Subheading	The small label above the heading.	”The departments”
Heading	The headline. Italicize a word to set it in the emphasis font.	”Where to start.”
Intro text	A line under it.	”Six rooms of the wardrobe…”
Layout	Beside sets the copy to one side with the track running past it. Stacked puts the copy above a full-width track.	Beside
Image ratio	Square (1 by 1), Portrait (4 by 5), or Landscape (3 by 2).	Portrait
Show pieces count	Prints how many products are in each collection, under its name.	On

The section also carries a Section spacing group. Pick a Device of Desktop or Mobile, then set Top and Bottom padding from 0 to 200px. Desktop starts at 96px and mobile at 56px.

Blocks: Collection, up to 12.

Setting	What it does	Default
Collection	Which collection the card opens.	Empty
Image	Leave it empty to use the collection’s own image.	Empty
Heading	Leave it empty to use the collection’s own name.	Empty

Tip

A card set up with nothing but a Collection is already complete. It takes the picture, the name and the count from Shopify. Fill in Image or Heading only where you want this page to say something different from the collection itself.

Caution

The count is live. With Show pieces count on, a collection that empties out says “0 pieces” on your home page. If a collection is seasonal, either leave the count off or keep an eye on it.

When to use it: Use it when you have five or more departments and a grid of them would take over the page. With four or fewer, Collection list lays them out as a grid with nothing to scroll. When the point is to show the products inside a department rather than the department itself, use Product carousel.

Related: Collection list · Collection tabs · Product carousel · Lapels support replies within 12 hours.