Simple widget enhancer : css classes and title link

Style and title url inputs have been added to the widget form, example above on the text widget form

There are all sort of widget types for WORDPRESS that give web masters a lot of flexibility over the layout of sidebars, headers, footers. Among   many attributes of the register_sidebar function, the basis of zone creation in wordpress pages, are the before/after_widget and before/after_title.

While these attributes can specify specific classes and code for all widgets of a specific page area, the default widget system does not take care of specific elements within the sidebar : each widget should be allowed to be designed independently, via custom classes for instance.Further more, we like to keep the preformatted title (via before/after_title settings), but we find it necessary to be able to link that title. That's what we do below, extending the original custom classes feature to incorporate a title url link input. This code comes into an include of your functions.php theme and should work as is

function kc_widget_form_extend( $instance, $widget ) 
    if ( !isset($instance['classes']) )  $instance['classes']=null; 
    if ( !isset($instance['urlwidgettitle']) )  $instance['urlwidgettitle']=null; 
/* Set your predetermied class choices here */
 $myarray = "topleft, center, bottomright";
$myclasses = explode(",",$myarray);
 $row = "<p>\n";
 $row .= "\t<label for='widget-{$widget->id_base}-{$widget->number}-classes'>Style:</label>\n";
 $row .= "\t<select  name='widget-{$widget->id_base}[{$widget->number}][classes]'  id='widget-{$widget->id_base}-{$widget->number}-classes'  class='widefat'>\n";
 foreach($myclasses as $myclass) {
 $instance_selected = null; if($instance['classes']==$myclass) $instance_selected = " selected='selected'";
 $row .= "\t<option value='".$myclass."'".$instance_selected.">".$myclass."</option>\n";
 $row .= "</select>\n";
 $row .="<p><label for='widget-{$widget->id_base}-{$widget->number}-urlwidgettitle'>Title url:</label>";
 $row .="<input type='text'  name='widget-{$widget->id_base}[{$widget->number}][urlwidgettitle]'  id='widget-{$widget->id_base}-{$widget->number}-urlwidgettitle' value='{$instance['urlwidgettitle']}'</p>"   ;
 echo $row;
 return $instance;
add_filter('widget_form_callback', 'kc_widget_form_extend', 10, 2);

function kc_widget_update( $instance, $new_instance ) {
 $instance['classes'] = $new_instance['classes'];
 $instance['urlwidgettitle'] = $new_instance['urlwidgettitle'];
 return $instance;
add_filter( 'widget_update_callback', 'kc_widget_update', 10, 2 );
function kc_dynamic_sidebar_params( $params ) {
 global $wp_registered_widgets;
 $widget_id    = $params[0]['widget_id'];
 $widget_obj    = $wp_registered_widgets[$widget_id];
 $widget_opt    = get_option($widget_obj['callback'][0]->option_name);
 $widget_num    = $widget_obj['params'][0]['number'];
 if ( isset($widget_opt[$widget_num]['classes']) && !empty($widget_opt[$widget_num]['classes']) )
 $params[0]['before_widget'] = preg_replace( '/class="/', "class=\"{$widget_opt[$widget_num]['classes']} ", $params[0]['before_widget'], 1 );
 if ( isset($widget_opt[$widget_num]['urlwidgettitle']) && !empty($widget_opt[$widget_num]['urlwidgettitle']) )
     $params[0]['before_title']=  $params[0]['before_title'] . "<a href='" . $widget_opt[$widget_num]['urlwidgettitle'] . "'>";
     $params[0]['after_title']= "</a>" . $params[0]['after_title'] ;
if (!strstr($params[0]['widget_id'],"text-"))
        $params[0]['after_title']=  $params[0]['after_title'] . "<div class='textwidget'>";
      //  $params[0]['after_widget']  =qsdf";
        $params[0]['after_widget']  = "</div>" .   $params[0]['after_widget'];
 return $params;
add_filter( 'dynamic_sidebar_params', 'kc_dynamic_sidebar_params' );

0 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *