Der ui/Theme-Builder macht das Erstellen schöner, responsiver Layouts in Joomla! mithilfe von Drag & Drop kinderleicht. Aber viele Leute scheitern daran, komplexere Layouts zu erstellen. Dies betrifft vor allem Fälle, in denen mehrere Zeilen mit unterschiedlichen Spaltenanzahlen innerhalb derselben „Abschnitte“ benötigt werden.

So erstellst du komplexe Spaltenstrukturen in einem Abschnitt.

Klicke auf das Spaltensymbol rechts im zu bearbeitendem Abschnitt. Hier kannst du zwischen vordefinierten Spalten wählen oder eigene Spaltenbreiten eingeben.

Nutze die Spaltenbreiten aus der UiKit Width-Komponente. Zum Beispiel: Gib "1-2" für die halbe verfügbare Breite oder "auto" für eine automatische Breite ein, die sich am Inhalt orientiert. Trenne die Spaltenbreiten mit einem „;“.

Hier ist ein kurzes Beispiel, das ich zusammengestellt habe, um zu zeigen, was ich meine:

• 1 Spalte, z. B. für eine Überschrift
• 2 Spalten, z. B. für Inhalte („2-3“ – Das Element nimmt zwei Drittel des übergeordneten Containers ein, und „expand“ – Das Element füllt den verbleibenden Platz im Grid-Container.)
• 1 Spalte, z. B. für einen Button oder Ähnliches...

Um diese Spaltenstruktur zu erstellen, gib einfach 1-1;2-3;expand;1-1 ein. Das war's ;-)