WordPress.org

Ready to get started?Download WordPress

Forums

Advanced Custom Fields
[resolved] Display Repeater Fields on Index.php (2 posts)

  1. casimir
    Member
    Posted 1 year ago #

    I am attempting to display a couple of Repeater fields on an index.php homepage. I created a Custom Post Type called 'home' that I am using to display add/edit the Repeater custom fields.

    I am able to successfully display the first Repeater field for 'Our Work', however, the second Repeater field 'Our Blog' does not display. If I remove the if (get_sub_field('title')) statements, then both repeater fields display properly.

    Any recommendations on how to display repeater fields on the index.php using a custom post type?

    <? get_header(); ?>
    
    <? $mainPosts = new WP_Query(array('post_type' => 'home')); while($mainPosts->have_posts()): $mainPosts->the_post(); ?>
    
    <section>
    
    <!--Main: Repeater Field-->
    <article id="post-<? the_ID(); ?>" <? post_class(); ?>>
    <div class="main">
    
    <? while (has_sub_field('main')): $anchorTitle = str_replace(' ', '-', get_sub_field('title')); ?>
    <div class="content <? acf_main_background(); ?>" id="<? echo $anchorTitle ?>">
    	<div class="row">
    		<div class="grid_12">
    			<h2><? the_sub_field('title'); ?></h2>
    		</div><!--4-->
    
    		<? if (get_sub_field('title') == 'Our Work'): ?>
    		<!--Our Work-->
    		<div class="grid_12">
    			<div class="row">
    			<? $workPosts = new WP_Query(array('post_type'=>'work', 'orderby'=>'date', 'order'=>'DESC', 'posts_per_page'=>'3')); ?>
    			<? $i=0; while($workPosts->have_posts()): $workPosts->the_post(); if ($i >0 && $i%3==0): ?>
    			</div><!--Row-->
    			<div class="row">
    			<? endif; ?>
    				<div class="grid_4 column">
    					<div class="mini">
    						<a href="<? the_permalink() ?>" class="cover">
    							<div class="cover-box" <? if (get_field('color')): ?>style="background:<? the_field('color'); ?>"<? endif; ?>>
    								<div class="view icon"></div>
    							</div><!-- Cover-->
    							<? the_post_thumbnail('full', array('class'=>'zoom')); ?>
    						</a>
    						<h3><? the_title() ?></h3>
    						<h4><? echo strip_tags( get_the_term_list($post->ID, 'industry', '', ',', '')); ?></h4>
    					</div><!-- Mini -->
    				</div><!--Grid 4-->
    			<? $i++; endwhile; wp_reset_query(); wp_reset_postdata(); ?>
    			</div><!--Row-->
    		</div><!--Grid 8-->
    
    		<? elseif (get_sub_field('title') == 'Our Blog'): ?>
    		<!--Our Blog-->
    		<div class="grid_12">
    			<div class="row">
    			<? $blogPosts = new WP_Query(array('post_type'=>'blog', 'orderby'=>'date', 'order'=>'DESC', 'posts_per_page'=>'2')); ?>
    			<? $i=0; while($blogPosts->have_posts()): $blogPosts->the_post(); if ($i >0 && $i%2==0): ?>
    			</div><!--Row-->
    			<div class="row">
    			<? endif; ?>
    				<div class="grid_6 column">
    					<div class="mini">
    						<a href="<? the_permalink() ?>" class="cover">
    							<div class="cover-box" <? if (get_field('color')): ?>style="background:<? the_field('color'); ?>"<? endif; ?>>
    								<div class="view icon"></div>
    							</div><!-- Cover-->
    							<? the_post_thumbnail('full', array('class'=>'zoom')); ?>
    						</a>
    						<h3><? the_title() ?></h3>
    						<h4><? echo strip_tags( get_the_term_list($post->ID, 'industry', '', ',', '')); ?></h4>
    					</div><!-- Mini -->
    				</div><!--Grid 4-->
    			<? $i++; endwhile; wp_reset_query(); wp_reset_postdata(); ?>
    			</div><!--Row-->
    		</div><!--Grid 8-->
    
    		<? elseif (get_sub_field('title') == 'Our Services'): ?>
    		<!--Our Services-->
    		<div class="grid_8">
    			<div class="row">
    			<? $i=0; while (has_sub_field('content')): if ($i >0 && $i%2==0): ?>
    			</div><!--Row-->
    			<div class="row">
    			<? endif; ?>
    				<div class="grid_4 column">
    					<h3><? the_sub_field('title'); ?></h3>
    					<? the_sub_field('detail'); ?>
    					<img src="<? the_sub_field('photo'); ?>" class="zoom">
    				</div><!--Grid-->
    			<? $i++; endwhile; ?>
    			</div><!--Row-->
    		</div><!--Grid-->
    
    		<? elseif (get_sub_field('title') == 'Our Clients'): ?>
    		<!--Our Clients-->
    		<div class="grid_8">
    			<div class="row ">
    			<? $i=0; while (has_sub_field('content')): $images = get_sub_field('photos'); foreach ($images as $image): if ($i >0 && $i%4==0): ?>
    			</div><!--Row-->
    			<div class="row">
    			<? endif; ?>
    				<div class="grid_2 duo column">
    					<img src="<? echo $image['url']; ?>" alt="<? echo $image['alt']; ?>" rel="tooltip" title="<? echo $image['alt']; ?>" class="zoom logo tip">
    				</div><!--Grid-->
    			<? $i++; endforeach; endwhile; ?>
    			</div><!--Row-->
    		</div><!--Grid-->
    		<? endif; ?>
    
    	</div><!--Row-->
    </div><!--Content-->
    <? endwhile; ?><!--Main-->
    
    </div><!--Main-->
    </article><!--Main-->
    
    </section>
    
    <? endwhile; wp_reset_query(); wp_reset_postdata(); ?>
    
    <? get_footer(); ?>

    http://wordpress.org/extend/plugins/advanced-custom-fields/

  2. casimir
    Member
    Posted 1 year ago #

    With the help of Elliot, I finally figured it out.

    I changed the way I initialized the main loop from using WP_Query:

    <? $mainPosts = new WP_Query(array('post_type'  => 'home' )); while($mainPosts->have_posts()): $mainPosts->the_post(); ?>

    to query_posts:

    <? query_posts(array('post_type'  => 'home' )); while (have_posts()): the_post(); ?>

    For the 'Work' and 'Blog' WP_Query nested loops, I changed the way I closed them from:

    <? $i++; endwhile; wp_reset_query(); wp_reset_postdata(); ?>

    to:

    <? $i++; endwhile; wp_reset_postdata(); ?>

    To summarize, I am using query_posts to display the 'home' Custom Post Type as the main loop, and WP_Query to display the inner nested loops.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic