TYPO3 Extension multicolumn richtig nutzen
April 28, 2011 | Posted by Rainer Fischinger | TYPO3 Wissen Tags: extension, multicolumn, spalten, Tipps, Tricks, typo3
Um einzelne TYPO3-Seiten ohne viel Aufwand in mehrere Spalten zu unterteilen, bietet sich die Extension multicolumn (Link zum TER) an. Die Einstellung bzw. Anpassung an die individuellen Bedürfnissen ist optimal möglich, sofern man richtig damit umgehen kann. Deswegen möchte ich hier eine kurze Anleitung geben.
Zuerst legt man in der betreffenden Seite ein neues Inhaltselement vom Typ “Mehrspalten-Container” an. Dieses lässt sich dann in beliebig viele Spalten unterteilen und selbst in jeder Spalte können wieder Mehrspalten-Container untergebracht werden. Hat man den Container angelegt, wechselt man in den Karteireiter “Konfiguration” des Inhaltselement “Mehrspalten-Container” und dort in den Unter-Karteireiter “Erweiterte Layouts“. Hier können eigene Spalten-Layouts definiert werden.
Folgende Defintionen sind möglich:
- Anzahl der Spalten
- Breite des gesamten Containers
- Breite der einzelnen Spalten
- Padding der Spalten
- Margin (Abstand) der Spalten
Die Breite des gesamten Containers, sowie die Breite der einzelnen Spalten kann per Drop-Down Auswahl in Pixel oder auch Prozent angegeben werden. Das Padding sowie die Abstände (margin) werden mit so genannten “optionSplits” angegeben. Diese sind für viele Funktionen in TYPO3gültig, so auch hier bei multicolumn. OptionSplits funktionieren folgendermaßen: Zuerst definierte man das erste Objekt (in unserem Fall die erste Spalte), danach kommt ein Trennzeichen “|*|”, dann kommen optional 0-n mittlere Bereiche (jeweils wieder mit dem Trennzeichen) und zum Schluss das letzte Objekt.
Ein optionSplit für eine 3 Spalten würde also folgendermaßen aussehen:
Dies würde bedeuten, dass die erste Spalte 300px breit ist, die mittlere 400px und die dritte wieder 300px. Will man jedoch nur die erste und letzte Spalte definieren, würde der optionSplit so aussehen:
Damit wird die erste und letzte Spalte 300px breit, der mittlere Bereich (egal ob das eine oder mehrere Spalten sind) passt sich an.
Ein optionSplit für fünf Spalten würde wie folgt aussehen:
Will man die erste und letzte Spalte jeweils 300px breit machen, die mittleren aber alle 100px breit, so reicht folgender Code:
Der mittlere Bereich des optionSplits wird für sämtliche Objekte zwischen dem ersten und dem letzen Objekt übernommen!
Für Padding und Margin wird genau gleich vorgegangen. Wichtig hierbei ist, dass alle Werte mit einer Einheit versehen werden müssen (px) und gemäß CSS-Anweisung jeweils die Werte für Oben, Rechts, Unten, Links angegeben werden (immer in dieser Reihenfolge). Will man zB. jede der drei Spalten rechts um 5px padden, sieht der Code folgendermaßen aus:
Bei Padding und Margin werden also ebenfalls mit dem optionSplit zuerst der Wert für das erste Objekt angegeben, danach der oder die mittleren Werte und zum Schluss der Wert für das letzte Objekt. Wer alle Funktionsmöglichkeiten des optionSplits wissen möchte, kann sich in der deutschen TSRef schlau machen. Hier noch ein Beispielbild, wie eine fertige Konfiguration eines dreispaltigen Containers aussehen könnte:
Spalteneinstellung für einen multicolumn 3-Spalten-Container
Loading ...
[...] man multicolumn richtig einstellt, haben wir in einem eigenen Artikel “Typo3 Extension multicolumn richtig nutzen” [...]
[...] Je nach Umfang des Webprojekts kann man sich hier mit kleinen Extensions behelfen, wie zum Beispiel multicolumn. Wer nur einige Unterseiten anpassen muss, kann mit dieser TYPO3-Erweiterung problemlos [...]
Danke Rainer, hat mir sehr geholfen.
Mein Fehler war: Ich hatte zwischen Pipe und Sternchen Leerstellen. Das hat dann bei mir nicht geknappt.
@Rainer: Vielen Dank für die Anleitung. Wie kann ich die TYPO3 ext multicolumn responsive machen? Gibt es dazu schon eine Lösung?
Noch gibt es dafür keine Lösung. Multicolumn ist mMn eher ein Ersatz, wenn das Template keine Spaltenmöglichkeiten gibt (vor allem Templates, die nicht auf TemplaVoila setzen). Für responsive Columns würd ich den Ansatz der Seite von Grundauf überdenken und das so gestaltet. Wie gesagt, multicolumn ist eher ein nachträglicher Einbau der Spaltenmöglichkeit für TYPO3.