If you’ve ever wanted a top-level navigation item to act as a trigger for a drop down menu, but not actually link anywhere, here’s how to do it in the WordPress 3.0 menu system:
- Insert a custom link with a label and any link address
- Click on Edit Menu Item link (triangle)
- Delete link address in URL field
- Add nested sub-menu items
- Save
FrankW
Many Thanks !
rishabh
brilliant. excellent. awesome. this helped me a lot. thanks.
Mike
Doesn\’t work anymore on WordPress 4.1. Any other hint?
Bryan Hoffman
Hi Mike – I just tested it and it\’s still working for me… what kind of error are you getting?
Dustin
I use this same technique to just apply section breaks in a list for a nav menu and just encountered a problem after upgrading to WP 3.3. Seems that without anything as an href wp ignores any css I have targeting the custom link. Any ideas? Have you experienced this at all? What I\’m actually having a problem with is that any items I have as sub items of the custom menu item with empty url are displaying the current page class from the top level menu item above.
Bryan Hoffman
Dustin, do you have a link that I could see this in action?
Bryan Hoffman
Dustin, checking the source code, it seems like it should be working correctly. The top level parent link has a class of
current-menu-ancestorandcurrent-menu-parent, and the submenu item has these classes:current-menu-itemandcurrent_page_item.I do notice now that the parent list item is wrapped in an anchor like this: <a>Software</a> – which may be something new in 3.3, I\’m not sure. You may need to add another class to your CSS like this:
li.current-menu-ancestor li.current-menu-item a { color: #ccc }
Dustin
Here\’s a link. http://www.eacpds.com/
Currently I just commented out the current-menu-item class. The area which I \’m referring to is the blue nav area on the left. The white links should be a dark gray when they are the current page, but like I said that is commented out now so they just stay white.
Terry
I was using the Disable Parent Menu Link plugin — will try this simple method, as the fewer conflict possibilities the better.
Bryan Hoffman
Glad to have been a help to you both. Check back now and again, I\’ll try to keep posting these tips as I come across them in my development.
Ruben Nunez
Awesome! Thanks for sharing. I\’ve been using # to trigger drop downs, but this solution is much nicer.
Mike
Just spent an hour searching for the answer to this and apart from using JavaScript I couldn\’t get a result.
Then I saw your solution and it was exactly what I needed.
Great stuff – Thank you!
Mike 🙂