html - wordpress register_sidebar "class"不工作

标签 html css wordpress twitter-bootstrap

这看起来简单明了 - 但事实并非如此。

我正在尝试在小部件输出的内部注册一个类。我使用的是 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=>'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

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

最佳答案

我在主题的 footer.php 文件末尾用 jQuery 解决了这个问题。

对于每个面板,您需要获取除panel-heading 之外的子元素,并将它们全部包裹在panel-body 中。

<script>
jQuery('.panel').each(function(index, value) {
 jQuery(value).children().not('.panel-heading').wrapAll('<div class="panel-body"></div>');
});
</script>

注意:我使用了完整的单词 JQuery 因为快捷方式 $ 不可用。

关于html - wordpress register_sidebar "class"不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19192082/

相关文章:

jquery - 动画 CSS 生成 :after content?

html - 均衡左右div的高度,防止右div低于左div

javascript - 通过动画向左使 div 消失

html - 菜单悬停在 Windows 8 Phone 和 Windows Surface 上不起作用

php - 如果仅在手机上隐藏 WordPress 侧边栏,而不是 iPad、平板电脑等……

Mysql 数据库未显示 localhost phpmyadmin (sequel pro)

javascript - slider 插件中的图像颜色叠加,叠加上方的文本(wordpress)

html - 如何使用 vh div 缩放图像高度

javascript - D3.js 堆叠区域颜色变化超过特定值

html - ASCII 字符 62 在 Superfish 菜单中显示不正确