Help with a custom nav walker
-
I am trying to create a custom walker that will output the following code / menu:
<ul> <li><a href="#" title="">Menu 1</a></li> <li><a href="#" title="">Menu 2</a></li> <li class="hasDropdown"> <a href="#" title="">Menu 3 - Level 1</a> <div> <div> <h5>Description 1</h5> <ul> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> </ul> </div> <div> <h5>Description 2</h5> <ul> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> </ul> </div> <div> <h5>Description 3</h5> <ul> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> </ul> </div> <div> <h5>Description 4</h5> <ul> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> <li><a href="#" title="">Menu 3 - Level 2</a></li> </ul> </div> </div> </li> <li class="hasDropdown"> <a href="#" title="">Menu 4 - Level 1</a> <div> <div> <h5>Description 1</h5> <ul> <li><a href="#" title="">Menu 4 - Level 2</a></li> <li><a href="#" title="">Menu 4 - Level 2</a></li> <li><a href="#" title="">Menu 4 - Level 2</a></li> <li><a href="#" title="">Menu 4 - Level 2</a></li> <li><a href="#" title="">Menu 4 - Level 2</a></li> </ul> </div> <div> <h5>Description 2</h5> <ul> <li><a href="#" title="">Menu 4 - Level 2</a></li> <li><a href="#" title="">Menu 4 - Level 2</a></li> <li><a href="#" title="">Menu 4 - Level 2</a></li> <li><a href="#" title="">Menu 4 - Level 2</a></li> <li><a href="#" title="">Menu 4 - Level 2</a></li> </ul> </div> </div> </li> <li><a href="#" title="">Menu 5</a></li> <li><a href="#" title="">Menu 6</a></li> </ul>I would like the code to be clean with only a single class to define where a dropdown occurs. I have read numerous articles on the walker class and have tried creating my own from the nav-menu-template but cannot seem to understand it enough to achieve what I would like.
Please can anyone help? Many thanks in advance.
The topic ‘Help with a custom nav walker’ is closed to new replies.