Hello,
I’m trying to achieve the following markup with the repeater field:
<ul>
<li>item 1 Name</li>
<li>item 2 Name</li>
<li>item 3 Name</li>
</ul>
<div>
<div>item 1 Description</div>
<div>item 2 Description</div>
<div>item 3 Description</div>
</div>
<ul>
<li>item 4 Name</li>
<li>item 5 Name</li>
<li>item 6 Name</li>
</ul>
<div>
<div>item 4 Description</div>
<div>item 5 Description</div>
<div>item 6 Description</div>
</div>
What I have so far:
Which outputs the divs and uls in groups of 3. But only produces the last item’s description in the div markup. It’s as if it’s missing the other two. My counter is probably wrong?
<ul class="small-block-grid-1 medium-block-grid-3 large-block-grid-3">
<?php $i = 1; ?>
<?php while( have_rows('our_team_team') ): the_row(); ?>
<li><?php the_sub_field('team_member_name'); ?></li>
<?php if($i % 3 == 0) : ?>
</ul><div class="test">
<?php endif; ?>
<div><?php the_sub_field('Description'); ?></div>
<?php if($i % 3 == 0) : ?>
</div><ul class="small-block-grid-1 medium-block-grid-3 large-block-grid-3">
<?php endif; ?>
<?php $i++; ?>
<?php endwhile; ?>
However, I’m nearly there, but it doesn’t quite render what I’m after:
<ul class="small-block-grid-1 medium-block-grid-3 large-block-grid-3">
<li>Name 1</li>
<div>Description 1</div>
<li>Name 2</li>
<div>Description 2</div>
<li>Name 3</li>
</ul>
<div class="test">
<div>Description 3</div>
</div>
<ul class="small-block-grid-1 medium-block-grid-3 large-block-grid-3">
<li>Name 4</li>
<div>Description 4</div>
<li>Name 5</li>
<div>Description 5</div>
<li>Name 6</li>
</ul>
<div class="test">
<div>Description 6</div> // there should be 3 here
</div>
As you can see in the test div, it’s skipping over the 1st and 2nd in the loop and only rendering the last in the “test” div`
There isn’t any real way to do what you want without temporarily storing the values in some way and then outputting them later since you want to split up the content of each row.
Something like
<?php
$i = 1; // starting at 0
$rows = count(get_field('our_team_team')); // total rows
$list1 = '';
$list2 = '';
while (have_rows('our_team_team')) {
the_row();
$list1 .= '<li>'.get_sub_field('team_member_name').'</li>';
$list2 .= '<div>'.get_sub_field('Description').'</div>';
if (($i % 3) == 0 || $i == $rows) {
// divisable by 3 or last row
?>
<ul><?php echo $list1; ?></ul>
<div><?php echo $list2; ?></div>
<?php
$list1 = '';
$list2 = '';
}
$i++;
} // end while have rows
?>
