starting-logo

Displaying Parent ACF Repeater Fields for all Child Pages in Elementor

Recently at SEO Empire while redesigning a popular website QLD Travels, a strange problem was encountered. The clients initially asked to provide fields for Quick Links on all pages, locations, tours & accommodations which they will add themselves. Quite easy enough, ACF (Advanced Custom Fields Pro) was used & a repeater field with Link Label & Link URL was added conveniently. This site is gigantic in nature with over 5000+ pages & even more directory listings for accommodations & tours.

Once we were near launch, it was revealed that all child pages should show the same links which were added to the top level parent. There was another complexity as some pages were 3 or 4 tier nested. Another small complexity was to look for the same ACF Repeater Fields on each page as well & if those fields are not empty (there are labels & links) for a particular page then rather showing the top level parent field values, field values from that particular page should be shown.  

As you can see in the present image as an example, they wanted All Child pages to show field values from Airlie Beach Travel Information page, if an inner page doesn’t have there own set of field values. With limited time & obviously an Elementor Template for all inner pages, this is a little difficult. So I decided to write a custom shortcode and place it in functions.php file. The sole purpose was to curtail this situation & finish the project in time. 

Generally, while templating it isn’t difficult to show parent fields on direct child but it is a little difficult to get field values from the top level parent. Fortunately, WordPress Codex has all that is required to implement this & I was able to successfully get this done with a little bit of effort.  

The Solution

Here is the function which will achieve the same. Hopefully, it will help you, if you are in the same situation 🙂

				
					function syed_show_links() {
$firstParent = wp_get_post_parent_id($post->ID);
$firstPageName = get_the_title($firstPage);

 $ancestors=get_post_ancestors($post->ID);
 $root=count($ancestors)-1;
 $parent = $ancestors[$root];
 $parentPageTitle = get_the_title($parent);

if(have_rows('navigation_links', $firstPage)) {
while ( have_rows('navigation_links', $firstPage) ) { 
the_row();
$link = get_sub_field('link_to_label');
$label = get_sub_field('link_label');

echo '<div class="parentNavigation"><a href="';
echo $link;
echo '">';
echo $label;
echo '</a></div>';
 
}
}
else {
while (have_rows('navigation_links',$parent)) {
the_row();
$link = get_sub_field('link_to_label');
$label = get_sub_field('link_label');

echo '<div class="parentNavigation"><a href="';
echo $link;
echo '">';
echo $label;
echo '</a></div>';

}
}
}
				
			
Whats Next

Let's work together.

If you’d like to talk about a project you want help with or need an advice regarding anything WordPress or Web, just drop me a message.

I’m currently available for full-time job, anything related to WordPress/Web Development or Hybrid Mobile Applications. 

Leave a Reply

Your email address will not be published. Required fields are marked *