Text mit Bildern

Um Ihrer Seite Text und Bilder hinzuzufügen, die inhaltlich zusammengehören und/oder nebeneinander stehen sollen, erstellen Sie an der gewünschten Stelle durch Klick auf den Button "+ Inhalt" ein neues Inhaltselement.

Wählen Sie den Typ "Text & Bilder" aus. Wählen Sie dieses Element nur aus, wenn Sie tatsächlich auch ein Bild hinzufügen möchten. Ansonsten wählen Sie bitte das Inhaltselement "Text".

Hier werden nur die wichtigsten Eingabefelder erklärt:

1. Wählen Sie den Reiter "Allgemein" aus.
2. Fügen Sie eine Überschrift ein. Mit der Schaltfläche Typ können Sie den Überschriftentyp ändern oder die Überschrift verbergen.
3. Verwenden Sie den Texteditor. Hier können Sie Ihren Text auch formatieren.

1. Wechseln Sie zum Reiter "Bilder".
2. Klicken Sie dort auf "Bild hinzufügen".

Falls Ihr Bild schon in TYPO3 vorhanden ist, weil Sie es vorher in der Dateiliste hochgeladen haben:

1. Auf der folgenden Seite erscheint links der Dateibaum.
   Wählen Sie dort den Ordner aus, in dem das Bild liegt und wählen sie es aus.
   Die weiteren Schritte sehen Sie weiter unten in dieser Anleitung.

Falls Ihr Bild noch nicht in TYPO3 vorhanden ist:

1. Wählen Sie im Dateibaum links den Ordner aus, in den Ihr Bild gespeichert werden soll.
2. Klicken Sie in diesem Bereich auf den Button "Dateien auswählen".
   In einem Fenster wird Ihnen nun Ihr Dateiexplorer (oder Finder) angezeigt. Rufen Sie dort den Pfad auf, in dem Ihr Bild liegt und wählen Sie es aus. Das Bild wird dann direkt in den Ordner geladen. Sie können auch mehrere Bilder gleichzeitig auswählen. Sie werden dann alle gleichzeitig hochgeladen.

1. Neben dem Button "Dateien auswählen" erscheint jetzt der Name der Datei.
   Falls Sie mehrere Dateien gleichzeitig ausgewählt haben, erscheint hier die Anzahl der Dateien.
2. Stellen Sie nochmal sicher, dass der Ordner ausgewählt ist, in den das Bild gespeichert werden soll.
3. Falls Sie gerade eine veränderte Version eines schon vorhandenen Bildes hochladen wollen, setzen Sie hier ein Kreuz. Ansonsten lassen Sie dieses Feld bitte frei, damit nicht versehentlich Bilder gelöscht werden.
4. Klicken Sie nun auf "Dateien hochladen".

Im Verzeichnis des Dateibaums sollte das Bild jetzt erscheinen. Das Verzeichnis ist alphabetisch geordnet, ggf. müssen Sie zu dem Bild scrollen.

Klicken Sie den Namen des Bildes an.

Jetzt ist das Bild in Ihre Seite übernommen. Um das Bild weiter anzupassen, klicken Sie auf den kleinen Pfeil links neben dem Vorschaubild.

1. Fügen Sie hier einen erklärenden Text ein.  Dieser Text beschreibt, was auf dem Bild zu sehen ist und ist z.B. hilfreich für die Seitendarstellung mit Screenreadern oder wenn das Bild nicht geladen werden kann. Siehe auch die Hinweise zur Barrierefreiheit.
2. Fügen Sie ggf. eine Bildunterschrift hinzu.
3. Sie können dem Bild auch einen Link hinzufügen.
4. Wenn Sie hier einen Titel eintragen, dann wird er innerhalb des Bildes angezeigt. Der Titel wird im TUHH-Webdesign üblicherweise für das Copyright genutzt.
5. Mit dem Editor können Sie den angezeigten Bildausschnitt anpassen.

1. Sie können das Bild über, unter oder neben Ihrem Text platzieren. Wählen Sie dazu im Reiter "Bilder" die Einstellungen unter Position und Ausrichtung.
   • Neben dem Text = Text und Bild im Verhältnis 50:50
   • Im Text = Text und Bild im Verhältnis 2/3 zu 1/3. Bei längeren Texten umfließt der Text das Bild.
2. Die Bilder werden im TU-Webdesign standardmäßig mit eine grafischen Illustration hinterlegt. Das System wählt diese automatisch anhand der Maße des hochgeladenen Bildes (Quer- oder Hochformat). Sie können die Illustration händisch anpassen oder ganz entfernen.
3. Die Breite des Bildes können Sie nicht mehr unter "Medienanpassung" selbst verändern. Das Bild wird in einer Standardgröße ausgegeben, um sowohl ein einheitliches Layout als auch die optimale mobile Darstellung zu gewährleisten.
4. Zwei Bilder nebeneinander können Sie darstellen, indem Sie den Wert der Anzahl der Spalten auf 2 setzen. Eine dreispaltige Ausgabe ist nicht möglich. Diese Einstellung funktioniert nur in Kombination mit der Position Neben dem Text. Eine Hintergrundillustration wird dann nicht ausgegeben. Sie können beliebig viele Bilder hinzufügen, die dann in zweispaltiger Ansicht dargestellt werden - siehe Beispiel unten.
5. Sollen sich die Websitebesucher*innen per Klick das Bild in Originalgröße ansehen können, aktivieren Sie diesen Regler.

Besondere Bilddarstellungen wie, z.B. ein Imageslider oder ein Imagegrid zur Darstellung mehrerer Bilder in einem ansprechenden Layout stehen nicht für "Text und Bild" zur Verfügung, sondern nur im Element "Bilder".