Blog Detail

TYPO3: Die Crop-Scaling-Funktion

Warum TYPO3?

Viele moderne Open-Source-Webapplikationen nutzen ImageMagick und die PHP GD Library, um Bilder zu manipulieren - TYPO3 macht da keine Ausnahme. Allerdings hat sich TYPO3 schon frühzeitig an dieser speziellen Bildbearbeitung orientiert, sodass Kaspers Begeisterung für ImageMagick in vielen TYPO3-Aspekten spürbar wird - vor allem im Installationsprogramm, wo diverse Würdigungen für die Vorzüge von ImageMagick zu finden sind.

TYPO3 besitzt ein Frontend für ImageMagick, das grundlegend auf dem GIFBUILDER-Objekt basiert. Bei uns benutzen wir die TYPO3 ImageMagick-Anwendung, um grafische Überschriften oder Bilder mit Wasserzeichen zu erzeugen. Auch grafische Überschriften, die Text und Bilder aus mehreren Quellen kombinieren, Thumbnails aus GIF-, PNG-, JPG- oder PDF-Dateien und grafische Navigationen werden damit erzeugt. Letztere sind in unserer Zeit aus SEO-Gründen allerdings weniger üblich. Fakt ist: Die Bedienung von TYPO3 gehört zu seinen herausragenden Eigenschaften - eine Tatsache, die in unserer Beitragsreihe noch häufiger Erwähnung finden wird, wenn es darum geht, warum wir TYPO3 verwenden.

Verborgen im TYPO3 Image-Object findet sich eine Funktion, auf die wir besonders eingehen möchten - das Crop Scaling, also das Beschneiden und Skalieren von Grafiken, das eine ganze Bandbreite neuer Designmöglichkeiten bietet. Unter anderem ermöglicht die Crop-Scaling-Funktion das Einstellen fester Höhen- und Breitenwerte für erzeugte Bilder, ohne sie zu verzerren. Dies ist besonders nützlich, wenn Bilder mit begleitenden Thumbnails, also kleinen Vorschaubildern, erforderlich sind. Hier ist es oft der Fall, dass die Thumbnails eine einheitliche Größe benötigen, während die Quellbilder unterschiedliche Formate besitzen. In diesem Fall genügt es, bei TYPO3 einfach den Buchstaben „c“ hinter den Breiten- und Höhenangaben einzugeben. TYPO3 wird das Bild dann zunächst auf die richtigen Dimensionen skalieren und dann beschneiden. Genial.

Jüngere Versionen von TYPO3 besitzen überdies die Möglichkeit, mit der Offset-Funktion den Ausgangspunkt für das Crop-Scaling festzulegen. Welche Vorteile bietet diese Funktion? Ein Problem früherer Versionen war es, dass Bilder immer von der Bildmitte ausgehend beschnitten wurden. Bei Porträtaufnahmen ist es aber sinnvoller, den Schneidvorgang in der linken oberen Ecke zu starten, um sicherzustellen, dass der gesamte Kopf auf dem Vorschaubild zu sehen ist. Mit der Offset-Funktion ist dies nun möglich.

Beispiel für die Benutzung des Crop-Scaling in TYPO3

file {
width = 150c-50
height = 150c-50
}

Beim Breitenwert gibt der erste Teil (150) die Breite des dargestellten Bildes an.
Der Wert „c“ legt fest, dass TYPO3 das Bild skalieren und anschließend beschneiden soll.
Der dritte Teil (50) gibt den Prozentwert für den Schneidvorgang an, ausgehend von der oberen linken Ecke des Quellbildes.

Dieses Beispiel skaliert ein Landschaftsbild auf eine Höhe von 150 Pixeln und beschneidet es dann, aus gehend von der Mitte, auf eine Breite von ebenfalls 150 Pixeln. Das ist nur einer der Tricks in TYPO3. Weitere werden an dieser Stelle folgen.