fatBuzz of Fatbuzz Development Team
12/18/2017 - 11:08 AM

Bootstrap Accordion using Repeater Field

Example of Boostrap accordion using ACF Repeater Field, update as needed.

<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
  <?php if( get_field( 'repeater-field' ) ): ?>
      <?php $x= 0; while( has_sub_field( 'repeater-field' ) ):  ?>
        <div class="panel panel-default">
          <div class="panel-heading" role="tab" id="heading<?php echo $x; ?>">
            <h4 class="panel-title">
              <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse<?php echo $x; ?>" aria-expanded="true" aria-controls="collapse<?php echo $x; ?>">
                <!-- accordion title -->
          <div id="collapse<?php echo $x; ?>" class="panel-collapse collapse <?php if($x==0): echo 'in'; endif; ?>" role="tabpanel" aria-labelledby="heading<?php echo $x; ?>">
            <div class="panel-body">
              <!-- accordion content -->
      <?php $x++; endwhile; ?>
    <?php endif; ?>