Create an account menu similar to the wpmudev menu item

I am trying to add an 'account-menu' menu item to my primary menu that includes an avatar and sub menu items like login/out and edit profile links. It's similar to what your own wpmudev site uses, and also what the wordpress admin bar uses.

So far the best I can do is add a login/out item using the following code:

add_filter( 'wp_nav_menu_items', 'add_loginout_link', 10, 2 );
function add_loginout_link( $items, $args ) {
if (is_user_logged_in() && $args->theme_location == 'primary') {
$items .= '<li> <a href=&quot;'. wp_logout_url() .'&quot;>Log Out</a></li>';
}
elseif (!is_user_logged_in() && $args->theme_location == 'primary') {
$items .= '<li><a href=&quot;'. site_url('wp-login.php') .'&quot;>Log In</a></li>';
}
return $items;
}

But I can't figure out how to show the avatar, and include the login item within that submenu. I don't know much about PHP, so any help with the code would be greatly appreciated!

Thanks so much for the help!

Michael

[attachments are only viewable by logged-in members]

  • Aprendio LLC
    • Site Builder Child of Zeus

    I did see that post during my search, but every time I try to put it in it breaks my site (evidence of my php ignorance). :slight_smile:

    This is the code from that linked page that I had been trying to put in:

    <?php
    global $current_user;
    get_currentuserinfo();
    echo get_avatar( $current_user->ID, 64 );
    ?>

  • Aprendio LLC
    • Site Builder Child of Zeus

    That’s OK. I was delayed too.

    When I try to add the code for the avatar I get an error 500 and the site won’t load. This is the code I’m fiddling with to get a menu to look that the one above.

    `

    add_filter( ‘wp_nav_menu_items’, ‘add_loginout_link’, 10, 2 );

    function add_loginout_link( $items, $args ) {

    if (is_user_logged_in() && $args->theme_location == ‘primary’:wink: {

    $items .= ‘

  • Log Out
  • ‘;

    }

    elseif (!is_user_logged_in() && $args->theme_location == ‘primary’:wink: {

    $items .= ‘ <?php

    global $current_user;

    get_currentuserinfo();

    echo get_avatar( $current_user->ID, 64 );

    ?>’

  • Log In
  • Sajid
    • DEV MAN’s Sidekick

    Hi @Michael

    Hope you are doing good today :slight_smile:

    The code in your last reply is broken, there are lots of mistakes in it, that's why its breaking your site.

    Try using following code and let me know how it goes, it will add avatar with logout link for logged in users only, as seen in attached screenshot. Feel free to change the dimensions of avata image.

    add_filter( 'wp_nav_menu_items', 'add_loginout_link', 10, 2 );
    function add_loginout_link( $items, $args ) {

    global $current_user;
    get_currentuserinfo();
    $avata = get_avatar( $current_user->ID, 64 );

    if (is_user_logged_in() && $args->theme_location == 'primary') {
    $items .= '<li> <a href=&quot;'. wp_logout_url() .'&quot;>'.$avata.' Log Out</a></li>';
    }
    elseif (!is_user_logged_in() && $args->theme_location == 'primary') {
    $items .= '<li><a href=&quot;'. site_url('wp-login.php') .'&quot;>Log In</a></li>';
    }
    return $items;
    }

    Take care and have a nice day :slight_smile:

    Cheers, Sajid

    [attachments are only viewable by logged-in members]

  • Aprendio LLC
    • Site Builder Child of Zeus

    @Sajid

    Thanks so much!! Not only did this work perfectly, but looking at how you did it I was able to figure out some other unrelated questions I had!

    I went through the entire codeacademy php course and still had no idea how to do this. Hopefully I find some good resources to learn php, as it looks like my job is requiring me to do more stuff like this.

    Thanks 100000x!