get first row (image) of ACF repeater field

Question

I'm using the ACF plugin on my website. I want to display on one page the first row (an image URL) of a repeater field from children page.

here is the page from my website (all the images are loaded but only the first is displayed, but I would like to load only the first)

http://www.amsbooking.fr/mattieumoreau/artists/

here is the code on my page which displays all the images :

        <?php

        $args = array(
        'post_type'      => 'page',     
        'post_parent'    => $post->ID,
        'order'          => 'ASC',
        'orderby'        => 'menu_order'
        );

        $parent = new WP_Query( $args );

        if ( $parent->have_posts() ) : ?>

        <?php while ( $parent->have_posts() ) : $parent->the_post(); ?>

        <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">

        <div class="cartouche_menu_artistes">

        <div id="parent-<?php the_ID(); ?>" class="parent-page">

        <div class="cartouche_crop">

        <?php while(has_sub_field('photos_presse')): ?> // my repeater field

        <img src="<?php the_sub_field('photo'); ?>" class="artists_menu"> // my sub-field, the one I want to get the first row

        <?php endwhile; ?>


        </div>

        <div class="bandeau"></div>

        <h1><?php the_title(); ?></h1>              

        <div class="bandeau"></div>

        </div>


        </div>
        <?php endwhile; ?>
        </a>


        <?php endif; wp_reset_query(); ?>

is the URL of the photo, not the photo itself... that's why I have trouble to get the first row, but I want to keep it this way.

I found this on the web, but I can't manage to adapt it to my case :

<?php

$rows = get_field('repeater_field_name' ); // get all the rows
$first_row = $rows[0]; // get the first row
$first_row_image = $first_row['sub_field_name' ]; // get the sub field value 

// Note
// $first_row_image = 123 (image ID)

$image = wp_get_attachment_image_src( $first_row_image, 'full' );
// url = $image[0];
// width = $image[1];
// height = $image[2];
?>
<img src="<?php echo $image[0]; ?>" />

here is a JSfiddle with my code :

http://jsfiddle.net/5wtRc/

can anybody helps me with this ?

thanks a lot for your help,

Solution 1

I just added in a simple boolean which is set to false when an image is retrieved. I then added in the boolean to the conditions for the while loop, so that after one image has been done, the while loop will fail and move on!

<?php 
$first_img = true; 
while($first_img && has_sub_field('photos_presse')): ?> // my repeater field

    <img src="<?php the_sub_field('photo'); ?>" class="artists_menu">
    <?php $first_img = false; ?>

<?php endwhile; ?>

Hope this helps!

Solution 2

@mmdwc is nearly right. Since the repeater is a nested field then get_field wont retrieve any content as your trying to retrieve a sub field.

<?php
    $rows = get_sub_field('repeater_field_name' ); // get all the rows of the sub field repeater
    $first_row = $rows[0]; // get the first row of the repeater
    $first_row_image = $first_row['sub_field_name' ]; // get the sub field value of the nested repeater
?>

Comments

[mmdwc]

thanks for your reply @Billy Mathews, but it still load all the images... can you please check the source ? amsbooking.fr/mattieumoreau/artists

[Bill]

Sorry, I didn't understand your question. You just want to load only 1 post? @user2882154

[mmdwc]

no I want to load the first image from the repeater field from all posts.

[mmdwc]

I have 7 posts. all posts have a repeater field with 3 or 4 images. I would like to get the first image from repeater field of all posts. here I get the 3 or 4 images of all posts. you see what I mean ?

[Bill]

Ah ok, 1 sec I will change my answer