I know how to create wp menus using the functions.php and diaplay it in my sote wherever the menu is required (e.g top menu, footer menu) I even know how to style it using custom CSS.

I would like to know if it's possible to add HTML elements to a dynamic custom menu. for example: I want to build a menu when each li item will look like this:

<li><a><span>number here</span></a>
<a href="the permalink">
<h4>post title</h4></a>
<h5>name of the author</h5>

is there a way or function to output such menu? basically add some extra html inside li item?

also inside the:

<span>number here</span>

I would like to add a counter which will display a number for each posts (1-5)

Any help will be appreciated Thanks

  • look in the related column to the right or search this site for Custom Walker.
    – Milo
    Sep 2, 2012 at 16:41

2 Answers 2


I made a dynamic menu using this code:

//add login/logout link to menu

add_filter('wp_nav_menu_items', 'wps_add_login_logout_link', 10, 2);
function wps_add_login_logout_link($items, $args) {
    $login = __('Sign in');
    $logout = __('Sign out');

    $menu_id = '15';
    $menu_id2 = '16'; 

    if ( ! is_user_logged_in() )
        $link = '<a href="' . site_url('log-in-log-out')  . '">' . $login . '</a>';
        $link = '<a href="' . wp_logout_url('log-in-log-out') . '">' . $logout . '</a>';

    if ( $args->menu == $menu_id )
        $items .= '<li>'. $link .'</li>';
    elseif ( $args->menu == $menu_id2 )
        $items .= '<li>'. $link .'</li>';

    return $items;

You should be able to grab the $items and $args variable to play with their contents. I hope this helps

Sorry, I forgot to mention that I was using the 'Catalyst' framework, so the way that the $args object is used to grab the menu id may be different in a normal WP site.


If you are using wp_nav_menu() you would better off using wp_get_nav_menu_items() if you want to create a customized markup. The function can returns an array, so you will need more work to iterate the menu items, the 'current-menu-item' class manually and other details. But on the other hand you can do a customized markup & additional functions like post count.

$args = array(
    'order'                  => 'ASC',
    'orderby'                => 'menu_order',
    'post_type'              => 'nav_menu_item',
    'post_status'            => 'publish',
    'output'                 => ARRAY_A,
    'output_key'             => 'menu_order',
    'nopaging'               => true,
    'update_post_term_cache' => false
$menu_items = wp_get_nav_menu_items('product-section', $args);
foreach($menu_items as $item){
    print_r($items); // just to make sure what is in the array

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.