wordpress wp_nav_menu – add name property to <a>

4 Views

in wordpress, I am fetching menu using wp_nav_menu() function. It will list menus in following form. 

<ul>
   <li><a href="url">AA</a></li>
   <li><a href="url">BB</a></li>
   <li><a href="url">CC</a></li>
</ul>

I want to add one more property to tag. I want it in following form.

Read More
<a href="url" name="aa">AA</li>
<a href="url" name="bb">BB</li>
<a href="url" name="cc">CC</li>

name property should have value equal to link text but in lower case. i.e. is menu text is AA then name property should have aa

Post Views: 4

Related posts

Leave a Reply

1 comment

  1. You can do this with WordPress Walkers. They can be a bit tricky at first, but very powerful. This is a rough implementation, you would probably need to improve it.

    First, you extend the Walker_Nav_Menu to your needs:

      class my_nav_menu extends Walker_Nav_Menu
      {
            function start_el(&$output, $item, $depth, $args)
            {
                 $output .= '<li><a href="' . get_post_link($item->ID) . '" name="' . $item->post_name .'" >';
                 $output .= apply_filters( 'the_title', $item->post_title, $item->ID ) ;
                 $output .= '</a></li>';
            }
      }

    Then you pass an instance of your class to wp_nav_menu:

    wp_nav_menu( array( 'container_class' => 'menu-header', 'theme_location' => 'primary' , 'walker' => new my_nav_menu() ) );

    This will output menu elements like this:

    <li><a name="test-page" href="http://mydomain.foo/?page_id=1">Test Page</a></li>