Trick # 352 | Dieser Beitrag beinhaltet 1159 Wörter. – Geschätzte Lesezeit: ca. 6 Minuten.
Wieviele Spalten benötigen Sie auf Ihrer Divi-Website? 4, 5 oder 6? Der Builder bietet von Haus aus etwa alle Spalten-Variationen, welche das Herz begehrt. Doch bei 6 ist Ende Gelände. Ausser Sie greifen zu unserem heutigen Trick. Dann können es gerne auch 7, 8 oder 9 Spalten – allenfalls sogar deren 12 sein.
Im Divi-Theme können Sie standardmässig 1- bis maximal 6-spaltige Zeilen anlegen. Hier ein 6-Spalten-Design:
1
2
3
4
5
6
Doch da geht noch mehr. 7-, 8-, 9-, 10-, 11- oder 12-spaltige Designs lassen sich einrichten. Dafür benötigen Sie einen kleinen Block CSS-Code für das CSS-Stylesheet Ihrer Website. Sie können diesen unter Design/Customizer/Zusätzliches CSS einfügen:
.twelve-columns .et_pb_module {width: 8.33%; float: left;}
.eleven-columns .et_pb_module {width: 9.09%; float: left;}
.ten-columns .et_pb_module {width: 10%; float: left;}
.nine-columns .et_pb_module {width: 11.11%; float: left;}
.eight-columns .et_pb_module {width: 12.5%; float: left;}
.seven-columns .et_pb_module {width: 14.28%; float: left;}
Nun fügen Sie eine einspaltige Zeile hinzu. Bearbeiten Sie die Zeile, wechseln Sie auf den Tab «Erweitert», dann auf «CSS-ID und Klassen» und fügen Sie den gewünschten Klassennamen aus dem CSS-Code ins Textfeld «CSS-Klasse» ein. Für ein 10-spaltiges Design etwa «ten-columns», für ein achtspaltiges «eight-columns».
Nun fügen Sie die passende Anzahl Module untereinenader in die Divi-Zeile ein. Also 8 Module bei einem 8-Spalten-Design, 9 für 9-spaltige Ansichten usw.
Voilà das war’s auch schon: Wir haben hier ein Muster für eine 10-Spalten-Ansicht parat:
1
2
3
4
5
6
7
8
9
10
Recht einfach. Oder?
Werbung