Image Selector

A radio or checkbox grid that uses image thumbnails instead of text labels. Editors see a visual CSS grid of choices and click to select. Suitable for layout pickers, template selectors, icon sets from external URLs, or any choice where a preview image makes the option self-explanatory.

Pro field

Image Selector requires the Extra Fields for ACF Pro license.

Settings

SettingDefaultOptionsDescription
Choices(empty)One choice per line: value | Label | https://image-url.jpg
Multiplefalseon/offAllow selecting more than one option.
Columns325Number of columns in the image grid.
Show Labeltrueon/offDisplay the text label beneath each image.
Return Formatvaluevalue · label · objectWhat get_field() returns for each selection.

Choices format

full-width | Full Width | https://cdn.example.com/layouts/full.png
sidebar-left | Sidebar Left | https://cdn.example.com/layouts/sidebar-l.png
sidebar-right | Sidebar Right | https://cdn.example.com/layouts/sidebar-r.png

Return values

Single select

$layout = get_field('page_layout');

// return_format: 'value'
// "sidebar-left"

// return_format: 'label'
// "Sidebar Left"

// return_format: 'object'
// ['value' => 'sidebar-left', 'label' => 'Sidebar Left', 'image' => 'https://...']

Multi-select (multiple: true)

Returns an array of values, labels, or objects.

$selected = get_field('enabled_features');
// ['hero', 'testimonials', 'faq']  (return_format: 'value')

Usage

Switching templates by layout choice

$layout = get_field('post_layout'); // return_format: 'value'

get_template_part('template-parts/layout', $layout);
// Loads: template-parts/layout-sidebar-left.php

Multi-select: conditional section rendering

$sections = get_field('page_sections'); // return_format: 'value', multiple: true

if ($sections) {
    if (in_array('hero', $sections, true)) {
        get_template_part('sections/hero');
    }
    if (in_array('testimonials', $sections, true)) {
        get_template_part('sections/testimonials');
    }
}

Adding a CSS class from the selection

$variant = get_field('card_style');
if ($variant) {
    echo '<div class="card card--' . esc_attr($variant) . '">';
}