Question

我正在尝试在标签组的标签旁边进行循环调用。选项卡来自bootstrap，唯一的事情是当页面首次加载时，循环不会，您必须单击选项卡以加载内容。有没有办法确保循环加载页面加载？

对于上下文，这是一个图书馆网站，内容是新图书/音乐/电影，图片左对齐，标题/作者在右边。

这是我正在使用的代码。

 <div class="span4 pull-right">
    <h2 style="font-weight:200;">New At The Library</h2>
<ul class="nav nav-tabs" id="myTab">
  <li class="active"><a href="#books" data-toggle="tab"><h5 style="margin:0;"><i class="icon-book"></i>  New Books</h5></a></li>
  <li><a href="#cds" data-toggle="tab"><h5 style="margin:0;"><i class="icon-music"></i>  New Music</h5></a></li>
  <li><a href="#movies" data-toggle="tab"><h5 style="margin:0;"><i class="icon-film"></i>  New Films</h5></a></li>
</ul>
<div class="tab-content">
<div class="tab-pane" id="books">
<?php query_posts( array ( 'category_name' => 'new-books', 'posts_per_page' => -3 ) ); ?>

<?php while ( have_posts() ) : the_post();?>
    <ul class="unstyled">
        <li class="clearfix">
            <?php echo get_the_post_thumbnail($page->ID, $arraySIZE = array('' => 120,80 ), array('class' => 'img-polaroid')); ?>
            &nbsp;
            <h4 class="pull-right" style="margin:0;"><?php the_content();?></h4>
        </li>
            <hr>
    </ul>
<?php endwhile; ?>

</div>


<div class="tab-pane" id="cds">
<?php query_posts( array ( 'category_name' => 'new-music', 'posts_per_page' => -3 ) ); ?>

<?php while ( have_posts() ) : the_post();?>
    <ul class="unstyled">
        <li class="clearfix">
            <?php echo get_the_post_thumbnail($page->ID, $arraySIZE = array('' => 80,80 ), array('class' => 'img-polaroid')); ?>
            &nbsp;
            <h4 class="pull-right" style="margin:0;"><?php the_content();?></h4>
        </li>
            <hr>
    </ul>
<?php endwhile; ?>

</div>
<div class="tab-pane" id="movies">

<?php query_posts( array ( 'category_name' => 'new-movies', 'posts_per_page' => -3 ) ); ?>

<?php while ( have_posts() ) : the_post();?>
    <ul class="unstyled">
        <li class="clearfix">
            <?php echo get_the_post_thumbnail($page->ID, $arraySIZE = array('' => 120,80 ), array('class' => 'img-polaroid')); ?>
            &nbsp;
            <h4 class="pull-right" style="margin:0;"><?php the_content();?></h4>
        </li>
            <hr>
    </ul>
<?php endwhile; ?>

</div>
</div>

Answer 1

我认为您可能必须将其中一个标签窗格声明为活动状态。我在Bootstrap 3版本中做同样的事情，并且能够以这种方式加载循环......

只需将“active”添加到第一个标签窗格div类，如下所示：

<div class="tab-pane active" id="books">

应该做的伎俩。

在Bootstrap选项卡里面的Wordpress循环

1 个答案: