WordPress & Webwork

WordPress: unterschiedliche CSS-Regeln für Unterseiten dank body_class()

Wie kann man in WordPress den Unterseiten, Archiven etc. unterschiedliche CSS-Regeln bzw. Layouts vergeben?

WordPress-Icon In WordPress existiert mit dem Template-Tag body_class(), welches mit WordPress 2.8 eingeführt wurde, eine sehr einfache Möglichkeit um der Website, je nach Zustand und je nach Unterseite, unterschiedliche CSS-Regeln und somit auch ein separates Layout zu spendieren.

Spendiert man dem eigenen WordPress-Theme folgenden Code…

<body <?php body_class(); ?>>

… dann generiert WordPress dann in der HTML-Ausgabe, je nach Unterseite und je nach Zustand eine Reihe von Klassenwerten, zum Beispiel:

<body class="single single-post postid-7470 single-format-standard logged-in">

Wie man an dem letzten Attributs-Wert logged-in sieht, erkennt WordPress hierbei auch ob ein eingeloggter Nutzer sich die Website anschaut.

Somit hat man dann als Entwickler eine ordentliche Anzahl an CSS-Selektoren um bei Bedarf Anpassungen pro Unterseite oder Zustand zu bewerkstelligen:

/* Layout für eingeloggte Nutzer */
.logged-in          { ... }

/* Anpassungen für Seiten-Templates */
.page-template      { ... }

/* Anpassungen in der Kategorie WordPress */
.category-wordpress { ... }

[...]

Also eine Anpassung aus der Reihe: Aufwand klein, Nutzen groß.