---
title: "TYPO3 image CropVariants und Responsive Image Ausgabe"
url: "https://www.typo3.net/d/128353-typo3-image-cropvariants-und-responsive-image-ausgabe"
source: "typo3.net"
tags: ["Extensions","Bilder","Frage","HTML & CSS","TYPO3 9"]
created: "2020-10-15"
last_reply: "2020-10-16"
replies: 1
solved: false
page: 1
pages: 1
lang: "de"
---

# TYPO3 image CropVariants und Responsive Image Ausgabe

Extensions · 1 Antwort · gestartet 2020-10-15

## Eröffnungsbeitrag

**schani** · 2020-10-15 · [Beitrag #1](https://www.typo3.net/d/128353-typo3-image-cropvariants-und-responsive-image-ausgabe/1)

Hallo,durch das Mittwald Musterprojekt bin ich auf die Möglichkeit von CropVariants gestossen.
Das funktioniert auch soweit gut, aber ich die kann die 3 verschiedenen Varianten von "gecroppten" Bildern nicht ausgeben. ich kann nur auf eines zugreifen - das dann in der Größe variiert wird.

ICh hab also im Page TS 3 Crop Varianten (Desktop,Tablet,Mobile) angelegt. Im CE kann ich nun das Bild in 3 verschiedenen Crop Varianten anlegen.
Jetzt habe ich unter "fluid_styled_content/Resources/Private/Partials/Media/Rendering/Image.html" folgendes eingetragen:
<f:media
    class="image-embed-item"
    file="{file}"
    width="{dimensions.width}"
    height="{dimensions.height}"
    alt="{file.alternative}"
    title="{file.title}"
    loading="{settings.media.lazyLoading}"
    additionalAttributes="{srcset: '{f:uri.image(image: file, maxWidth: 100)} 380w,
                                    {f:uri.image(image: file, maxWidth: 200)} 450w,
                                    {f:uri.image(image: file, maxWidth: 320)} 500w,
                                    {f:uri.image(image: file, maxWidth: 380)} 792w,
                                    {f:uri.image(image: file, maxWidth: 400)} 900w',
                                     sizes: '(min-width: 1200px) 50vw, 100vw'}"
/>

Damit wird das Bild je nach Endgerät/Bildschirmgröße ausgegeben. Aber immer nur das erste der 3 Crop Bilder.
Könnt Ihr mir sagen wie man die 3 Crop Bilder zuweist?
Besten Dank für Tipps

Christian

## Antworten

### [#2](https://www.typo3.net/d/128353-typo3-image-cropvariants-und-responsive-image-ausgabe/2) · Julian.​Hofmann · 2020-10-16

Hallo Christian.

Am einfachsten, indem Du bei der Ausgabe Deiner Bilder die gewünschte cropVariant angibst ;-)
<https://docs.typo3.org/other/typo3/view-helper-reference/master/en-us/typo3/fluid/latest/Uri/Image.html>

Viele Grüße
Julian

---

Quelle: „TYPO3 image CropVariants und Responsive Image Ausgabe“, typo3.net, https://www.typo3.net/d/128353-typo3-image-cropvariants-und-responsive-image-ausgabe
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.