ACF Repeater with different odd/even rows [Solved]

• Trishah

• November 14, 2024 at 3:57 am

I wanted to add different AOS (Animate On Scroll) codes to odd and even rows. I was able to get this working, and I wanted to share it with others who wish to do the same.

Theme: Bootstrap-based
Repeater: content_by_paragraph
Repeater field: paragraph (editor)

<?php $row = 0;?>

<div id="container-content" class="container">
    <div class="row">
        <div class="col-md-10 offset-md-1 py-5">
                <?php
                if( have_rows('content_by_paragraph') ):

                    while ( have_rows('content_by_paragraph') ) : the_row() ?>

<?php if ($row % 2 === 0) :?>

<div class="p_1" data-aos="fade-left"><?php the_sub_field('paragraph'); ?></div>

<?php else: ?>

<div class="p_2" data-aos="fade-right"><?php the_sub_field('paragraph'); ?></div>

            <?php endif; ?>

<?php $row++; ?>

                 <?php endwhile;
                else :
                endif;
                ?>
        </div>
    </div>
</div>