Bindet ein Bild im Fließtext ein, verkleinert mit resize_image, mit Vollbild-Modal.
Zola verkleinert das Bild mit resize_image. Ein Klick öffnet das
Originalbild im gemeinsamen Modal-Dialog (templates/base.html,
static/js/site.js). Bilder, die per image im Text eingebunden sind,
werden in der Galerie ausgelassen.
Argumente
| Argument | Pflicht | Bedeutung |
|---|---|---|
src | ja | Pfad ab dem Ordner content/, z. B. artikel/25-26/xyz/bild.jpg |
page | nein | page={page}: erlaubt einen relativen src (Bild im selben Ordner), z. B. bild.jpg |
align | nein | left oder right (Text umfließt das Bild), sonst zentriert als Block |
width | nein | Breite in Pixeln (ohne width/height: volle Seitenbreite) |
height | nein | Höhe in Pixeln |
caption | nein | Bildunterschrift, auch im Modal sichtbar |
Ohne page muss src der vollständige Pfad ab content/ sein. Mit
page={page} wird ein src ohne Schrägstrich relativ zum Ordner der
aktuellen Seite aufgelöst (siehe Beispiel unten).
Code-Beispiel
{{ <image src="dev/test/image/bruckmuehl-front.jpg" align="left" width="300" caption="Links ausgerichtet" /> }}
Text neben dem Bild.Vorschau
Text neben dem Bild. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Ohne align wird das Bild zentriert als Block ausgegeben:
{{ <image src="dev/test/image/bruckmuehl-gesamt.jpg" width="300" height="200" /> }}