Featured collection

Featured collection shows products from one collection in a tidy grid, with pastel card colors cycling through the row and a “View all” link at the end.

What it does

Use it to sell from anywhere — the home page, a landing page, the bottom of a product page. Pick a collection and the grid fills itself with its products; there is no per-product work.

The section is a grid only — products do not rotate. For an auto-rotating product stage, use Showcase carousel.

Add it to a page

1. In Shopify admin, go to Online Store → Themes and click Edit theme. (Older admin versions label this button Customize.)
2. Open the template where you want the section.
3. Click Add section and choose Featured collection.
4. Pick a Collection, adjust the count and columns.
5. Save.

Choose a style

Two settings shape the look; there is no separate layout pick:

Setting	Default	Options	What it does
Product image ratio	Square (1:1)	Square (1:1) / Portrait (4:5) / Portrait (3:4)	The photo shape of every card
Card background tint	Cycle through all tints	None (white) / Cream / Lilac / Mint / Apricot / Cycle through all tints	The pastel behind each card; Cycle gives neighbors different colors in order

Set it up: quick start

1. Add the section and pick a Collection.
2. Keep 8 products and 4 columns, or set your own.
3. Choose a Card background tint — Cycle is the theme’s signature look.
4. Save and check the phone: the grid adapts to the screen with 2 columns.

Settings

Section settings

Setting	Default	Options	What it does
Heading	“New arrivals”	Text	Section title; leave empty for no title
Collection	Empty	Collection picker	Where the products come from
Number of products to show	8	2–12, step 1	How many products appear
Columns on desktop	4	2–5, step 1	Grid columns on wide screens
Product image ratio	Square (1:1)	Square (1:1) / Portrait (4:5) / Portrait (3:4)	Photo shape of every card
Card background tint	Cycle through all tints	None (white) / Cream / Lilac / Mint / Apricot / Cycle through all tints	Card color per product
Show “View all” link	On	On / Off	Adds a link to the full collection after the grid
Top float offset	0	0–120 px, step 4	Pulls the whole section upward so it floats over the section above. 0 disables the effect

Images and content tips

• Product photos come from each product — shoot them in the same orientation as your Product image ratio to avoid cropping.
• Card tints work best when product photos have plain backgrounds; busy photos compete with the pastel.
• A collection with fewer products than “Number of products to show” simply shows what it has.

Good to know

• The grid follows your collection’s sort order — manage the order in the collection settings, not here.
• Hover effects are global. The six hover styles in the theme’s Product cards setting apply to these cards automatically.
• The float effect overlaps the section above — use it deliberately (e.g. a product row floating over the hero), and check the section above still reads well.

Example setups

New arrivals row. 8 products, 4 columns, Square ratio, Cycle tints, “View all” on.

Soft launch feature. One collection of 4 launch products, 4 columns, Portrait (4:5), Cream tint, Top float offset 40 px to tuck the row against the hero above.

Common questions

The grid shows products I didn’t pick. The section shows a whole collection. Create a collection with exactly the products you want and point the section to it.

“View all” leads to an empty page. The link goes to the picked collection — check the collection is published and has products.

My cards are all white. Card background tint is set to None (white) — pick a tint or Cycle.