Slider Carousel

<div class="container">
  <div id="myCarousel" class="carousel slide" data-ride="carousel">
    <!-- Indicators -->
    <ol class="carousel-indicators">
    <?php 
      $i=0;            
      while( have_rows('slider') ): the_row();            
        if ($i == 0){?>
          <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
        <?php }else{ ?>
          <li data-target="#myCarousel" data-slide-to="<?php echo $i; ?>"></li>
        <?php }  $i++;            
      endwhile; 
      ?>
    </ol>

    <!-- Wrapper for slides -->
    <div class="carousel-inner">
      <?php $z = 0;            
           while( have_rows('slider') ): the_row();            
            $image = get_sub_field( 'slider_image' ); ?>

      <div class="item <?php if ($z == 0) { echo 'active';} ?>">
        <img src="<?php echo $image['url']; ?>" style="width:100%;">
        <div class="carousel-caption">
          <h3><?php the_sub_field('slider_title');?></h3>
          <p><?php the_sub_field('slider_content');?></p>
        </div>
      </div>
      <?php $z++;            
      endwhile; 
      ?>
    </div>

Leave a comment