Seite mit zwei Sidebars

Text stimmt nicht mehr nach Björns Spalten-Copy-Trick!! Muss überarbeitet werden! Spaltenaufteilung bereits korrigiert!

Jetzt wird es in Sachen Template-Konstruktion völlig abstrus! Warum? Weil der Spalten-Block maximal sechs Spalten zulässt!!!
Augenscheinlich sind die Entwickler alle sehr jung und können mit den alten 960ger-Grid-Systemen nichts anfangen! Die gab es mit Spalten-Konstruktionen bis zu 24 Spalten, die natürlich in erster Linie zu einer fein graduierten Layout-Gestaltung genutzt wurden – und nicht wirklich 24-spaltige Inhalte dargestellt haben. Wie auch immer – sechs Spalten sind zu wenig, weil eine Seite mit zwei Sidebars in der neuen Template-Bauart sieben Spalten benötigen würde!

Daraus ergibt sich, dass hier statt mit sieben nur mit fünf Spalten gearbeitet werden kann und die beiden Sidebars jeweils in einer Spalte sitzen, in der wiederum ein Spalten-Block mit zwei Spalten enthalten ist – eine für die Sidebar(s), die zweite (bzw. erste Spalte) für den Abstand zum Screen-Rand:

  • Spalte 1 – linker Abstand zum Screen-Rand = 10%
  • Spalte 2 – Sidebar left = 15%
  • Spalte 3 – Abstand-Spalte 3%
  • Spalte 4 – Seiten-Titel und Inhalt = 47%
  • Spalte 5 – Abstand-Spalte 3%
  • Spalte 6 – Sidebar rechts = 15%
  • Spalte 7 – rechter Abstand zum Screen-Rand = 10%

Überarbeitet: In der Addition ergibt sich also eine Gesamtzahl von lediglich 103% – mit diesen Werten läuft die Seite genauso breit, wie die Seiten mit nur einer Sidebar. Wir erinnern uns: Hier ergaben sich in der Addition 105%. Legt man die Seite mit zwei Sidebars auch mit 105% an, läuft sie etwas breiter als die beiden anderen Seiten-Templates. Im Ergebnis waren mehrere Versuche nötig, um die gleiche Breite zu erreichen – die Ergebniskontrolle konnte nur mit Photoshop erfolgen. Mit Logik kommen wir hier leider nicht weit.

Besonders ärgerlich hierbei ist zum Einen, dass das Konstrukt völlig unübersichtlich wird – das versteht kein Laie mehr. Zum anderen dürfte es damit völlig unmöglich werden, dass Seiten mit einer Sidebar und die mit zwei Sidebars im Frontend die gleiche Breite erhalten, da die ganzen Prozentangaben plus die relative Aufteilung durch das Flex-Modell responsive so gut wie nie auf die gleichen Berechnungswerte kommen dürfte. Das ist nicht getestet, erscheint mir aber logisch.

Dennoch: Um im System zu bleiben, scheint diese Vorgehensweise die einzig mögliche zu sein. Natürlich hatte ChatGBT keine funktionierende Antwort darauf, wie sich der Spalten-Block auf sieben Spalten erweitern ließe und in den Docs steht dazu natürlich auch nichts.

Wichtig zu wissen

Die Konstruktions-Klassen bleiben die gleichen, d.h.:

  • Die Gruppe in Spalte 3 erhält das <main> Tag.
  • Die Spalten direkt über den Sidebars (NICHT die der Spalten-Block in den Spalten 1 und 5!!) erhalten eigene Klassen:
    • sidebar-left für die linke Sidebar
    • sidebar-right für die rechte Sidebar

In den Templates page-sidebar und page-sidebar-left haben die Spalten über den Sidebars die Klasse sidebar, sodass alle drei Sidebars separat targetiert werden können.