There are many things about the WordPress nav menu system that I like, and a handful of things I really dislike. The things I dislike happen to trigger my pet peeves: Markup-bloat and non-SMACCS-ish class names. To me, it’s worth a deep dive to correct this situation. However, I don’t want to lose integration with the admin UI, and I don’t want to lose the dynamic class names that core gives us, such as current_page_item or current-menu-ancestor. Therefore, I’m not going to replace anything: I’m going to extend the PHP class that draws the nav menus: The Walker_Nav_Menu class.

I’ll do this by building a plugin that outputs nav menus with whatever markup and classes I want. Along the way, I’ll stop and smell the roses var_dump() the PHP variables that WordPress exposes to us. This plugin will have the following components:

  1. A main plugin file to register the plugin and call other files
  2. A shortcode for outputting the menu
  3. Some CSS, JS, & SVG to do things like show/hide submenus
  4. A custom walker class, which will extend the core Walker_Nav_Menu class

Of those components, all but the last one will act mainly as placeholders. They’ll offer the minimum amount of code in order to achieve the minimum viable product, and I won’t be exploring them in detail. They will provide just enough of a foundation for me to build a custom walker class.