看似简单明了 - 但事实并非如此。
我正在尝试在窗口小部件输出的内部注册一个类。我正在使用bootstrap 3,所以我必须在内部添加一个panel-body
类,而整个小部件本身都包含一个面板panel-default
类。
示例:
register_sidebar(
array(
'name' => __( 'Home Page (Beside Content)' , 'symbiostock' ),
'id' => 'home-page-beside-content',
'class' => 'panel-body',
'before_widget' => '<div class="panel panel-default home-beside-content"><aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside></div>',
'before_title' => '<div class="row panel-heading"><h3 class="featured-posts col-md-12">',
'after_title' => '</h3></div>', ) );
有人会认为“class =&gt;'something”会在小部件的内部注册一个类。但它没有显示出来。以下是发生的事情:
<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>
虽然我期待:
<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 panel-body">This is a test</div>
</aside>
</div>
请注意“panel-body”添加。
我该如何解决这个问题?类嵌套的顺序很重要,因为我正在使用bootstrap 3
答案 0 :(得分:1)
我在主题的footer.php文件的末尾解决了jQuery的问题。
对于每个面板,您需要获取除面板标题之外的其他子项,并将它们全部包装在 panel-body 中。
<script>
jQuery('.panel').each(function(index, value) {
jQuery(value).children().not('.panel-heading').wrapAll('<div class="panel-body"></div>');
});
</script>
注意:我使用了完整的单词 JQuery ,因为快捷键 $ 不可用。
答案 1 :(得分:0)
是的,有人会这么认为,但Wordpress经常与人们的想法完全相反! : - )
我以前遇到过这个问题。出于某些特殊原因,它不能像那样工作。您需要使用一些技巧将您的小部件包装在该类中。类似的东西:
register_sidebar(
array(
'name' => __( 'Home Page (Beside Content)' , 'symbiostock' ),
'id' => 'home-page-beside-content',
'before_widget' => '<div class="panel panel-default home-beside-content"><aside id="%1$s" class="widget %2$s">',
'after_widget' => '</div></aside></div>',
'before_title' => '<div class="row panel-heading"><h3 class="featured-posts col-md-12">',
'after_title' => '</h3></div><div class="panel-body">', ) );
请注意,您在'after_title'中启动新div并在'after_widget'中关闭它。