Image grid

A grid of image tiles, each with a label and a link. Use it for categories, lookbook shots, or a set of guides.

Setting it up

Heading is optional. Add a Tile block per image, each with an Image, a Label and a Link.

Tile ratio sets the shape of every tile, which is what keeps the grid tidy regardless of what your images were cropped to.

Choosing images

Because every tile is cropped to the same ratio, images with the subject near an edge lose it. Either crop them yourself before uploading, or set a focal point on each image in Shopify so the crop keeps the right part — see Image focal points for how that works.

Images of a similar tone sit together better than a mix of bright and dark. The labels sit over them, so a very pale image can leave the label hard to read.

When to use it instead of Featured collections

Featured collections pulls names, images and links from your collections automatically, so it stays correct as the catalog changes.

Image grid is manual, which makes it right when the tiles are not collections — guides, campaigns, categories that cut across your collection structure — or when you want artwork the collection images cannot give you.

Settings

Section settings

Content

Setting	Type	Default	Notes
Heading	Text	—	—
Tile ratio	Dropdown	Landscape (4:3)	Options: Landscape (4:3), Square (1:1), Tall (2:3), Portrait (3:4). Each tile keeps this ratio. Three per row on desktop; a leftover row stays left-aligned.

Background

Setting	Type	Default	Notes
Background	Color	—	—

Padding

Setting	Type	Default	Notes
Padding top	Number	—	Adjust the top padding for this section. If left empty, the global section padding will be used by default.
Padding bottom	Number	0	Adjust the bottom padding for this section. If left empty, the global section padding will be used by default.

Blocks

Tile

Setting	Type	Default	Notes
Image	Image	—	—
Label	Text	Hand tools	—
Link	Link	—	—