Adding field elements after the menu item anchor

• peterts

• November 17, 2017 at 12:05 pm

Hi I followed the guide:
https://www.advancedcustomfields.com/resources/adding-fields-menu-items/

This i got to work fine. But i wondered if i can use the above method but append the field outside the menu items closing anchor tag rather than inside it?

My intention is to have a hover popup that appears on certain menus that displays text and links (via the wysiwig editor). Currently using above guide, i can only put the field within the exisiting menu item’s link which isnt ideal.

Many thanks for the help
Pete

• gummi

• November 24, 2017 at 5:55 pm

Hi

You can try other filter that wordpress provides, for example, ‘walker_nav_menu_start_el’.
https://developer.wordpress.org/reference/hooks/walker_nav_menu_start_el/

This is basically the hook i used to do my mega menu too 😉

So, your code would look something like:

add_filter('walker_nav_menu_start_el', 'append_da_damn_hover_popup', 15, 2);
function append_da_damn_hover_popup($item_output, $item) {
    // if there's no content, just return the <a> directly
    if (! get_field('popup_content', $item)) {
        return $item_output;
    }

    $popup = '<div class="menu-popup">';
    $popup .= get_field('popup_content', $item);
    $popupt .= '</div>';

    return $item_output.$popup;
}

Cheers. 🤠