Dropdown menu links from logged in user’s name

I have added this code to my child theme’s functions.php:

    add_filter( 'wp_nav_menu_items', 'my_custom_menu_item');
function my_custom_menu_item($items)
{
    if(is_user_logged_in())
    {
        $user=wp_get_current_user();
        $name=$user->user_firstname; //  
        $items .= '<li><a href="">Hello, '.$name.'</a></li>';
    }
    return $items;
}

This allows my site to display, on the menu, the first name of the user who is logged in.

Read More

However, I want users to have the ability to hover over the “Hello, [FIRST NAME HERE] and have a dropdown menu appear with options such as “My Account” and “Log out”.

I have found two examples. One is from Amazon (a lot more options) and the other is from Spotify (less options, and what I’m going for).

Here is the Spotify example:

enter image description here

What do I need to do to make this possible? Thank you!

Related posts

Leave a Reply

1 comment

  1. Easiest way to solve this is to use CSS to create your drop-down menu. There’s a great tutorial over at W3 Schools right here.

    Basically you’ll give the list item you encapsulate the user’s name in an ID, then set a hover trigger to that to display the menu. They’re really not too complex, but it is strictly with CSS. The only thing the PHP will be doing is pulling out the user’s details to help populate the links so users get to the correct areas.