typo3-handbuch.net
typo3-handbuch.net

Bildupload mit dem TYPO3-Element-Browser

Der TYPO3-Element-Browser  trumpft mit einer Vielzahl an Auswahlmöglichkeiten auf. Daher sollten wir zunächst etwas Struktur in das Angebot bringen und uns entscheiden, was wir eigentlich machen möchten.

Option (A): Vorhandenes Bild auswählen
Befindet sich das von uns benötigte Bild bereits in einem Verzeichnis auf dem Server, so benötigen wir lediglich die Bereiche 01, 02 und ggf. 03 aus oben stehender Abbildung.

Option (B): Bild auf den Server laden
Ist das Bild noch nicht auf dem Server vorhanden, so ist es erforderlich, unter 01 zum gewünschten Verzeichnis zu navigieren und sich dann dem Bereich 04 zuzuwenden.

Option (C): Neuen Ordner anlegen
Benötigen wir womöglich erst einen neuen Ordner, um das Bild thematisch korrekt auf dem Server zu speichern, so ist zunächst unter 01 zu dem gewünschten Hauptverzeichnis zu navigieren, sodann wird unter 05 ein neuer Ordnername eingetragen und per Ordner anlegen als Unterordner des Hauptverzeichnisses angelegt. Im Anschluss können wir uns Option (A) oder Option (B) zuwenden.

Option (A) – Detailinformationen:

Verzeichnisbaum des TYPO3-Element-Browser

01: Verzeichnisbaum:
Sofern kein Verzeichnisbaum angezeigt wird, muss er ggf. erst mit dem Pfeil-Icon aufgeklappt werden. In oben stehender Ansicht sehen Sie einen Verzeichnisbaum, wie ihn typischer Weise der Systemadministrator zu sehen bekommt. Hier werden auch Verzeichnisse für die CSS-Stylesheets (Ordner css), Javascript (Ordner js) oder Templates angezeigt. Üblicher Weise wird der Administrator den Redakteuren keinen Zugriff auf diese Bereiche gewähren und nur den Teil des Verzeichnisbaums anzeigen, der benötigt wird. Standardgemäß heißt der Ordner user_upload.

Für Redakteure präsentiert sich der Verzeichnisbaum beispielsweise so:

Wie Ihr Verzeichnisbaum aussieht, hängt davon ab, für welche Verzeichnisse den Redakteuren Zugriffsrechte eingeräumt wurden und wie die einzelnen Ordner innerhalb des Projekts benannt wurden. Sofern erforderlich, ist gemäß vorstehender Abbildung zunächst das Verzeichnis Datenverzeichnis user_upload auszuklappen und danach das Verzeichnis für die Bilder, images. Dort befindet sich das von uns benötigte Bild im Ordner themenbilder, den wir durch Anklicken aktivieren. Daraufhin erhalten wir im rechten Bereich 02: Dateien alle Bilder des Ordners themenbilder angezeigt. Sollten hier nur die Bildnamen gelistet und keine Vorschaubilder angezeigt werden, so ist unter 03 die Option Vorschaubilder anzeigen auszuwählen. Sollten immer noch keine Bilder erscheinen, so ist vermutlich ImageMagick nicht installiert oder falsch konfiguriert worden – sprechen Sie in diesem Fall Ihren Systemadministrator darauf an.
 

02: Dateien:
Wird nur ein Bild benötigt, so ist einfach auf das Bild selbst oder alternativ auf den Bildnamen (z.B. img_mood_leistungen.jpg) zu klicken. Der TYPO3-Element-Browser wird geschlossen und der Name des Bildes erscheint im Feld Bilder. Wird die Seite abgespeichert, so wird im Anschluss auch ein kleines Vorschaubild angezeigt und das Bild erscheint im Frontend.

Werden mehrere Bilder benötigt, so können die Bilder über die entsprechende Checkbox ausgewählt und anschließend mit der Option Auswahl importieren in einem Rutsch in den Datensatz geladen werden.

