Image Field

The image field stores one managed image asset.

Best For

• hero images
• card thumbnails
• logos
• author photos
• section visuals

Schema Example

{ "name": "heroImage", "label": "Hero Image", "type": "image" }

Template Usage

<img src="{heroImage.webp}" alt="{heroImage.description}">

Hero-style usage:

{{#if heroImage}}
  <figure class="hero-media">
    <img src="{heroImage.width(1200).webp}" alt="{heroImage.description}">
  </figure>
{{/if}}

Use It When

Use image when the section needs one primary managed visual.

Do Not Use It When

Do not use image when:

• the section needs several visuals
• the asset should be downloadable rather than displayed

Use images or file instead.

Technical Notes

• pair image fields with a related text field when the section needs an explicit caption or label
• treat the image as one primary asset, not a multi-item content model
• guard optional image output with {{#if}} to avoid empty media wrappers
• use images or repeater if each visual needs its own supporting copy or metadata
• single-image fields support field-specific helpers such as {heroImage.raw}, {heroImage.webp}, {heroImage.width(N)}, and {heroImage.description}
• this shorthand is specific to the Component field contract; image objects coming from page or list context usually use object-style Facet chains that end in .url

Related

• Images
• File
• Repeater