Putting a WP Widget in Bootstrap 3 Panel

1 Views

I am trying to put each widget inside a Bootstrap 3 panel as so: http://getbootstrap.com/components/#panels-alternatives

Here is my working code so far but the title , it is not going into the panel heading thought. How can I achieve this?

Read More
function create_widget( $name, $id, $description ) 
{

    register_sidebar(array(
        'name' => __( $name ),   
        'id' => $id, 
        'description' => __( $description ),
        'before_widget' => '<div class="panel panel-primary"><div class="panel-heading"></div><div class="panel-body">',
        'after_widget' => '</div></div>',
        'before_title' => '<h3 class="panel-title">',
        'after_title' => '</h3>'
    ));
}

Rendered Output 

<div class="panel panel-primary">
    <div class="panel-heading">
    </div>
        <div class="panel-body">
        <h3 class="panel-title">Hello World</h3>      
        <div class="textwidget">
          <p>Donec id elit non mi porta gravida at eget metus. 
            Fusce dapibus, tellus ac cursus commodo, tortor mauris 
            condimentum nibh, ut fermentum massa justo sit amet risus. 
            Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.</p>
        </div>
        </div>
    </div>
</div>
Post Views: 1

Related posts

Leave a Reply

1 comment

  1. I think you just need to alter the layout a bit:

    function create_widget($name, $id, $description) {
    register_sidebar(array(
        'name' = > __($name),
        'id' = > $id,
        'description' = > __($description),
        'before_widget' = > '<div class="panel panel-primary">',
        'after_widget' = > '</div></div>',
        'before_title' = > '<div class="panel-heading"><h3 class="panel-title">',
        'after_title' = > '</h3></div><div class="panel-body">')
    );
}