ACF and Menu X Pro

[awecesar]

Hey,
I’m using X Pro and created a header via the pro builder and added a menu to it.
I used ACF to create a custom field in the menu selection.
All I need now is a way to display the entered value on the frontend in the menu. I think since the navigation is edited through the X Pro header Builder that my solution is NOT working. At the moment I am using this code:

add_filter('wp_nav_menu_objects', 'my_wp_nav_menu_objects', 10, 2);

function my_wp_nav_menu_objects( $items, $args ) {

// loop
foreach( $items as &$item ) {

	// vars
	$icon = get_field('icon', $item);


	// append icon
	if( $icon ) {

		$item->title .= ' <i class="'.$icon.'"></i>';

	}

}


// return
return $items;

}

[rad]

Hi @awecesar,

Thanks for reaching out.

The builder and the theme has its own icon implementation and given that your code adds almost similar icons, then why not use that theme feature?

Then once you add the menu to the builder, just enable the icon

No need for ACF for menu icons , that feature also allows you to use theme built-in icons, or image icons which needs adding the image URL within the menu item’s setting.

Thanks!

[awecesar]

Hey @Rad
Thanks for the info but this is really important for me to understand how the customization works. I know that X has that feature but I really need to know how to add it this way. Could you help me with that or give me a hint?
Thanks!

[rad]

Hi @awecesar,

That would break the existing icon implementation of the theme. Unfortunately, I can’t provide any details about how it was added through the theme, it’s a bit complex.

Your code should work, but that’s only applicable for objects before even HTML menu is generated. But, our theme uses this hook https://developer.wordpress.org/reference/hooks/walker_nav_menu_start_el/ instead of wp_nav_menu_objects

Thanks!