wordpress主题中的轮播未显示其他帖子

时间:2016-07-21 14:30:16

标签: wordpress

我有一个基本的bootstrap轮播,我把它放在我的WordPress主题中。我希望旋转木马能够显示三个最新帖子。我尝试使用" posts_per_page => 3"这样做,但是如果我这样做,那么我的CSS会在整个地方乱七八糟地混乱。因此,我使用" posts_per_page => 1"这是我的代码:

<!-- Home Carousel -->
<div id="home-carousel" class="carousel carousel-home slide" data-ride="carousel" data-interval="5000">
    <!-- Wrapper for slides -->
    <div class="carousel-inner" style="margin-top:0px; background-color:transparent; height:30em;">
        <div class="active item">
                    <?php the_post_thumbnail('large');?>
                    <div class="carousel-caption">
                        <a href="<?php  the_permalink(); ?>"> <h1><?php the_title();?></h1></a>


                    <?php 
                           $the_query = new WP_Query(array(
                             'category_name' => 'Featured',
                            'posts_per_page' => 1
                            )); 
                           while ( $the_query->have_posts() ) : 
                           $the_query->the_post();
                          ?>
                    </div>
                <?php 
                   endwhile; 
                   wp_reset_postdata();
                ?>
        </div>  



        <div class="item">
                    <?php the_post_thumbnail('large');?>
                     <div class="carousel-caption">
                      <a href ="<?php  the_permalink(); ?>"><h1><?php the_title();?></h1></a>
                      </div>

                        <?php 
                         wp_reset_postdata();
                        ?>
        </div>
    </div>

    <!-- Controls -->
        <a class="left carousel-control" href="#home-carousel" data-slide="prev">
            <span>
                <i class="fa fa-chevron-left"></i>
            </span>
        </a>
        <a class="right carousel-control" href="#home-carousel" data-slide="next">
            <span>
                <i class="fa fa-chevron-right"></i>
            </span>
        </a>
    <!-- END Controls -->

</div>  

1 个答案:

答案 0 :(得分:0)

                    “精选”,     'posts_per_page'=&gt; 3     ));     while($ the_query-&gt; have_posts()):     $ the_query-&GT; the_post();     ?&GT;

<div class="<?php echo($tmpX == 0 ? 'active' : '') ?> item">
<?php the_post_thumbnail('large'); ?>
<div class="carousel-caption">
<a href="<?php the_permalink(); ?>"><h1><?php the_title(); ?></h1></a>
</div>
</div>
<?php
$tmpX++;
endwhile;
wp_reset_postdata();
?>
</div>

<!-- Controls -->
<a class="left carousel-control" href="#home-carousel" data-slide="prev"><span><i class="fa fa-chevron-left"></i></span></a>
<a class="right carousel-control" href="#home-carousel" data-slide="next"><span><i class="fa fa-chevron-right"></i></span></a>
<!-- END Controls -->

</div>