Bild Element

Ausschnitt wählen

Das image und media Element ermöglichen das Einstellen eines Ausschnitts direkt in der Bildansicht. Um die Funktionalität zu aktivieren, muss der Parameter edit gesetzt sein. Dieser kann bereits true sein oder ein Array mit weiteren Einstellungen.

fa_image_edit.png

Über den Button Ausschnitt bearbeiten wird der Bearbeitungsmodus aktiviert. Hier stehen folgende Funktionen zur Verfügung:

  • Button, Zurücksetzen: setzt alle getroffenen Einstellungen zurück.
  • Button, Wiederherstellen: setzt die eben getroffenen Einstellungen zurück.
  • Button, Verkleinern: verkleinert den angezeigten Ausschnitt.
  • Button, Vergrößern: vergrößert den angezeigten Ausschnitt.
  • Auswahlliste, Seitenverhältnis: die gesetzten Einstellungen für Bilder bearbeiten werden hier aufgelistet. Wenn edit ein Array ist, kann hier ratios angegeben werden. Dies folgt den selben Regeln wie die Mandanten spezifische Einstellung, gilt aber dann nur für dieses Element.
  • Höhe ändern: Über den unteren Rand des Bildes kann die Höhe geändert werden. Nur verfügbar, wenn keine Proportionen ausgewählt, bzw. beliebige Proportionen zulässig sind.
  • Verschieben: Über Drag & Drop kann der angezeigte Bildbereich verschoben werden.
  • Übernehmen: Ein erneuter Klick auf den Button Ausschnitt bearbeiten oder außerhalb des Bild Elements, beendet den Bearbeitungsmodus und wendet die Änderungen an.
fa_image_edit2.png

Bildunterschriften

Wenn Sie ein image Element verwenden, können Sie automatisch HTML zur Anzeige einer Bildunterschrift um das Bildelement generieren lassen. Dazu müssen Sie in Ihrer conf.json Datei die Einstellung caption setzen. Hier wird das HTML definiert, welches auf Bildelemente angewendet werden soll. Dabei gibt es zwei Platzhalter zu beachten:

  • <%>: An dieser Stelle wird das HTML des Bildes eingefügt.
  • <#>: An dieser Stelle wird der Text der Bildunterschrift eingefügt.

Eine einfache Konfiguration könnte so aussehen:

{
"caption": "<figure><%><figcaption><#></figcaption></figure>"
}
wb_incandescent
Sie können die caption Einstellung auch pro Block setzen oder als Parameter in {value}.
wb_incandescent
Die caption Einstellung gilt auch für video, audio und media Elemente.