ACF Repeater Field in Flexible Content

Question

I am trying to add a repeater field into a flexible content row but for some reason nothing is being output. I have checked the fields and they seem correct so could someone please point me out to where I am going wrong? Thanks

        <?php if(get_row_layout() == "collection_title"): // layout: Collection Title ?>

            <div>
                <h4><?php the_sub_field("collection_title"); ?></h4>
            </div>


        <?php elseif(get_row_layout() == "collection_images"): // layout: Collection Images ?>


                <?php if(get_field('collection_images_grid')): ?>

                    <?php while(has_sub_field('collection_images_grid')): ?>

                        <div class="collections">

                            <span><strong><?php the_sub_field('collection_detail'); ?></strong></span>

                            <a href="<?php the_sub_field('product_link'); ?>">

                                <img src="<?php the_sub_field('collection_image'); ?>"/>

                            </a>

                        </div>

                    <?php endwhile; ?>

                 <?php endif; ?>

        <?php endif; ?>

    <?php endwhile; ?>

Answer 1

your <?php if(get_field('collection_images_grid')): ?> statement should be <?php if(get_sub_field('collection_images_grid')): ?>

Answer 2

            <?php

            // check if the flexible content field has rows of data
            if( have_rows('the_process') ){

            // loop through the rows of data
            while ( have_rows('the_process') ) : the_row();

            if( get_row_layout() == 'content' ){

            ?>
            <h1><?php the_sub_field('headline');?></h1>
            <h2 class="tagLine paddingBottom80"><?php the_sub_field('sub_headline');?></h2>

            <div class="steps clearAfter">

            <?php if(get_sub_field('process_steps')): ?>    
            <?php
            while(has_sub_field('process_steps')): 
            ?>



            <!--Step-->
            <div class="processStep rel boxSizing">

            <img src="images/ph.png" width="200" height="200" class="borderRadius50Perc imageBorder boxSizing" />
            <div class="processBox border1 padding20 clearAfter">
            <div class="third processNumber boxSizing font70 darkBlue">
            <div class="border1 padding20">
            <?php echo $i;?>
            </div>
            </div>
            <div class="twothird  boxSizing processContent">
            <h3><?php the_sub_field('step_headline'); ?></h3>
            <div class="processContentTxt grey">
            <?php the_sub_field('step_content'); ?>
            </div>
            </div>
            </div>
            </div>

            <!--Step-->
            <?php endwhile; ?>
            <?php endif; ?>             




            </div>


            <?php   
            }
            endwhile;
            }
            ?>

Answer 3

You should change one thing in your code. Change <?php if(get_field('collection_images_grid')): ?> to <?php if(get_sub_field('collection_images_grid')): ?> and it will works! I've simulate your issue and after change to sub_field it works. Your code will be like this:

<?php if(get_row_layout() == "collection_title"): // layout: Collection Title ?>

            <div>
                <h4><?php the_sub_field("collection_title"); ?></h4>
            </div>


        <?php elseif(get_row_layout() == "collection_images"): // layout: Collection Images ?>


                <?php if(get_sub_field('collection_images_grid')): ?>

                    <?php while(has_sub_field('collection_images_grid')): ?>

                        <div class="collections">

                            <span><strong><?php the_sub_field('collection_detail'); ?></strong></span>

                            <a href="<?php the_sub_field('product_link'); ?>">

                                <img src="<?php the_sub_field('collection_image'); ?>"/>

                            </a>

                        </div>

                    <?php endwhile; ?>

                 <?php endif; ?>

        <?php endif; ?>

    <?php endwhile; ?>

I had a little problems to use repeaters inside acf flexible content. So if I could say something to help in this cases is to use a variable to print the elements of repeater array, like this:

    <?php if(get_row_layout() == "collection_title"): // layout: Collection Title ?>

                    <div>
                        <h4><?php the_sub_field("collection_title"); ?></h4>
                    </div>


                <?php elseif(get_row_layout() == "collection_images"): // layout: Collection Images ?>

    <?php if(get_sub_field('collection_images_grid')): ?> // considering that collections_images_grid are a repeater 

<?php $collection_image = get_sub_field('collection_images_grid');?>

    <?php echo $collection_image['url']; ?> <?php echo $collection_image['alt']; ?> //Or something that you would like to use [... and than the rest of code]

Answer 4

Assuming your repeater field is collection_images_grid, you should loop through the items with have_rows(), like this:

<?php if(get_row_layout() == "collection_title"): // layout: Collection Title ?>
  <div>
    <h4><?php the_sub_field("collection_title"); ?></h4>
  </div>
<?php elseif(get_row_layout() == "collection_images"): // layout: Collection Images ?>
  <?php if(have_rows('collection_images_grid')): ?>
    <?php while(have_rows('collection_images_grid')): the_row(); ?>
      <div class="collections">
        <span><strong><?php the_sub_field('collection_detail'); ?></strong></span>
        <a href="<?php the_sub_field('product_link'); ?>">
          <img src="<?php the_sub_field('collection_image'); ?>"/>
        </a>
      </div>
    <?php endwhile; ?>
  <?php endif; ?>
<?php endif; ?>

This essentially checks if the flexible content field has rows of data (<?php if(have_rows('collection_images_grid')): ?>), and then loops through / displays them (<?php while(have_rows('collection_images_grid')): the_row(); ?>).

More details about looping through fields with have_rows(): https://www.advancedcustomfields.com/resources/have_rows/

Answer 5

To debug all the Advanced Custom Fields on a page and get a better understanding of the structure, I often use the following PHP snippet:

echo '<pre>';
var_dump(get_fields());
echo '</pre>';

This helps to make sure the data is available, and figure out how to reach it in the nested structure.