Bootstrap Carousel有多个项目和幻灯片在PHP中

Question

我在php中创建一个bootstrap轮播。这是有效的，但不是我希望的。

我在jsfiddle上创建了一个示例。

基本上，$ list数组包含多个项目。如果是物品，它可以是不同的数字。代码如下： -

<div class="container">
    <div class="row">
        <div class="col-xs-12">
            <div class="carousel slide" id="myFirstCarousel">
                <div class="carousel-inner">

                    <?php $counter = 0;?>
                    <?php foreach ($list as $item) : ?>
                        <div class="item col-sm-3 <?php if ($counter == 1) echo 'active';?>">
                            <div class="thumbnail">
                                <a href="<?php echo $link; ?>" target="_blank">
                                    <img src="<?php echo $imageurl;?>" alt="<?php echo $imagealt;?>" />
                                </a>
                            </div>
                        </div>
                        <?php $counter++;?> 
                        <?php endforeach; ?>
                </div>
                <nav>
                    <ul class="control-box pager">
                        <li><a data-slide="prev" href="#myFirstCarousel" class=""><i class="glyphicon glyphicon-chevron-left"></i></a></li>
                        <li><a data-slide="next" href="#myFirstCarousel" class=""><i class="glyphicon glyphicon-chevron-right"></i></a></li>
                    </ul>
                </nav>         
            </div>
        </div>         
    </div>
</div>

我希望实现的是让轮播显示4个项目，每个项目都在col-md-3 div中。下一张幻灯片应显示接下来的4个项目等，直到没有更多项目显示。我从here得到了这样的想法。

我将如何在PHP中实现这一目标？目前，它只显示一个col-sm-3 div，每张幻灯片中有一个项目。我需要更改以使每张幻灯片显示4个项目？

有什么见解？提前谢谢！