register_sidebar – whats the purpose of "class"? It doesn't do anything?

  • Leo Blanchette

    (@leoclipartillustrationcom)


    11 years, 1 month ago

    register_sidebar() takes some $args. 

    <?php $args = array(
	'name'          => __( 'Sidebar name', 'theme_text_domain' ),
	'id'            => 'unique-sidebar-id',
	'description'   => '',
        'class'         => '',
	'before_widget' => '<li id="%1$s" class="widget %2$s">',
	'after_widget'  => '</li>',
	'before_title'  => '<h2 class="widgettitle">',
	'after_title'   => '</h2>' ); ?>

    I’m trying to add a class to the inner-most HTML where the given widget will be inserted.

    Example: 

    <div class="panel panel-default home-beside-content">
   <aside class="widget widget_text" id="text-8">
      <div class="row panel-heading">
         <h3 class="featured-posts col-md-12">This is a test</h3>
      </div>
      <div class="textwidget">This is a test</div>
   </aside>
</div>

    I’d like to add the class “panel-body” to the textwidget area. Like so:

    <div class="textwidget">This is a test</div>

    Becomes:

    <div class="textwidget panel-body">This is a test</div>

    Its very important this class is put here in particular because bootstrap requires this nesting.

    https://getbootstrap.com/components/#panels

    So when I add the class to the args, nothing happens — hence I ask how do you insert a class into this part of the widget? I would assume by doing this:

    <?php $args = array(
	'name'          => __( 'Sidebar name', 'theme_text_domain' ),
	'id'            => 'unique-sidebar-id',
	'description'   => '',
        'class'         => 'panel-body',
	'before_widget' => '<li id="%1$s" class="widget %2$s">',
	'after_widget'  => '</li>',
	'before_title'  => '<h2 class="widgettitle">',
	'after_title'   => '</h2>' ); ?>

    But the class shows up nowhere in the HTML.

    I am desperately in need of help on this one ?? Thank you.

Viewing 2 replies - 1 through 2 (of 2 total)

  • add the class to the ‘before_widget’ parameter;

    example:

    'before_widget' => '<li id="%1$s" class="panel-body widget %2$s">',

    the ‘class’ parameter is (only) used in the css in the dashboard – apperance – widgets page, as .sidebar-{class} …

    Thread Starter Leo Blanchette

    (@leoclipartillustrationcom)

    Thank you for your help. See example:

    <div class="panel panel-default home-beside-content">
   <aside class="widget widget_text" id="text-8">
      <div class="row panel-heading">
         <h3 class="featured-posts col-md-12">This is a test</h3>
      </div>
      <div class="textwidget">This is a test</div>
   </aside>
</div>

    The problem remains, simply because of the order/way in which the widget is constructed. Is there a way I can change the structure of the default sidebar?

    For instance, the before_widget should contain the class “panel panel-default“

    NEXT should come the title: 

    <div class="row panel-heading">
     <h3 class="panel-title featured-posts col-md-12">This is a test</h3>
</div>

    (Notice the presence and order of panel-heading, panel-title)

    UNDER THAT should come “panel-body“

    <div class="panel-body">the widget</div>

    It seems impossible to obey that hierarchy when I register a widget. I can cheat it by having the after_title contain a: <div class=panel-body'> and the after_widget contain a </div> but of course that breaks if the user does not provide a title.

    This is a real paradox! Is there a way to change the default template? Or add a class to that inner-most widget area?

    Obeying bootstrap 3 structure is a real pain ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘register_sidebar – whats the purpose of "class"? It doesn't do anything?’ is closed to new replies.