Collection spotlight

Collection spotlight lists your collections as large titles. When a visitor hovers a title, or reaches it with the keyboard, that collection's image comes forward beside the list. Each title links to its collection. It suits a short list of key collections, such as Outerwear, Knitwear, Tailoring.

How to set it up

Step 1: Add the section

1. In the theme editor, open the page where you want it, such as the home page, and click Add section in the Template area.
2. Choose Collection spotlight. Drag it to where you want it on the page.

Step 2: Add the collections

1. Click Add block > Collection and choose the Collection.
2. Leave Title and Image empty to use the collection's own, or enter a shorter title and pick another image.
3. Repeat for each collection. Drag the blocks to change the order.

Step 3: Set the list

1. Under Collection list, choose the Title style, and turn Show numbers (1) (01, 02, 03) and Show product count on or off.
2. Set the Inactive title opacity: how faint the other titles are while one is active.
3. Add a link below the list with Link label and Link, for example to all collections.

Step 4: Set the image and text

1. Under Layout, choose the Image position (left or right), the Image ratio and the Corner radius.
2. Under Text, write an eyebrow, a heading (italic words are highlighted) and a short text above the list.

Settings reference

Full width, section layout, color scheme, spacing and mobile overrides work the same in every section: see Section layout and spacing. Headings, subheadings and descriptions: see Section headings and text.

How it works

• On touch screens, where there is no hover, each title shows a small image of its collection beside it.
• Collections without an image use their first product's image.

Related

• Collection list
• Category showcase
• List collections