TYPO3 Extension multicolumn richtig nutzen
April 28 | 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:





[...] man multicolumn richtig einstellt, haben wir in einem eigenen Artikel “Typo3 Extension multicolumn richtig nutzen” [...]