第n行ACF REPEATER的不同布局

Question

I am using ACF repeater to display images, I want to achieve layout so that 1 - 2 - 3 elements go with col-lg-4 grid and 4-5-6-7 go with col-lg-3 grid and so on, repeating that layout for all items

I've tried using but it's to get 3 elements into 1 div

mostly my layout will be

first row 3x col-lg-4
second row 4x col-lg-3
third row 3x col-lg-4
fourth row 4x col-lg-3 


<?php 

// check if the repeater field has rows of data
if( have_rows('gallery_repeater') ):
    // loop through the rows of data

    // add a counter
    $count = 0;
    $group = 0;

    while ( have_rows('gallery_repeater') ) : the_row(); 
      // vars
      $teacher_bio = get_sub_field('image');
      if ($count % 3 == 0) {
        $group++;
        ?>
          <div id="teachers-<?php echo $group; ?>" class="cf group-<?php echo $group; ?>">
        <?php 
      }
      ?>
      <div class="teacher">
        <img src="<?php the_sub_field('image'); ?>" />

        <?php echo $teacher_bio; ?>
      </div><!-- .teacher -->
      <?php 
        if ($count % 3 == 2) {
          ?>
            </div><!-- #teachers -->
          <?php 
        }
        $count++;
      endwhile;
  else :
    // no rows found
  endif;

?>

Answer 1

Hi Please check below code for reference :

$gallery_repeater = get_field('gallery_repeater');
foreach (array_chunk($gallery_repeater, 7) as $key => $value) {
    foreach ($value as $k => $val) {
        $class = $k < 3 ? 'col-lg-3' : 'col-lg-4';
        echo '<div class="'.$class.'"> <img src="'.$val['image'].'" />'.$val['teacher_bio'].'</div>';
    }
}