How do I change the Sub-menu to Ordered List in Wordpress

Question

I want to change the default WordPress sub-menu unordered list (ul) to an ordered list (ol) to something like this:

<ul class="sub-menu"></ul> to <ol class="sub-menu"></ol>

I know I can do this with JQuery, but I will prefer a non-JavaScript solution. I can change the parent elements using items_wrap in wp_nav_menu, but that wouldn't change the sub-menu.

I look forward to your suggestions.

Answer 1

I found a solution using Walker Menu

class Child_Wrap extends Walker_Nav_Menu {
    function start_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);
        $output .= "\n$indent<ol class=\"sub-menu\">\n";
    }
    function end_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);
        $output .= "$indent</ol>\n";
    }
}

Add 'walker' => new Child_Wrap() to your wp_nav_menu code in the header.php file like this:

wp_nav_menu(array('theme_location'=>'','menu_class'=>'nav-menu','container'=>'','menu_id' => '', 'walker' => new Child_Wrap(), 'fallback_cb'=> false));

Credit: Inserting a div into wp_nav_menu