I can’t get images from a repeater using Advanced Custom Fields WordPress plugin

I have attached the screenshot of my repeater and image Advance Custom Fields.

Image returning a url in a repeater

Read More

I have uploaded threeimages for the repeater images block.

And Now, I am able to get those boats but cant view it on the screen. I open up my inspect element and I see the while loop executing and showing all three boats code.

My Code:

        <?php 
/* 
Template Name: boatProduct 
*/ ?>

<?php get_header(); ?>

            <?php if( have_rows('boat_product_slider') ): while ( have_rows('boat_product_slider') ) : the_row(); ?>
            <div class="product_boat" style="background: url('<?php the_sub_field('slider_image'); ?>'); background-size: cover;">

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

        </div>

        <div id="charter" class="brokerage" style="background: linear-gradient(rgba(255,255,255,0.95), rgba(255,255,255,0.95)), url('<?php the_field('agys_icon'); ?>') no-repeat center 48%; background-size: 80%;  background-attachment: fixed;">


        <h3 style="margin-top:40px;">Specification</h3>
        <p align="justify"><?php the_field('content'); ?></p>
    </div>

<?php get_footer(); ?>

Related posts

1 comment

  1. There’s a slight change you need to make to your code, replacing the_sub_field() with get_sub_field().

    From the get_sub_field() documentation:

    This function will return a sub field value from a repeater field or flexible content field loop. This function is used within a have_rows() loop.

    The the_sub_field() function will print the results. This will not work for you as you’ve set your slider_image to return the “Image Object”.

    From the documentation:

    This function will display a sub field value from a repeater field or flexible content field loop. This function is used within a have_rows() loop.

    This function is the same as echo get_sub_field('name');.


    Edit: “The Loop”

    You have two options on how to handle the WordPress loop:

    Option 1

    The ACF functions need to be used inside the WordPress loop. For example (using page.php from the default TwentySixteen WordPress theme:

    <?php
    // Start the loop.
    while ( have_posts() ) : the_post();
    
    
        // ACF functions should be added here, inside "the Loop"
    
    
        // Include the page content template.
        get_template_part( 'template-parts/content', 'page' );
    
        // If comments are open or we have at least one comment, load up the comment template.
        if ( comments_open() || get_comments_number() ) {
            comments_template();
        }
    
        // End of the loop.
    endwhile;
    ?>
    

    Option 2

    Alternatively, you can add the $post_id parameter to have_rows() to specify which post/page that the ACF fields should come from:

    $post_id: Specific post ID where your value was entered. Defaults to current post ID (not required). This can also be options / taxonomies / users / etc

    $post_id = 123; // This should be the ID of the post/page that contain the ACF fields
    if( have_rows('boat_product_slider', $post_id) ):
    
        // loop through the rows of data
        while ( have_rows('boat_product_slider', $post_id) ) : the_row();
            // ...
    

Comments are closed.