将 WP 小部件放入 Bootstrap 3 面板

Question

我正在尝试将每个小部件放在 Bootstrap 3 面板中，如下所示：http://getbootstrap.com/components/#panels-alternatives

到目前为止，这是我的工作代码，但标题 并没有进入面板标题的想法。我怎样才能做到这一点？

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>'
    ));
}

渲染输出

<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>

Answer 1

我认为你只需要稍微改变一下布局：

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">')
    );
}