부트 스트랩 탭 안의 Wordpress 루프

Question

탭 그룹의 탭 측면에서 루프 호출을하려고합니다. 탭은 부트 스트랩에서 가져온 것이고, 유일한 것은 페이지가 처음로드 될 때 루프가 실행되지 않는다는 것입니다. 탭을 클릭하여 내용을로드해야합니다. 루프가 페이지로드에로드되는지 확인하는 방법이 있습니까?

컨텍스트의 경우 라이브러리 사이트이며 콘텐츠는 새로운 책/음악/영화이며 왼쪽에 이미지가 왼쪽에 정렬되고 오른쪽에 제목/저자가 나열되어 있습니다.

여기에 제가 사용하고있는 코드가 있습니다.

<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

탭 패널 중 하나를 활성화로 선언해야 할 수도 있습니다. 나는

그냥과 같이 첫 번째 탭 창 DIV 클래스에 "활성"추가 ... 부트 스트랩 3 빌드에서이 같은 일을하고 루프이 방법을로드 할 수 있어요 오전 :

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

할까요 속임수를 써라.