Images-Feld

Das Feld images speichert eine Sammlung verwalteter Bild-Assets.

Am besten für

• Galerien
• Logo-Clouds
• Abschnitte mit mehreren Bildern
• Slider- oder Karussell-Eingaben

Schema-Beispiel

{ "name": "gallery", "label": "Gallery", "type": "images" }

Vorlagenverwendung

<div class="gallery">
  {{#each gallery}}
    <img src="{{this.width(800).webp}}" alt="{{this.description}}">
  {{/each}}
</div>

Mit loop-aware Ausgabe:

<div class="gallery-grid">
  {{#each gallery}}
    <figure class="{{#if loop.first}}gallery-item-featured{{else}}gallery-item{{/if}}">
      <img src="{{this.width(1200).webp}}" alt="{{this.description}}">
    </figure>
  {{/each}}
</div>

Verwenden Sie es, wenn

Verwenden Sie images, wenn ein Abschnitt mehrere zusammengehörige Visuals als Satz verwaltet haben muss.

Verwenden Sie es nicht, wenn

Verwenden Sie images nicht für:

• ein primäres Einzelbild
• downloadbare Dateien
• strukturierte, wiederholbare Karten, bei denen jede Zeile mehr als nur ein Bild benötigt

Verwenden Sie stattdessen image, file oder repeater.

Technische Hinweise

• verwenden Sie {{#each}} für alle Mehrfachbild-Darstellungen
• halten Sie das Feld für Bildersammlungen, nicht für gemischte Bild-und-Text-Zeilenstrukturen
• wenn jedes Galerie-Element seinen eigenen Titel, CTA oder Beschreibungsblock benötigt, wechseln Sie zu repeater
• prüfen Sie das Ausgabenvolumen, damit eine Komponente nicht für eine übergroße Mediendatenmenge verantwortlich ist
• innerhalb von {{#each gallery}} stellen Bildobjekte Hilfsfunktionen wie {{this.raw}}, {{this.webp}}, {{this.width(N)}} und {{this.description}} bereit
• diese schleifenorientierte Helper-Form ist spezifisch für Component images Felder; Seiten- oder Listen-Bildobjekte führen die Kette normalerweise mit .url fort

Verwandte

• Image
• Repeater
• Facet Template Syntax