Champ Image

Le champ image stocke un actif image gere unique.

Ideal pour

• images hero
• thumbnails de cartes
• logos
• photos d'auteur
• visuels de section

Exemple de schema

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

Usage dans le template

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

Usage de type hero :

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

Quand l'utiliser

Utilisez image lorsque la section a besoin d'un visuel principal gere.

Quand ne pas l'utiliser

N'utilisez pas image lorsque :

• la section a besoin de plusieurs visuels
• l'actif doit etre telechargeable plutot qu'affiche

Utilisez plutot images ou file.

Notes techniques

• associez les champs image a un champ texte lie lorsque la section a besoin d'une legende ou d'un label explicite
• traitez l'image comme un actif principal unique, pas comme un modele de contenu multi-elements
• protege la sortie d'image optionnelle avec {{#if}} pour eviter des wrappers medias vides
• utilisez images ou repeater si chaque visuel a besoin de son propre copy de support ou de ses propres metadonnees
• les champs mono-image prennent en charge des helpers comme {heroImage.raw}, {heroImage.webp}, {heroImage.width(N)} et {heroImage.description}
• ce raccourci est specifique au contrat de champ Component ; les objets image venant du contexte page ou list utilisent generalement des chaines Facet de type objet qui se terminent par .url

Related

• Images
• File
• Repeater