Using WordPress wp_nav_menu function you can display navigation menus on your site nicely. You can even add the separators between each navigation menu. It can be done by passing these arguments either “link_before, link_after” or “before, after” to your wp_nav_menu funtion. However, you might face the problem with adding separators between each navigation menu.
Let’s say you would like to add “|” between navigation menu links but do not want to show it after the last menu.
e.g.
Home | About Us | FAQs | Blog | <– you do not want this
So far wp_nav_menu function does not add any additional classes to the first and last of the navigation menus. But don’t worry to much about that because there is a trick to fix it. Just copy and paste below code to your functions.php
Put this into your functions.php
[code]
function nav_menu_first_last( $items ) {
$position = strrpos($items, 'class="menu-item', -1);
$items=substr_replace($items, 'menu-item-last ', $position+7, 0);
$position = strpos($items, 'class="menu-item');
$items=substr_replace($items, 'menu-item-first ', $position+7, 0);
return $items;
}
add_filter( 'wp_nav_menu_items', 'nav_menu_first_last' );
[/code]
Put this into your style.css
[code]
.menu-item-last {
display: none;
}
[/code]
That’s it!
Pingback: Wordpress nav menu separator | Snaver.net
why not simply:
‘main-menu’, ‘before’=>’|')); ?>
in css:
.main-menu li:first-child .sep{
display: none;
}
it works perfectly for me.
This doesn’t work if you have sub-menus…it hides the last child menu item.
Finally I solved the problem
Thanks man.
Pingback: Wordpress Tricks: Giving first and last classes to wp_nav_menu items | Blah, blah, blahg