TYPO3 bietet die Möglichkeit, für die Platzierung von Container, definierte Vorlagen zu verwenden. In diesem Abschnitt beschreiben wir anhand von drei Beispielen, wie diese Vorlagen genutzt werden und welche Auswirkungen diese auf die Darstellung im Frontend haben. Sie können das „Frontend-Layout“ und „Backend-Layout“ beliebig kombinieren. Testen Sie es. Sie werden nichts „zerstören“.
011 - Unter "Erscheinungsbild“ werden die definierten Layouts angezeigt. TYPO3 bietet von Haus aus lediglich die Vorlage „Standard“. Diese Vorlage beinhaltet die Contents „Links“, „Normal“, „Rechts“ und „Rand“.
Wir haben die Auswahl der Layouts erweitert.
021 - Für für „Frontend-Layout“ haben wir zwei Breiten definiert. Dies sind:
022, 023 & 024 - Unter Backend-Layout können Sie zwischen 15 unterschiedlichen Anordnungen von Containern wählen. Von oben links nach unten rechts sind dies:
Die grauen Balken in den Layouts bedeutet, dass für diese Contents ein Hintergrundbild (Banner) eingebunden werden kann. Das Banner wird die komplette Breite der Seite einnehmen. (Eine Anleitung im Umgang mit dem Banner finden Sie auf dieser Seite.)
Die horizontalen Linien symbolisieren das Untermenü. Bei der Wahl eines solchen Layouts werden die Menüs der entsprechenden Seite ohne weiteres Zutun an entsprechender Stelle aufgebaut. Unterhalb des Menüs können Sie weitere Inhalte positionieren.
031 - Sie können das Layout entweder über das Pulldownmenü „2 Spalten 50%:50%“ wählen oder das entsprechende Icon mit der linken Maustaste anklicken.
032 - Wollen Sie das Layout an die Unterseiten vererben, wählen Sie rechtsseitig das entsprechende Layout. Auch wenn Sie ein Layout auf Unterseiten vererben, können Sie in einer gewünschten Unterseiten das Layout wechseln. Die Einstellungen einer Unterseite überwiegt eine Vererbung.
033 - „Speichern & Schliessen“ Sie die Konfiguration.
041 & 042 - Im Arbeitsbereich wird die Einteilung des gewählten Layouts angezeigt. Die Titel der einzelnen Contents (in diesem Beispiel 041 „Main Content“ & 042 „Rechte Spalte“) ist direkt abhängig vom gewählten Layout.
Bestücken wir die Contents mit Inhalten. Im „Main Content“ werde ich einen Container, im Content „Rechte Spalte“ zwei Container platzieren. (Anmerkung: Die Textpassagen stammen aus Wikipedia und werden hier nur zwecks Demonstration verwendet.)
071 - Im Pulldownmenü „Spalte“ werden die Contents aufgelistet, welche im gewählten Layout zur Verfügung stehen. Hier wählen wir für dieses Beispiel „Main Content“ für die Hauptspalte.
072 - Mittels „Speichern & Schliessen“ übernehmen wir die Anpassung.
Mit dem Container „Curacao“ verfahren wir analog.
Die Seite soll wie folgt aufgebaut werden:
Da die einzelnen Schritte bereits in den zwei vorherigen Beispielen ausführlich beschrieben wurden, werden wir für das dritte Beispiel lediglich noch Printscreens mit entsprechenden Markierungen einsetzen.