Adding custom menu item to WordPress menu

Question

I have a WordPress menu that has a few menu items I added through the standard (drag and drop) WordPress admin menu feature. Recently I had to add another item to the menu that generates a dynamic href link. I achieved that using the following code in my functions.php file:

//add my profile menu item dynmacially to the members menu (generate user name based on current user logged in)

add_filter('wp_nav_menu_items','add_profilelink_in_menu', 10, 2);

function add_profilelink_in_menu( $items, $args ) {
if( $args->theme_location == 'secondary')  {

 global $current_user;            
       //converts user id to username           
       $user_info = get_userdata($current_user->ID);

$items .='<li id="menu-item-2091" class="menu-item menu-item-2091">
 <a href="https://www.mysite.com/members/' . $user_info->user_login .'">Profile</a>
 </li>';

  }
  return $items;  
}

My problem is that this menu item is added to the end of the menu and the regular WordPress Menu classes such as 'current-menu-item' don't get applied to this item. Is there a way for me to control the position of where this menu item is added to (For example: add this item after the first two items?)

and how can I get WordPress to treat this dynamically generated menu item as a regular menu item and have it add all the classes that it adds the other menu items (created through the WordPress menu feature)?

Thanks for any help.

would you like to try jquery?

loQ
– loQ

2012-11-04 03:48:07 +00:00
Commented Nov 4, 2012 at 3:48 — loQ
– loQ, Commented Nov 4, 2012 at 3:48

loQ · Accepted Answer · 2012-11-10 03:59:17Z

1

Here's the logic that you can base using jquery

  //suppose your menu is this
  <ul id="secondary_nav">
    <li id="li_unique_id_1"><a href="">menu 1</a></li>
    <li id="li_unique_id_2"><a href="">menu 2</a></li>
    <li id="li_unique_id_4"><a href="">menu 4</a></li>
</ul>

 //the jquery workaround
 //place this in your footer
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
<script type='text/javascript'>
$(function(){
    <?php
     global $current_user;            
     //converts user id to username           
     $user_info = get_userdata($current_user->ID);
    ?>
    $("<li id='menu-item-2091' class='menu-item menu-item-209'><a href='https://www.mysite.com/members/<?php echo $user_info->user_login; ?>'>Profile</a></li>").insertAfter("#secondary_nav #li_unique_id_2");     
});   
</script>

You can also use insertBefore function

answered Nov 10, 2012 at 3:59

loQ

2,12119 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

George Reith Over a year ago

This is awful. There is no reason to use JavaScript here.

loQ Over a year ago

@GeorgeReith at least leave us a better solution you have :)

Mahmood Rehman · Accepted Answer · 2012-11-05 04:59:37Z

-1

Did you check Wordpress menu option in the themes->menu for this ? You can easily add menu from there also you can set custom menu from there.Hope it will help you.

answered Nov 5, 2012 at 4:59

Mahmood Rehman

4,3377 gold badges43 silver badges76 bronze badges

2 Comments

Dmitri Over a year ago

thanks I have, but the problem is that the link of the menu item is generated dynamically so wordpress themes->menu does not allow that functionality.

Mahmood Rehman Over a year ago

Yes wordpress menus are generated dynamically but you can configure there order as well as create custom menu with custom url option form admin side.

Collectives™ on Stack Overflow

Adding custom menu item to WordPress menu

2 Answers 2

2 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related