Hi
I’m hoping someone can help me as I’m banging my head against a brick wall here. I’m using ACF Pro and Elementor Pro. I have setup a CPT using the CPT UI plugin and have then created an ACF group with a checkbox field type. I am using Elementor Pro to dynamically pull the selected checkbox choices into my page template. I don’t want the choices to display as an inline list with comma separation, I want them to display as an unordered bullet list. I found some code to add to my functions.php so that I can add a shortcode to the page which displays the choices as mentioned, this works well.
However, I don’t want to stop there. I would like each selected choice to show a different Font Awesome icon for each ACF checkbox choice that’s been selected. So as an example, I’m trying to list office amenities such as parking, cafe, bike store, wifi and I want these in an unordered list with the icon for each displaying on the left of the text. I’ve managed to set it up to use the same Font Awesome icon for each but am stumped as to how to get different icons for each. I am not confident in PHP so please bear with me.
This is the code I have in my functions.php to make the shortcode…
function custom_acf_shortcode( $atts ) {
// extract attributs
extract( shortcode_atts( array(
'field' => 'property_amenities',
'post_id' => false,
'format_value' => true
), $atts ) );
$value = get_field( $field, $post_id, $format_value );
if( is_array($value) )
{
$ul = '<ul class="fa-ul">';
foreach($value as $val) {
$ul .= '<li><span class="fa-li"><i class="fas fa-check-square"></i></span>' .$val. '</li>';
}
$ul .= '</ul>';
$value = $ul;
}
return $value;
}
add_shortcode( 'custom_acf', 'custom_acf_shortcode' );
Any help would be much appreciated.
Many thanks!!
