Remove “sub-menu” class in second Level UL

I am trying to convert HTML to WordPress and I am having troubles with menus.

The menu is a 3 level drop-down menu, I am outputting it with wp_nav_menu and this is how it formats

Read More
<ul id="nav" class="sf-menu">
  <li>Home</li>
  <li>Blog</li>
  <ul class="sub-menu">
    <li>Level 2</li>
    <ul class="sub-menu">
      <li>Level 3</li>
    </ul>
  </ul>
  <li>Portfolio</li>
  <li>Contacts</li>
</ul>

Basically I want to remove the “sub-menu” class from the /s in the 2nd level and 3rd level.

This is how I want it to be:

<ul id="nav" class="sf-menu">
  <li>Home</li>
  <li>Blog</li>
  <ul class="first-nav">
    <li>Level 2</li>
    <ul class="second-nav">
      <li>Level 3</li>
    </ul>
  </ul>
  <li>Portfolio</li>
  <li>Contacts</li>
</ul>

Related posts

1 comment

  1. For converting html to wordpress menu. This may be helpful to you.

    wp_nav_menu ( array $args = array() )

    Usage

    wp_nav_menu( $args );
    

    Given a theme_location parameter, the function displays the menu assigned to that location. If no such location exists or no menu is assigned to it, the parameter fallback_cb will determine what is displayed.

    Adding Conditional Classes to Menu Items

    function wpdocs_special_nav_class( $classes, $item ) {
        if ( is_single() && 'Blog' == $item->title ) {
        // Notice you can change the conditional from is_single() and $item- >title
        $classes[] = "special-class";
    }
    return $classes;
    }
    add_filter( 'nav_menu_css_class' , 'wpdocs_special_nav_class' , 10, 2 );
    

    For Reference:click me:

Comments are closed.