Von Kay Eickhoff
Contao Tipps und Tricks: Den „wichtigen Teil“ im Bild markieren.
In Contao kann für jedes Bild ein Bildausschnitt bestimmt werden, der unabhängig von der Bildschirmgröße immer sichtbar ist!
Beispiel: Mit den folgenden Einstellungen wird ein Porträtfoto (Querformat) bis zu einer Displaybreite von 767 Pixel im Hochformat und ab einer Breite von 768 Pixeln im Querformat angezeigt. Der umrandete Bereich bleibt dabei, als „wichtiger Teil“, immer sichtbar.
1) So fügst du den „wichtigen Teil“ zu einem Bild hinzu:
- Wähle ein vergleichbares Bild, öffne es in der Dateiverwaltung und markiere den gestrichelten Bereich als „wichtigen Teil“.
- Erstelle unter „Themes / Bildgrößen“ die Bildgröße „Porträtfoto Landscape“.
- Füge der Bildgröße den Media Query (min-width: 100px) and (max-width: 767px) hinzu, mit einer von Breite 767px und einer Höhe von 900px. Wähle den Größenänderungsmodus „Exaktes Format“.
- Füge der Bildgröße den Media Query (min-width: 768px) hinzu und lasse die Eingabefelder für Breite und Höhe leer. Wähle den Größenänderungsmodus „Proportional“.
- Platziere das Bild auf der Website und wähle im Reiter Bildgröße die Größe „Porträtfoto Landscape“. Zum Testen verkleinere einfach mal das Browserfenster!
2) So siehts aus!
Beispiel: Bildbereich festlegen
Fazit: So bleibt der wichtige Bereich eines Bildes immer sichtbar!
Die Option „wichtiger Teil“ bietet eine perfekte Möglichkeit sicherzustellen, dass der relevante Bereich eines Bildes unabhängig von dessen ursprünglichem Format immer angezeigt wird.
Blog durchsuchen:
Das könnte dich auch interessieren:
