Bootstrap Carousel最新文章滑块问题：所有项均为active状态

这个问题很典型，Bootstrap Carousel的机制要求必须只有一个滑块项带有active类才能正常切换显示。你现在的代码里循环时给每个项都加上了active，所以需要加个判断逻辑，只给第一个项添加这个类。

修改后的完整代码 #

<?php 
$lastposts = get_posts( array( 
    'posts_per_page' => 3, 
    'category' => 584 
) ); 

if ( $lastposts ) { ?> 
    <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
        <div class="carousel-inner">
            <?php 
            // 用带键的foreach来获取每个帖子的索引
            foreach ( $lastposts as $key => $post ) : 
                setup_postdata( $post ); 
                // 只有第一个项（键为0）添加active类
                $active_class = $key === 0 ? 'active' : '';
            ?>
                <div class="carousel-item <?php echo $active_class; ?>">
                    <img src="/wp-content/uploads/slider.png">
                    <div class="carousel-caption d-none d-md-block">
                        <div class="title">
                            <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
                        </div>
                    </div>
                </div>
            <?php endforeach; 
            wp_reset_postdata(); ?>
        </div>
    </div>
<?php } ?>

关键修改点说明 #

1. 给foreach添加键值：把foreach ( $lastposts as $post )改成foreach ( $lastposts as $key => $post )，这样就能拿到每个帖子在数组里的索引位置。
2. 动态判断active类：新增$active_class = $key === 0 ? 'active' : '';，用三元运算符判断——当索引为0（也就是第一个帖子）时，给变量赋值active，否则为空字符串。
3. 替换固定的active类：把原来固定的carousel-item active改成carousel-item <?php echo $active_class; ?>，实现只有第一个项才会带上active类。

这样修改后，你的Carousel就能正常工作，只会默认显示第一个滑块项，并且可以正常切换啦。

内容的提问来源于stack exchange，提问作者Tweak