个性化阅读
专注于IT技术分析

bootstrap轮播的WordPress循环

我试图在一张幻灯片上一次显示5个以上的项目, 默认情况下, 假设只有一个。我尝试创建两个循环, 一个将post_per_page = 3放置在活动类中, 另一个将内容放置在item类中, 这是我在第一个输出中将三个帖子发布到首页的内容, 但是在第一次滑动后, 它变成了一, 对此可能的解决方案是什么?

提前致谢。

希望你能理解, 这是我最好的解释方式。

这是我想要实现的

这是我想要实现的

.

这是我的代码

<div id="myCarousel" class="carousel slide">
 <!-- Carousel items -->
 <div class="carousel-inner">
 <?php 
  $my_query = new WP_Query('posts_per_page=3');
  while ($my_query->have_posts()) : $my_query->the_post();
  $do_not_duplicate = $post->ID;?>
   <!-- The 1st Loop... -->
   <div class="active item well-blue">
     <div class="offset1">              
     <h3><?php the_title(); ?></h3>
     <p class="lead"><?php $excerpt = strip_tags(get_the_excerpt()); echo $excerpt; ?></p>
     <a href="<?php the_permalink() ?>" class="btn" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">Read more...</a>
   </div> 
 </div>
    <?php endwhile; wp_reset_query(); ?> <?php
      // The 2nd Loop limits the query to 2 more posts...
    $limit_query = new WP_Query('posts_per_page=3');
  while ($limit_query->have_posts()) :$limit_query->the_post();$do_not_duplicate = $post->ID;?>
<!-- The 2nd Loop same data as 1st loop -->
<div class="item well-blue">
     <div class="offset1">              
     <h3><?php the_title(); ?></h3>
     <p class="lead"><?php $excerpt = strip_tags(get_the_excerpt()); echo $excerpt; ?></p>
     <a href="<?php the_permalink() ?>" class="btn" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">Read more...</a>
   </div> 
 </div>
<?php endwhile;  wp_reset_query(); ?>
  </div>
  <!-- Carousel nav -->
  <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
  <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>

#1


检查此链接:https://teamtreehouse.com/community/bootstrap-carousel-and-wordpress-loop-without-postspages

你只需要找到这条线

// Item size (set here the number of posts for each group)
$i = 4; 

并将4更改为5。

赞(0)
未经允许不得转载:srcmini » bootstrap轮播的WordPress循环

评论 抢沙发

评论前必须登录!