使用Twitter Bootstrap Carousel的Expression Engine频道条目不起作用

Question

好的,所以我在通过ExpressionEngine的频道条目实现基本的Twitter bootstrap Carousel时遇到了问题.我认为这与你必须为引导程序指定第一个li标签为"active"以了解在页面加载时呈现哪个图像这一事实有关.但我的代码如下

<div id="myCarousel" class="carousel slide">
          <!-- Carousel items -->
          <div class="carousel-inner">

     {exp:channel:entries channel="work" dynamic="no"}
       <div class="item">
        <div class="workItem">
          <a href="{title_permalink='work/view'}">{project_image wrap="image"}</a>
          <a href="{title_permalink='work/view'}"><h3>{title}</h3></a>
        </div>
       </div>
     {/exp:channel:entries}

           </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>
</div>

所以似乎正在发生的事情是当页面加载时没有显示图像因为我没有标记"活动"类,因为这段代码只是运行我使用channel:entries在EE控制面板中创建的所有'项目' .因为滚动箭头确实显示,当我点击它们时它跳转到第一个图像,然后我可以滚动项目图像.

有没有办法激活第一个项目(或最近的)作为class ="active",以便它将成为默认的登陆项目.任何有关这方面的帮助将非常感激...或者如果有更好/更简单的方法做事情让我知道

万分感谢,

Answer 1

您可以使用{count}变量{exp:channel:entries}将类添加到仅具有条件的第一个项:

{exp:channel:entries channel="work" dynamic="no"}
  <div class="item {if count == 1}active{/if}">
    [...]
  </div>
{/exp:channel:entries}