Widget output gebaseerd op sidebar

Hiranthi Herlaar
3 min readFeb 17, 2018

--

Voor onder andere Liefdevol Opgroeien ben ik bezig met een nieuw basis thema. In dat thema heb ik ook wat eigen widgets toegevoegd. Bijvoorbeeld een die de standaard widget voor laatste berichten vervangt. Onder andere omdat ik een thumbnail wilde toevoegen aan de output.

Wanneer je meerdere sidebars toevoegt aan je thema, kan het voorkomen dat de manier waarop de weergave in de ene sidebar je feestvreugde aanwakkert (omdat het gewoon klopt), terwijl het in de andere sidebar je haast de haren uit je hoofd laat trekken. Nou ja, zo werkt het bij mij dan ;-)

Natuurlijk kun je met CSS een hoop. Het is ook mogelijk om widgets te maken die specifiek voor een bepaalde sidebar bedoeld zijn. Dat eerste zul je in ieder geval hebben met widgets die worden toegevoegd bij plugins, waarvan je de stijling ook wilt ondersteunen in je thema. Hoe veel je tegenwoordig ook kan met CSS, heeft ook zo z’n beperkingen. Daarnaast zijn er zo ontzettend veel plugins die hun eigen widgets toevoegen, dat de tweede optie (sidebar specifieke widgets aanmaken) de bulk aan widgets enorm onoverzichtelijk kan maken voor de eindgebruiker.

Eerlijk gezegd had ik ook niet zo’n zin om allerlei extra widgets aan te moeten maken voor eigenlijk hetzelfde doel. Maakt het voor eventuele wijzigingen ook niet overzichtelijker. “Ik baseer de output gewoon op de sidebar waar de widget in zit! Er is vast een functie waarmee je de huidige sidebar kunt achterhalen.” Dat bleek makkelijker gedacht dan gedaan.

Het is me vaker overkomen dat ik dacht “daar is vast een standaard functie voor” waarbij dan later bleek dat dit dus niet het geval was. Hoe logisch het ook voelde dat dit toch echt wel iets voor ‘de basis’ was.

Dat werd dus zoekwerk. Zoeken naar hoe je bij de actieve sidebars kunt komen, waar je de unieke ‘widget id’ weghaalt. En dan testen, testen, testen tot het werkt. Gelukkig voor mij (en als je dit leest, dan waarschijnlijk ook voor jou) heb ik een werkende oplossing gevonden. Was anders toch ook best een gemene plot-twist geweest als dat niet het geval was ;-)

get_current_sidebar functie

De functie om de sidebar te achterhalen, kun je in je functions.php plaatsen. Je kunt het uiteraard ook gebruiken in een plugin, al zal het achterhalen van de context van de sidebar dan extra uitdagingen toevoegen.

Gebruiken in je widget

Het inzetten van de get_current_sidebar functie kan bijvoorbeeld zo:

Waarom output gebaseerd op sidebar?

Het kan dus enorm helpen om de weergave van een widget in smalle en brede sidebars aan te passen naar hoe je het hebben wil. Om allerlei CSS capriolen tegen te gaan, alleen de HTML als output te gebruiken die voor die specifieke sidebar als nodig wordt geacht. Semantische code, gebaseerd op de plaats waar de widget wordt weergegeven.

Je zou in een smalle sidebar bijvoorbeeld grote afbeeldingen kunnen gebruiken (eventueel zelfs andere dan de standaard post thumbnail) zonder verdere tekst / extra data. Terwijl het in de footer meer als lijst met kleine thumbnails wordt weergegeven. Zonder in je code extra widgets aan te moeten maken.

Als je de code gebruikt, zou ik het erg leuk vinden om er een live voorbeeld van te zien!

Originally published at Onexa.

--

--