Een tijdje terug heeft Nathan Rice hier ook al over geschreven, maar voor de mensen die dat nog niet wisten (en/of niet zo goed in Engels zijn) gaat deze post over de body_class functie die in WordPress 2.8 is toegevoegd.
De WordPress Codex heeft er nog geen informatie over, maar hij bestaat in twee varianten: body_class en get_body_class. De body_class functie echo’ed de inhoud meteen, de get_body_class returned de inhoud in een Array. In principe zijn deze functies dus aan elkaar gerelateerd als the_title aan get_the_title en the_content aan get_the_content).
Maar waar zijn ze nu eigenlijk voor? Om bijvoorbeeld elke pagina een andere achtergrond te geven, of op een bepaalde pagina #content minder (of juist meer) breed te maken en daar ook #sidebar op aan te passen.
Hoe dat dan precies werkt? Heel simpel. Het enige dat je hoeft te doen is je header.php te openen (of een andere template-bestand waar je de tag in hebt staan) en van deze tag het volgende te maken:
<body <?php body_class(); ?>>
De output is dan iets als het volgende (van de indexpagina van illutic.nl geplukt:
<body class="home page page-id-8 parent-pageid-0 page-template page-templage-_tpl-home-php logged-in">
Zoals je kan zien staat er erg veel informatie in. En om het makkelijk te houden hieronder een klein overzicht van wat het nu allemaal betekent:
- home deze pagina is de homepagina
- page deze is een pagina (en geen post)
- page-id-8 het ID van deze pagina is 8
- parent-pageid-0 het ID van de parent van deze pagina
- page-template deze pagina maakt gebruik van een custom page template
- page-template-_tpl-home-php de bestandsnaam van deze custom page template is _tpl.home.php
- logged-in toen ik de pagina bekeek was ik ingelogd
Als je bekend met CSS zul je begrijpen dat dit je ongelooflijk veel mogelijkheden geeft om elke pagina een totaal ander uiterlijk te geven. Nu bestond er al de post_class functie die je aan #content mee kon geven (al kon je die ook overal neerzetten waar je maar wou, maar daar was deze voor bedoelt), maar de body_class geeft je veel meer mogelijkheden.
Browser specifieke classes
Wat ook erg leuk is, is dat je zelf classes toe kunt voegen aan de output van body_class door middel van rechtsreeks in de functie zetten (body_class(‘eigen-class’)), maar ook door een stukje code in je functions.php te zetten die gebruik maakt van de body_class filter.
Dit komt ook bij Nathan Rice weg (Browser Detection and the body_class() function). Met behulp van de code die hij daar opgeeft wordt de naam (ongeveer) van de browser (v/d bezoeker) toegevoegd. Op die manier kun je dus zonder allerlei hacks toch browser-specifieke CSS gebruiken!
