Reusing flex layout multiple times on one page

• pixelboutiqueuk

• September 30, 2020 at 11:17 pm

I have a ‘flexible-content’ field called coaching_flex_sections.
In here I have a ‘layout’ called flex_coaching_details.

I want to be able to use that layout multiple times in different places on one page.
So in the page editor, I added this layout block 6 times.

It is outputting the 6 blocks, but reapeated six times, like so:

Title One
Title One
Title One
Title One
Title One
Title One

Title Two
Title Two
Title Two
Title Two
Title Two
Title Two

and so on down to Title Six…

Can someone explain to me where I have gone wrong as I can’t quite get my head around this.
Here is my code:

Flex template for the page, pulls each block depending on the name:

<?php
/*
Template Name: Coaching (Flex Layout)
*/

get_header();
?>

<?php
	if( have_rows('coaching_flex_sections') ):
	$sections = get_field( 'coaching_flex_sections' );
?>

	<div class="coaching flex-sections">
		<?php
			while( have_rows('coaching_flex_sections') ): the_row();
				// while( have_posts() ): the_post();

					// Loop through flexible fields and load the respective file for each.
					foreach( $sections as $i => $section ) {
						$part = get_stylesheet_directory() . '/_template-parts/flex-layout/sections/' . $section['acf_fc_layout'] . '.php';

						if ( file_exists( $part ) ) {
							include( $part );
						} else {
							echo '<!-- Error: No such flexible field type "'. esc_html($section['acf_fc_layout']) .' at '. esc_html($part) .'" -->';
						}

					}
				// endwhile;
			endwhile;
		?>
	</div>

<?php endif; ?>

Layout template:

<?php
	if ( !isset($section) ) die('Must be accessed through flex-layout.php');

	// Fields used by this section with default values
	$f = shortcode_atts(array(
		'content_appearance' => null,
		'content' => null,
	), $section, 'custom-layout');

	// Extra classes to use on the container
	$classes = array();
	$classes[] = 'appearance-' . $f['content_appearance'];

	// Render the section
	aa_flex_layout_section_start($section, $i, $classes);
?>

	<?php if( get_row_layout() == 'flex_coaching_details' ): ?>

		<!-- flex section content start -->
		<?php $coaching_details_subheading = get_sub_field('flex_coaching_details_subheading'); ?>
		<?= ($coaching_details_subheading)? '<h2 class="heading">' . $coaching_details_subheading . '</h2>' : ''; ?>
		<!-- flex section content end -->
	<?php endif; ?>

<?php
	aa_flex_layout_section_end();

Many thanks

• BinitaReddy

• January 20, 2021 at 10:49 pm

How can I render a block multiple times within a view in a twig template?

• John Huebner

• January 21, 2021 at 12:28 am

<?php
/*
Template Name: Coaching (Flex Layout)
*/

get_header();
?>

<?php
  if( have_rows('coaching_flex_sections') ):
  
  // not needed
  //$sections = get_field( 'coaching_flex_sections' );
?>

  <div class="coaching flex-sections">
    <?php
      while( have_rows('coaching_flex_sections') ): the_row();
        // while( have_posts() ): the_post();
          
          // Loop through flexible fields and load the respective file for each.
          
          // double loop over rows -- remove
          // foreach( $sections as $i => $section ) {

            // change to get_row_layout()
            $part = get_stylesheet_directory().'/_template-parts/flex-layout/sections/'.get_row_layout().'.php';

            if ( file_exists( $part ) ) {
              include( $part );
            } else {
              echo '<!-- Error: No such flexible field type "'. esc_html($section['acf_fc_layout']) .' at '. esc_html($part) .'" -->';
            }

          // } // end of nested double loop - remove
        // endwhile;
      endwhile;
    ?>
  </div>

<?php endif; ?>