Append CSS Style to ACF Select Field Options

• idnshouter

• July 31, 2021 at 9:58 pm

Hi,

I have the following function ini my theme:

function acf_load_style_field_choices( $field ) {
	
	if ( 'post_type_name' == get_post_type() ) {
		$field['choices'] = array();
		if( have_rows('option_field_name', 'option') ) {
			while( have_rows('option_field_name', 'option') ) {
				the_row();

				$value = get_sub_field('sub1');
				$label = get_sub_field('sub2');
				$field['choices'][ $value ] = '<span style="font-style: italic;">'.$label.'</span>';
			}
		}
		return $field;
	}
}
add_filter('acf/load_field/name=field_name', 'acf_load_style_field_choices');

The problem is the span HTML tag is not parsed.

How can i get it to work?

Thanks ACF

• John Huebner

• August 4, 2021 at 3:48 pm

A normal select field cannot have html included in the label for each choice. It can be done with a select field with the “Stylized UI” setting on, this converts the select field to a select2 field.

• idnshouter

• August 5, 2021 at 5:43 am

I see, my bad for not looking and testing for any option first, thanks mr. John, this is really help me out.