-1

I have a menu structure I built in HTML+CSS that I would like to incorporate into a WordPress menu, but I am new to extending the Walker class and was wondering if someone could show me an example of how it might work. The code I would like to output is below:

<!-- Menu Start -->
<nav class="collapse navbar-collapse menu">
<ul class="nav navbar-nav sf-menu">
    <li><a id="current" href="front-page.php">Current Page</a></li>
    <li><a href="#" class="sf-with-ul">Top Level Menu <span class="sf-sub-indicator"><i class="fa fa-angle-down"></i></span></a>
        <ul>
            <li><a href="child-page.php" class="sf-with-ul">Child Link</a></li>
        </ul>
    </li>
    <li><a href="page.php">Another Link No Children</a></li>
</ul>
</nav>
<!-- Menu End -->

The nav and ul tags wrap the entire menu and do not need repeating.

The li for a single page without any child pages just needs an anchor tag inside of a bare li, except if the page is current, and add the appropriate id to the a tag.

If there is a parent item with children, display the parent link first with a "sf-with-ul" class on the a tag, then make another ul group with its li children have the same class as well.

Could anyone point me in the right direction here on how to accomplish this? Thank you.

dfpchester
  • 1

1 Answers1

0

Unfortunately I don't have a massive amount of time to write an example right now but I can send you the article that goes into decent detail on how to create walkers in WordPress.

How to add custom HTML to wp_nav_menu?

Using this as a guide it should be possible to add classes where you want to add them and structure your menu. If not I can try and whip an example up later.

Community
  • 1
  • 1
MÖRK
  • 954
  • 11
  • 31