Support

Account

Home Forums ACF PRO How to use repeater fields for bootstrap carousel? Reply To: How to use repeater fields for bootstrap carousel?

  • I have the images and all text showing up using the repeater sub fields now.

    The slider show’s only one slide (the first slide only).

    I’m thinking it has something to do with the indicators and the counter for the indicators. I don’t know if I have that part properly formatted.

    Here’s the code:

    <div class="carousel fade-carousel slide" data-ride="carousel" data-interval="4000" id="bs-carousel">
      <!-- Overlay -->
      <div class="overlay"></div>
      
    <ol class="carousel-indicators">
     <?php while(the_repeater_field('slideshow_images')): ?>
    <?php $i = 0 ?>
    <?php 
    if ($i == 0) {
    echo '<li data-target="#bs-carousel" data-slide-to="0" class="active"></li>';
    } else {
    echo '<li data-target="#bs-carousel" data-slide-to="'.$count.'"></li>';
    }
    $i++
    ?>
    
    </ol>
    
      <!-- Wrapper for slides -->
      <div class="carousel-inner">
     
      <?php $z = $z + 1; $image = wp_get_attachment_image_src(get_sub_field('image'), 'full'); ?>
    
        <div class="<?php echo ($z==1) ? 'item slides active ' : ''; ?>item slides">
      
        <div style="background: url(<?php the_sub_field('image'); ?>);max-height:500px;height: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat;"></div>
          <div class="hero" style="width:96%;">
            <hgroup>
                <h1><?php the_sub_field('title');?></h1>        
                <h3><?php the_sub_field('sub_title');?></h3>
            </hgroup>
            <a href="<?php the_sub_field('image_links_to'); ?>"<button class="btn btn-hero btn-lg" role="button"><?php the_sub_field('links_to_text'); ?></button></a>
          </div>
        </div>
      </div>
    <?php endwhile; ?>
    
    </div>