WordPress : Disposition différente pour les nièmes lignes ACF REPEATER

Publié par Jean-Michel le

J’utilise le répéteur ACF pour afficher des images, je veux obtenir une mise en page de sorte que 1 – 2 – 3 éléments aillent avec la grille col-lg-4 et 4-5-6-7 avec la grille col-lg-3 et ainsi de suite, répéter cette mise en page pour tous les éléments

J’ai essayé d’utiliser mais c’est pour obtenir 3 éléments en 1 div

la plupart du temps ma mise en page sera

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;

?>

Solution n°1 trouvée

Salut Veuillez vérifier le code ci-dessous pour référence:

$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>';
    }
}

Catégories : Wordpress

Jean-Michel

Jean-Michel est en charge de la partie blog du site. Il met en place la stratégie de contenu et répond aux questions fréquentes sur Wordpress.

0 commentaire

Laisser un commentaire

Avatar placeholder

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *