Image

One image. The theme generates the responsive sizes automatically, so a single upload serves phones and desktops without you making variants.

Settings

Setting	What it does
Image	The image to show. Nothing renders when it’s empty.
Max width	The largest size to load, in pixels. Leave empty and the theme uses the image’s own width, capped at 3000px. Lowering it makes the page faster without changing how the image looks. Ignored for SVGs.
Image layout	Contain (default) fits the whole image inside its space, possibly leaving gaps. Cover fills the space and crops the overflow.
Image loading	Lazy (default) loads the image only when it scrolls into view. Eager loads it straight away.
Fetch priority	Auto (default), High, or Low. High tells the browser to fetch this image before others.
Block ID	Optional anchor ID, for linking directly to this image.

Alt text

There’s no alt text field here. The description comes from the image’s own alt text, set in Shopify’s Content › Files library or in the image picker. Set it there once and it follows the image everywhere it’s used.

Set alt text before you publish

Every meaningful image needs a description for screen readers and for search. If an image is purely decorative, an empty alt is correct — but that should be a decision, not an oversight.

Loading and priority

Defaults are right for almost every image on the page. Change them only for the one large image at the very top of a page — the hero:

• Image loading → Eager
• Fetch priority → High

That tells the browser to fetch it immediately, which is what the Largest Contentful Paint score measures.

Don’t set High on more than one image

“High priority” only means anything if it’s rare. Marking several images high tells the browser nothing, and marking below-the-fold images eager makes the page slower, not faster.

Where it’s used

Features, and inside the Content, Feature and Icon blocks.