Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

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>
</li>

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

share|improve this question
    
look in the related column to the right or search this site for Custom Walker. –  Milo Sep 2 '12 at 16:41
add comment

2 Answers

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
}
share|improve this answer
add comment

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>';
    else
        $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.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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