Quick Start

Get a new field type on the front end in under five minutes. This guide adds an Icon Picker field to a post and renders it in a template.

1. Create a field group

In the WordPress admin go to ACF → Field Groups → Add New. Give the group a name — for example, “Post Options” — and set the location rule to Post Type → is equal to → Post.

2. Add a field

Click Add Field. In the field type dropdown you’ll see an Extra Fields section. Select Icon Picker.

Fill in the basics:

Leave all other settings at their defaults and click Update to save the field group.

3. Add a value in the editor

Open any post in the editor. Scroll to the “Post Options” meta box and click the icon button to pick an icon. Publish or update the post.

4. Display the value in a template

Extra Fields returns values through the standard ACF get_field() / the_field() API. For Icon Picker the value is a CSS class string (e.g. dashicons dashicons-star-filled).

<?php
$icon = get_field('post_icon');
if ( $icon ) : ?>
  <span class="<?php echo esc_attr( $icon ); ?>" aria-hidden="true"></span>
<?php endif; ?>

If you use the block editor you can also call get_field() inside a custom block or a Query Loop block template part.

5. Try another field type

Swap the field type for any other Extra Field — Date Range, Country, Star Rating, and so on. The same get_field() call retrieves the value; each field type’s reference page documents the exact return format.