Missing Menu Item id from wordpress menu

0 Views

I have just noticed that my menu items id are not getting generated by wordpress.

I expect it to be something like this

Read More
<li id='menu-item-2091' class='menu-item menu-item-209'>
<a href='www.mysite.com/members/<?php echo $user_info->user_login; ?>'>Profile</a></li>

but i get this without the menu item id. 

<li class='menu-item menu-item-209'>
<a href='www.mysite.com/members/<?php echo $user_info->user_login; ?>'>Profile</a></li>

This error is occurring in my main menu, but my top menu seems to generate the menu item id properly.

I have looked around the menus area and can’t find any clues why??

Post Views: 0

Related posts

2 comments

  1. Here is a filter that hacks it out

    add_filter ('wp_nav_menu_items','gfb_missing_id_fix', 10, 2);
function gfb_missing_id_fix($menu, $args) {
    if($args->theme_location == "primary-menu"){
      $dom = new DOMDocument;
      $dom->loadHTML($menu);
      foreach($dom->getElementsByTagName('li') as $element ) {
        $classes = $element->getAttribute("class");
        preg_match("/menu-item-d+/", $classes, $output_array);
        $element->setAttribute("id", $output_array[0]);
      }
      $menu = $dom->saveHTML();
    }
    return $menu;
}

  2. General info

    I use my navigation twice (mobile and desktop with different menu ids) and only the second menu is missing the item ids. This makes sense, because it secures that menu-item-ids are only used once.

    JQuery Solution

    For me the following javascript / jquery solution does the trick. It adds menu-id-ID (with ID as the actual menu-item-id) to each menu item.

    var $mainMenu = $("#main-nav"); // your menu_id used in wp_nav_menu
$mainMenu.find("li").each(function(index, element) {
  var $element = $(element);
  var classes = $element.attr("class"),
      ID = classes.match(/menu-item-(d+)/)[1];
    $element.attr("id", "menu-id-" + ID); // here 'menu-id-' is prepended to the actual ID
});

Comments are closed.