In this example, my ACF group is named services
and the repeater sub-field is named services_list
. This group is attached to my ACF Options page.
Why would I use a group within an Options page?
The group feature in Advanced Custom Fields is useful when organizing, even on an Options page. Depending on your usage, this UI can help guide the user in regards to theme & functionality choices. Similar to passing a $post_id
to target a specific post object, you need to pass a second parameter to target the options page.
<?php
// Stop if there's nothing to display.
if ( ! have_rows( 'services', 'option' ) ) {
return false;
}
if ( have_rows( 'services', 'option' ) ) : ?>
<?php while ( have_rows( 'services', 'option' ) ) : the_row();
// Services Sub Repeater.
if ( have_rows( 'services_list' ) ) : ?>
<ul class="services">
<?php
while ( have_rows( 'services_list' ) ) : the_row();
$image = get_sub_field( 'icon' );
$title = get_sub_field( 'service_title' );
?>
<li class="services-single">
<img src="<?php echo esc_url( $image['sizes']['thumbnail'] ); ?>" alt="<?php echo esc_html( $image['alt'] ); ?>"?>
<?php echo esc_html( $title ); ?>
</li>
<?php endwhile; ?>
</ul>
<?php endif; ?>
<?php endwhile; ?>
<?php endif; ?>
Additional Reading:
- ACF docs: Get Values from an Options Page
- ACF docs: Group
- ACF docs: Repeater
Hi Allison, thank you very much for your explanation. I found it very useful.
I have a similar issue —
I made an ACF called Icon (post id is 348) and linked it to my Options Page called School Settings
Inside of Icon I have a field called School with a name (school_header) that is a repeater field
I am trying to loop through this repeater and school icons
These images will display in our custom header .php template as a list
Attempts:
We have tried to use the word ‘option’, ‘options’, and ‘icon’ instead of 348
Here is my code:
<img src="” />
Hey there, copy/pasting code errors out in the comments so I can’t see your current code. If you want to save it as a .php / etc. and email me, I’m available at: hello@allisontarr.com.