Ist kein Bild ausgewählt, so wird mit der Option Auswahl umkehren dafür gesorgt, dass die Checkboxen aller Bilder aktiviert werden und sich auf diese Weise alle Bilder innerhalb des Ordners importieren lassen.

Über das Plus-Icon (+) links neben dem blauen Informations-Icon TYPO3 Icon: Leiste Info lässt sich das jeweilige Bild ebenfalls in den Datensatz laden. Positionieren Sie das Fenster des TYPO3-Element-Browsers so, dass Sie zugleich das Feld Bilder im Hauptfenster im Blick haben, so sehen Sie, dass beim Anklicken des Plus-Icons der entsprechende Bildname im Feld Bilder erscheint.

Durch Anklicken des blauen Info-Icons können Informationen zu jedem Bild angezeigt werden – der Dateiname, die Dateigröße, die Bildmaße und ggf. bestehende Referenzen auf das Bild.
 

03: Vorschaubilder anzeigen
Wahlweise kann die Darstellung mit Vorschaubildern erfolgen, um eine bessere visuelle Lokalisierung zu ermöglichen oder die Anzeige erfolgt ohne Vorschaubilder, was kürzere Ladezeiten zur Folge hat und insbesondere bei Ordnern mit sehr vielen Medieninhalten von Vorteil sein kann.
 

Mit dem TYPO3-Element-Browser Dateien auf den Webserver laden

04: Dateien hochladen
Befindet sich das benötigte Bild noch nicht in einem Verzeichnisordner, so kann es von der eigenen Festplatte (oder aus dem Netzwerk) per Durchsuchen lokalisiert und sodann auf den Webserver hochgeladen werden. Über 01: Verzeichnisbaum wird zunächst zu dem Ordner navigiert, in den das Bild hochgeladen werden soll. In unserem Beispiel ist das fileadmin/user_upload/images/themenbilder

Sollen mehrere Bilder in einem Rutsch auf den Server geladen werden, so stehen dazu drei Felder zur Verfügung. Nachdem die Bilder ausgewählt wurden, werden sie per Hochladen upgeloaded. Mit der Option Vorhandene Dateien überschreiben werden bereits vorhandene Dateien überschrieben, wenn sie denselben Namen haben. Ist diese Option nicht aktiviert, so wird das Bild nochmals auf den Server geladen und dem Namen eine Zahl angehängt (bild.jpg, bild_01.jpg, bild_02.jpg).

Tipp:

Löschen lassen sich vorhandene Bilder mit dem TYPO3-Element-Browser derzeit jedoch nicht. Dazu steht in TYPO3 die Dateiliste zur Verfügung.

Hinweis:

Es empfiehlt sich, die Bilder zunächst in einem Bildbearbeitungsprogramm zu optimieren und auf Webgröße anzupassen. Zwar verfügt TYPO3 über die Bordmittel (sofern ImageMagick oder die GD2-Library installiert sind), die Bilder für die Darstellung im Frontend kleiner zu rechnen. Sollten die Originalbildvorlagen jedoch mehrere Megabyte groß sein, so verlängert sich entsprechend die Zeit für den Bildupload und – bei einem großen Medienumfang – es wird unnötig viel Speicherplatz auf dem Server verbraucht.

05: Neuer Ordner bzw. neue Datei
Über 01: Verzeichnisbaum wird zunächst zum dem Ordner navigiert, in dem ein neuer Ordner angelegt werden soll. In unserem Beispiel ist das fileadmin/user_upload/images/themenbilder

Anschließend wird im entsprechenden Eingabefeld der Ordnername vergeben und der Button Ordner anlegen angeklickt.

BLÄTTERN INNERHALB DER AKTUELLEN RUBRIK

  • VORHERIGE SEITE
  • NÄCHSTE SEITE
  • «
  • »
 
Feedback zur TYPO3 Webagentur und Webdesign, Köln