Campo de Imagem

O campo image armazena um ativo de imagem gerenciado único.

Ideal para

• imagens principais
• miniaturas de cartões
• logotipos
• fotos de autores
• elementos visuais da seção

Exemplo de esquema

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

Uso no template

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

Uso no estilo hero:

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

Quando usar

Use image quando a seção precisar de um visual gerenciado primário.

Quando não usar

Não use image quando:

• a seção precisar de vários visuais
• o ativo deve ser baixável em vez de exibido

Use images ou file em vez disso.

Notas técnicas

• associe campos de image com um campo de texto relacionado quando a seção precisar de uma legenda ou rótulo explícito
• trate a imagem como um único recurso primário, não como um modelo de conteúdo com vários itens
• proteja a saída de imagem opcional com {{#if}} para evitar envoltórios de mídia vazios
• use images ou repeater se cada visual precisar de seu próprio texto de suporte ou metadados
• campos de imagem única suportam helpers específicos do campo, como {heroImage.raw}, {heroImage.webp}, {heroImage.width(N)}, e {heroImage.description}
• esta forma abreviada é específica do contrato do campo Componente; objetos de imagem vindos do contexto de página ou lista geralmente usam cadeias Facet em estilo objeto que terminam em .url

Relacionado

• Imagens
• File
• Repeater