Code voorbeeld

Widget class first & last + widget order meegeven binnen WordPress

Leestijd: 1 minuten (275) words
profile image

Rick de Jong

Strategie

July 13, 2012 07:05

Widget class first & last + widget order meegeven binnen WordPress

Een handige snippet voor opmaak mogelijkheden van widgets

Tijdens het ontwikkelen van een WordPress thema zul je ongetwijfeld tegen het probleem aanlopen dat je meer wilt doen met de opmaak van je widgets. Dit is erg lastig, omdat er weinig specifieke classes worden meegegeven aan de widgets vanuit WordPress zelf. Denk hierbij onder andere aan de eerste en laatste widget, of juist de rest daar tussen in.

Via onderstaande snippet geef je je widgets diverse classes mee, waardoor je deze eenvoudig kunt opmaken via de css-class "first-widget" & "last-widget". Ook wordt er een class "widget-nummer-1" / "widget-nummer-2" etc.. meegegeven. Deze telt automatisch door, waardoor opmaak van een specifiek widget(blok) eenvoudig te doen is.

Functions.php

Plak de onderstaande code in je functions.php

function tsd_widget_order_class() {
   global $wp_registered_sidebars, $wp_registered_widgets;

   $sidebars = wp_get_sidebars_widgets();

   if ( empty( $sidebars ) )
       return;

   // Geef iedere widget een widget-nummer class
   foreach ( $sidebars as $sidebar_id => $widgets ) {
       if ( empty( $widgets ) )
           continue;
       $number_of_widgets = count( $widgets );
       foreach ( $widgets as $i => $widget_id ) {
           $wp_registered_widgets[$widget_id]['classname'] .= ' widget-nummer-' . $i;

           // Geef de eerste widget een class
           if ( 0 == $i ) {
               $wp_registered_widgets[$widget_id]['classname'] .= ' first-widget'; 
           }

           // Geef de laatste widget een class
           if ( $number_of_widgets == ( $i + 1 ) ) {
               $wp_registered_widgets[$widget_id]['classname'] .= ' last-widget'; 
           }
       }
   }
}
add_action( 'init', 'tsd_widget_order_class' );