Get first row from repeater field within loop

I am making a WP-site, using Advanced Custom Fields.
On one page I want to echo a loop with all the posts that has the category “Studio”. Then I want to show the first image from the sub field named “studio_project_dia_img”.
I can get all image from the repeater_field to show, however not just the first

This code works (only it echoes all rows from the repeater field):

Read More
    <div <?php post_class() ?> id="post-<?php the_ID(); ?>">

        <li class="thumbs">
            <a href="studio-single.html" class="clearfix">
            <?php if (get_field('studio_project_dia')) : while(has_sub_field('studio_project_dia')): ?>

                    <img src="<?php echo get_sub_field('studio_project_dia_img', $post->ID); ?>" />
            <?php endwhile; endif; ?>
                    <div class="thumbsText">
                        <h2><?php the_title(); ?></h2>
                        <h3><?php the_tags( 'Tags: ', '&nbsp;/&nbsp; ', ''); ?></h3>
                    </div>
            </a>



        </div>

        <?php edit_post_link('Edit this entry','','.'); ?>

    </div>

<?php endwhile; endif; ?>

this code doesn’t:

    <div <?php post_class() ?> id="post-<?php the_ID(); ?>">

        <li class="thumbs">
            <a href="studio-single.html" class="clearfix">
            <?php if (get_field('studio_project_dia')) : while(has_sub_field('studio_project_dia')): ?>
                    <?php
                        $rows = get_sub_field('studio_project_dia_img', $post->ID);
                        $first_row = $rows[0];
                        $first_row_image = $first_row['studio_project_dia_img'];

                        $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] ?>" />
            <?php endwhile; endif; ?>
                    <div class="thumbsText">
                        <h2><?php the_title(); ?></h2>
                        <h3><?php the_tags( 'Tags: ', '&nbsp;/&nbsp; ', ''); ?></h3>
                    </div>
            </a>



        </div>

        <?php edit_post_link('Edit this entry','','.'); ?>

    </div>

<?php endwhile; endif; ?>

Related posts

Leave a Reply

3 comments

  1. In your first code, add break; after ‘img’ tag like this:

    <?php if (get_field('studio_project_dia')) : while(has_sub_field('studio_project_dia')): ?>
        <img src="<?php echo get_sub_field('studio_project_dia_img', $post->ID); ?>" />
    <?php break; endwhile; endif; ?>
    

    With break, the while loop will stop.

  2. See above, only:

    <?php if (get_field('studio_project_dia')) : while(has_sub_field('studio_project_dia')): ?>
        <img src="<?php echo get_sub_field('studio_project_dia_img', $post->ID); ?>" />
    
    <?php break; endwhile; endif; ?>
    
  3. <?php 
        if(have_rows('client_logo') ):
        while ( have_rows('client_logo') ) : the_row(); 
    ?>
    
    <?php   
        $image = get_sub_field('logo');
        $size = 'full'; // (thumbnail, medium, large, full or custom size)
    
        if( $image ) {
            echo wp_get_attachment_image( $image, $size );
        } 
    ?>
    
    <?php endwhile;
        else :
        // no rows found
        endif;
    ?>
    

    I used this code to get the repeater field then the sub field and get it to display the image hope this helps you find your solution.