Chris Coyier recently posted an article about using lists in navgiation on CSS Tricks. I tend to agree that they’re unnecessary. The first time I built a menu with a
nav wrapping a
ul wrapping a bunch of
li‘s wrapping a bunch of
a‘s it felt gross, but I did it because I thought that was easier for screen readers to understand.
I just redesigned my site and decided that I wanted a simpler structure for my menu this time. Since WordPress builds menus in lists, I created a custom walker class for
wp_nav_menu that formats the menu the way I want.
That looks like a lot. It’s mostly just a copy of the
Walker_Nav_Menu class with a few things changed:
- Change the default container to ”
- Change the default wrapping element to
- Disable a fallback1
- Change the sub-menu element to
- Remove the
liwrapping each link
- Put the
class‘s that would normally go on the
Of course, you have to tell your nav menu to use this walker. Since this disables the fallback if you don’t have a menu set, you’ll have to specify a menu.
Unfortunately the fallbacks generally aren’t compatible with custom walkers — at least not the same custom walker that can be used for