Container
Was ist ein Container?
Container im TYPO3-CMS sind eine wesentliche Funktion, die es ermöglicht, Inhalte strukturierter und organisierter zu gestalten. Sie dienen als übergeordnete Elemente, die mehrere Inhaltselemente gruppieren können. Container sind besonders nützlich, um komplexe Layouts zu realisieren und verschiedene Arten von Inhalten auf einer Seite zu verwalten.
Die Vorteile der Verwendung von Containern im TYPO3 sind:
- Organisierte Struktur: Container bieten eine klare Hierarchie und Struktur für Ihre Inhalte. Durch die Gruppierung verschiedener Elemente in einem Container wird die Verwaltung von komplexen Layouts erleichtert und sichergestellt, dass der Inhalt übersichtlich und gut organisiert bleibt.
- Einfache Verwaltung: Mit Containern können Sie mehrere Inhaltselemente gleichzeitig bearbeiten, verschieben oder kopieren. Dies spart Zeit und Mühe bei der Bearbeitung von Seiten mit vielen Inhalten, da Änderungen konsistent und effizient umgesetzt werden können.
- Flexibilität im Design: Container ermöglichen individuelle Gestaltungsmöglichkeiten. Sie können verschiedene Layoutstile und Designs anwenden und flexibel anpassen, um den visuellen Anforderungen Ihrer Website gerecht zu werden.
- Responsive Layouts: Durch die Verwendung von Containern können Sie sicherstellen, dass Ihre Inhalte auf verschiedenen Geräten, wie Desktop-Computern, Tablets und Smartphones, optimal angezeigt werden. Container unterstützen die Erstellung von responsiven Designs, die eine einheitliche Benutzererfahrung auf allen Plattformen gewährleisten.
- Wiederverwendbarkeit: Container können als wiederverwendbare Vorlagen gespeichert werden, welche auf verschiedenen Seiten oder sogar an verschiedenen Stellen der gleichen Seite verwendet werden können. Das spart Bearbeitungszeit und stellt sicher, dass das Design konsistent bleibt.
Insgesamt sind Container im TYPO3 eine leistungsstarke Methode zur Organisation und Darstellung von Webinhalten. Sie bieten Flexibilität, Effizienz und eine verbesserte Benutzererfahrung.
Darstellungsvarianten von Containern
- Variante 1: Zweispaltiger Container 50:50 - ein Container mit zwei gleich breiten Spalten
- Variante 2: Zweispaltiger Container 33:66 - ein Container mit zwei Spalten, die rechte doppelt so breit wie die linke
- Variante 3: Zweispaltiger Container 66:33 - ein Container mit zwei Spalten, die linke doppelt so breit wie die rechte
- Variante 4: Dreispaltiger Container - ein Container mit drei gleich breiten Spalten
- Variante 5: Vierspaltiger Container - ein Container mit vier gleich breiten Spalten
- Variante 6: Fünfspaltiger Container - ein Container mit fünf gleich breiten Spalten
Funktionen auf einen Blick
- Mit Containern können im Inhaltsbereich einer Seite mehrere Elemente nebeneinander in zwei bis fünf Spalten dargestellt werden.
- Die Elemente können flexibel innerhalb des Containers per Drag & Drop zwischen den Spalten verschoben werden.
- Damit der Container sichtbar wird, müssen mindestens zwei Elemente darin sichtbar geschaltet sein, ansonsten wird der Container in der Nutzeransicht ausgeblendet.
- Das Verhalten von Containern ist sehr flexibel: Wird ein Element in einer Spalte deaktiviert oder ist eine Spalte leer, so wird der Platz in der Nutzeransicht von den verbliebenen Elementen im Container aufgefüllt. Mindestens zwei Elemente müssen aber immer sichtbar gestellt sein, damit der Container in der Nutzeransicht sichtbar wird.
- Pro Spalte kann immer nur ein Inhaltselement eingefügt werden. Für mehrere Elemente untereinander benötigt man also jeweils einen neuen Container.
- Der ToTop-Link wird für Elemente innerhalb von Containern ausgeblendet. Container selbst erlauben aber ToTop-Links. Diese stehen jeweils unter dem Container.
- Die Überschriften von Elementen in Containern sind per default in der Nutzeransicht ausgeblendet.
- In Containern werden auch keine Verlinkungen von Überschriften angezeigt.
- Container sind nur in der Inhaltsspalte und nicht in der Nachrichtenspalte erlaubt.
Erlaubte Inhaltselemente in Containern
- Überschrift
- Text
- Text mit Bild
- Teaser-Karte
- Link-Karte
- Akkordeon
- Audio-Element
- Video-Element
- Element für Video.UP
- ORCID
Nicht erlaubte Inhaltselemente in Containern
- weitere Container
- Powermail
- Anmeldeformular
- Tabelle
- Trenner
- Datensatz
Weiterhin sind aktuell Elemente nicht erlaubt, neben die ein Text gestellt werden kann. Diese Elemente werden zunächst überarbeitet und zu einem späteren Zeitpunkt für Container freigegeben:
- Kontaktbox
- Textbox
- Zitatbox
- Galerie
Anlegen von Containern
Wenn Sie ein neues Inhaltselement anlegen, finden Sie nun den neuen Reiter für "Container" zwischen "Typischer Seiteninhalt" und "Formulare". Wählen Sie hier eine Darstellungsvariante aus. Diese können Sie später zu jeder Zeit auch wieder ändern.
Füllen Sie das Feld "Überschrift" aus und speichern Sie das Element.
Je nach Darstellungsvariante bekommen Sie nun die zur Verfügung stehenden Spalten angezeigt. Befüllen Sie die Spalten mit den gewünschten Elementen. Erst wenn mindestens zwei Spalten mit sichtbar gestellten Elementen befüllt sind, wird der Container in der Nutzeransicht angezeigt.
Im Beispiel wurde ein zweispaltiger Container 50:50 eingefügt, also ein Container mit zwei gleich breiten Spalten.
Befüllen Sie die Spalten mit den angezeigten Inhaltselementen. Andere als die angezeigten Elemente sind für den Einsatz in Containern nicht zulässig.
Bitte beachten Sie: Sie sind in der Darstellung Ihrer Inhalte relativ frei. Dennoch kommt auf Sie die Verantwortung zu, das System in seinen Möglichkeiten so einzusetzen, dass ein aus Nutzersicht bestmögliches Erleben der Webseiten erreicht wird.
Sobald Sie alle Elemente eingefügt und sichtbar gestellt haben, wird der Container in der Nutzeransicht dargestellt. Beachten Sie, dass kopierte Elemente zunächst unsichtbar gestellt sind und prüfen Sie, dass sowohl alle Elemente im Container, als auch der Container selbst sichtbar geschaltet sind.
Sollten Sie die Darstellung der Spalten im Container ändern wollen, können Sie auch den Container selbst zu jeder Zeit bearbeiten.
- Wenn Sie die Anzahl der angezeigten Elemente innerhalb eines Containers verringern möchten, können Sie die nicht benötigten Elemente ausblenden oder löschen.
- Die Darstellung von Containern in der Nutzeransicht richtet sich immer nach der tatsächlichen Anzahl der sichtbar gestellten Elemente innerhalb eines Containers im TYPO3-Backend.
- Wird ein Element in einer Spalte deaktiviert oder ist eine Spalte leer, so wird der Platz in der Nutzeransicht von den verbliebenen Elementen im Container aufgefüllt.
- Das heißt: Wenn ein fünfspaltiger Container im TYPO3-Backend nur drei sichtbar gestellte Elemente enthält, so wird im Frontend ein dreispaltiger Container angezeigt.
Unbenutzte Elemente
- Um Darstellungsfehler zu vermeiden, empfehlen wir nicht benötigte Elemente im Container zunächst zu löschen, bevor ein Container umgewandelt wird und seine Spalten reduziert werden (z.B. von fünf Spalten auf drei).
- Tun Sie dies nicht, werden automatisch die überflüssigen Elemente aus dem Container herausgeschoben (im Beispiel "Mittlere rechte Spalte" und "Rechte Spalte", also die vierte und die fünfte Spalte von links) und im TYPO3-Backend als "unbenutzte" Elemente am Seitenende der bearbeiteten Seite angezeigt.
- Solche Elemente sind umgehend zu löschen um Darstellungsfehler zu vermeiden.
Verschieben von Elementen in Containern
Nachdem Sie ein Inhaltselement aus einem Container in einen anderen verschoben haben, müssen Sie die Seite aktualisieren, damit TYPO3 die Änderung vollständig verarbeitet. Das Aktualisieren der Seite sorgt dafür, dass die Struktur aktualisiert wird und alle Positionen korrekt erfasst werden. Erst danach können Sie problemlos ein neues Element an die freigewordene Stelle einfügen.
Im Beispiel soll die Teaser-Karte in der Rechten Spalten in einen anderen Container verschoben werden. Verschieben Sie das gewünschte Inhaltselement per "Drag & Drop" in den anderen Container.
Wenn man ein Element mit Drag & Drop verschiebt, muss der Hintergrund des Bereiches, in den man es verschieben möchte, grün aufleuchten. Erst dann „findet das Element seinen Platz“.
In die Rechte Spalte kann nun aktuell kein neues Element hinzugefügt werden. Aktualisieren Sie die Seite im Backend von TYPO3, damit TYPO3 die Änderung vollständig verarbeitet (durch Drücken der „Aktualisieren“-Taste Ihres Browsers oder der Funktion zum Neuladen in TYPO3). Das Aktualisieren der Seite sorgt dafür, dass die Struktur aktualisiert wird und alle Positionen korrekt erfasst werden.
Nach dem Aktualisieren der Seite können Sie wieder ein neues Inhaltselement an der freigewordenen Stelle hinzufügen.