css - 专门针对 wordpress 中的小部件的 Bootstrap

Question

当我把它放在 th 上时，boostrap 已经覆盖了我的主题风格。问题是我必须这样做，因为小部件甚至出现在主页上。那么如何在 wordpress 中专门为小部件使用 Bootstrap 呢？

我想到了一个方法，但它很搞笑，这是添加 !important 到我的主题文件，但那里有大量的类。

Answer 1

当您注册侧边栏时，您可以将类应用于适当的小部件。

例子:

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

从这个例子可以看出，col-sm-4 类已经应用到这个小部件上。您将需要相应地更新注册侧边栏的功能，但是像这样应用 Bootstrap 实用程序可以为您提供更大的灵 active (例如，可以使用一个侧边栏和三个小部件轻松完成具有三个垂直列的页脚区域，因为它们将填充向上 12 列空间)。

或者，您可以使用 Bootstrap 实用程序包装侧边栏，以便所有小部件都显示在里面。例如:

<div class="container">
   <div class="row">
    <div class="col-sm-8">
      <?php the_title(); ?>
      <?php the_content(); ?>
    </div>
    <div class="col-sm-4">
      <?php dynamic_sidebar( 'unique-sidebar-id' ); ?>
    </div>
   </div>
</div>