1 Bildverwaltung und Erzeugung dynamischer Grafiken. Automatische Umwandlung des von den Redakteuren erfassten Bildmaterials in ein webgerechtes Format Erzeugung grafischer Menüs Erstellung von dynamischen Grafiken wie zum Beispiel Balkendiagrammen Bildvoransichten im Administrationsbereich

2 Bilder einfügen Einfügen von Bildern durch Redakteure: Als Seiteninhalt Im Rich Text Editor Vorführung

3 Einstellungen Bildposition Bildgröße Klick Vergrößern – Funktion Qualität / Format Effekte

4 Dynamische Grafiken – Der GIFBUILDER GIFBUILDER-Objekte können in IMAGE- Objekten von TYPO3-Templates, statt der Angabe einer fixen Grafik in Form des Dateipfades, verwendet werden. Das Aussehen der Grafik wird dabei über Eigenschaften des Objektes mittels Typo-Script gesteuert.

5 Beispiel Titel als Bild seite = PAGE seite.typeNum = 0 seite.10 = IMAGE seite.10.file = GIFBUILDER seite.10.file { XY = [5.w], [5.h] 5 = IMAGE 5.file = fileadmin/hintergrund.jpg 10 = TEXT 10.text.field = title 10.offset = 10, fontFile = fileadmin/verdana.ttf 10.fontSize = 18 }

6 Weiteres Beispiel Es wird angenommen, dass sich in einer HTML- Designvorlage ein Marker KATEGORIE befindet. An dieser Stelle soll die Kategorienüberschrift der Website auf einem vorgegebenen Hintergrund platziert werden. Bei der Schrift ist darauf zu achten, dass der Text nicht »pixelig« dargestellt wird.

7 Listing Teil 1 seite = PAGE seite.typeNum = 0 seite.10 = TEMPLATE seite.10 { template = FILE template.file = fileadmin/vorlage.html workOnSubpart = DOKUMENT marks.KATEGORIE = IMAGE marks.KATEGORIE.file = GIFBUILDER

8 Listing Teil 2 marks.KATEGORIE.file { XY = 100, 50 5 = IMAGE 5.file = fileadmin/img/hg.gif 10 = TEXT 10.text.field = title 10.offset = 5, niceText = 1 10.fontFile = fileadmin/verdana.ttf 10.fontSize = fontColor = red }

9 Beispiel Text mit Schlagschatten seite.10 = IMAGE seite.10.file = GIFBUILDER seite.10.file { 10 = TEXT 10.text.field = title 10.offset = 10, shadow.offset = 2, 2 10.shadow.intensity = shadow.blur = 50 }

10 Beispiel geometrische Objekte seite.10 = IMAGE seite.10.file = GIFBUILDER seite.10.file.XY = 200,200 seite.10.file.backColor = black seite.10.file.10 = BOX seite.10.file.10 { dimensions = 20,20,160,120 color = red }

11 Geometrische Objekte Vorführung Die Anweisungen erzeugen ein rotes Rechteck innerhalb eines schwarzen Quadrates, das durch den Hintergrund gebildet wird.

12 Caching Das dynamische Erzeugen von Grafiken ist sehr rechenintensiv und kann deshalb nicht zur Anfragezeit am Server ausgeführt werden. TYPO3 arbeitet aus diesem Grund mit einem Caching-Mechanismus.

13 Änderungen Nach Änderungen eines Redakteurs an den Inhalten weiß TYPO3, welche Änderungen an den Cache-Inhalten nötig sind. Bei Änderungen an den Templates durch einen Entwickler ist es jedoch nötig, den Cache zu leeren, damit nicht »alte« Inhalte aus der Cache- Tabelle präsentiert werden.

14 Weitere Eigenschaften Zu finden unter Dokument TSRef Abschnitt GIFBUILDER