Hoe plaats je een dynamische sidebar in een WordPress theme?
Je kunt een mooie WordPress layout maken, of ergens gratis vinden, maar dan ben je er vaak nog niet. Soms krijg je bijvoorbeeld de melding dat de betreffende layout een dynamische sidebar mist. Een dynamische sidebar is een zijbalk waarin je widgets kunt plaatsen.
Met widgets kun je je WordPress website eenvoudig beheren en interactief maken.
Widgets beheren
Op deze website bijvoorbeeld is de linkerkant een zijbalk met verschillende widgets, te beheren vanuit het dashboard.
Wanneer deze sidebar niet opgenomen is in je layout, dan zul je deze dus ook niet tegenkomen in je beheer systeem en kun je de widgets niet gebruiken.
In deze tutorial laat ik je zien hoe je eenvoudig een of meer sidebars kunt toevoegen aan je WordPress theme.
Sidebars in functions.php
Het eerste wat nodig is, is dat je aan WordPress vertelt dat je een sidebar in je layout plaatst. Dit doe je in het bestand functions.php. Dit bestand kun je vinden in de map van je layout (theme).
Mocht functions.php niet in de map van je layout staan dan kun je dit bestand zelf aanmaken en in de betreffende map plaatsen. Je kunt dit ook voor andere doeleinden gebruiken dus de kans is groot dat dit bestand al aanwezig is.
Code in functions
Vervolgens plaats je de volgende code in functions.php
Mocht je meer dan een sidebar willen toevoegen, dan zet je de volgende code in dit bestand:
Je kunt ook aangeven in de code dat er, in plaats van de normale opzet, aan de hand van ongeordende lijsten (ul), op een andere manier code wordt geplaatst in de sidebar. Bijvoorbeeld een h3 koptekst. dat doe je als volgt:
'', 'after_widget' => '', 'before_title' => '', 'after_title' => '
', )); ?>
Bij meerdere sidebars kun je ook verschillende namen gebruiken voor de sidebar en dan maak je de code:
'sidebar1', 'before_widget' => '', 'after_widget' => '', 'before_title' => '', 'after_title' => '
', )); register_sidebar(array('name'=>'sidebar2', 'before_widget' => '', 'after_widget' => '', 'before_title' => '', 'after_title' => '
', )); ?>
Code in de layout
De volgende stap is om de sidebars daadwerkelijk in je layout te gaan plaatsen. Dit kan op elke willekeurige plek. Je moet er natuurlijk wel rekening mee houden dat het plek in neemt en dat je de css bestanden aanpast naar hoe jij dat wilt.
De code dan maar.
Voor de eerste sidebar is dat:
De tweede sidebar krijgt dan logischerwijs de code:
Inhoud aan dynamische sidebar toevoegen
Tenslotte is het ook nog mogelijk om de sidebar ook nog automatisch inhoud mee te geven. Dat kan handig zijn als je nog niet weet wat je er bijvoorbeeld in wilt gaan plaatsen. Je ziet dat meestal ook bij een standaard installatie van WordPress. Het archief, de categorieën, de blogroll en de meta bijvoorbeeld.
De code die je daarvoor gebruikt is dan als volgt:
Categories
Archives
Blogroll
-
', '', ' - '); ?>
Bovenstaande is een eenvoudige manier om dynamische sidebar toe te voegen. De mogelijkheden hiermee zijn veel uitgebreider.