Advanced Custom Fields Repeater With 2 Loops

0 Views

I am setting up a photo gallery, with a main image and 6 thumbnails under it. Upon hovering the thumbnail, the main image will change. Simple stuff. The problem I am having is that when the page loads, the main image is the image from the first repeater row (like I want), but then in the thumbnails, the first repeater row doesn’t get output. So only thumbnails 2 – 6 are being output. I am new to Advanced Custom Fields. Not sure if it’s something to do with that or if it’s just a simple PHP error. Here is my code: 

<?php if( have_rows('property_images') ): 

    while( have_rows('property_images') ): the_row();

        $image = get_sub_field('property_image');
        $url = $image['url'];

    ?>

    <img src="<?php echo $url ?>" class="property-main-img">

    <?php
        break;
        endwhile;
        endif; 
    ?>

            <ul>

                <?php if( have_rows('property_images') ): 

                        $i = 1;

                        while( have_rows('property_images') ): the_row();

                            $image = get_sub_field('property_image');
                            $url = $image['url'];

                        ?>

                        <?php if($i % 3 == 0) { ?>

                            <li class="prop-thumb-r"><img src="<?php echo $url ?>" alt="<?php echo $image['alt']; ?>" width="170" /></li>

                        <?php } else if($i == 1 || $i % 4 == 0) { ?>

                            <li class="prop-thumb-l"><img src="<?php echo $url ?>" alt="<?php echo $image['alt']; ?>" width="170" /></li>

                        <?php } else { ?>

                            <li><img src="<?php echo $url ?>" alt="<?php echo $image['alt']; ?>" width="170" /></li>

                        <?php } ?>

                        <?php
                             $i++;
                         endwhile; 
                    endif; 
                ?>

            </ul>
Post Views: 0

Related posts

Leave a Reply

1 comment

  1. It seems that the break might be causing the problem. Try using this method to get the first image by grabbing only the first row from the repeater field.

    <?php 
    $rows = get_field( 'property_images' );
    $first_image = $rows[0]['property_image'];
?>

<img src="<?php echo $first_image['url'] ?>" class="property-main-img">