Skip to content

Collection tabs

A compact way to present a few collections: the names sit as tabs on one side, and the chosen collection’s picture, text and button fill the other.

Collection tabs with four names on the left, the second selected, and its picture with a Shop now button on the right
Collection tabs with four names on the left, the second selected, and its picture with a Shop now button on the right

Add a Collection block per collection. Each takes the collection, a Tab name (or the collection’s own), an Image (falling back to the collection’s picture, then its first product), a Text (falling back to the collection’s description), and a Button label with a style.

Under Layout: the Color scheme, Image position left or right, Image ratio (match the first picture, square, portrait or landscape), Vertical alignment of the shorter column beside the taller one, Width, and Zoom image on hover.

On mobile the tabs sit above the picture and the shopper taps between them.