How to Allow my own theme to support multiple menus in wordpress

Add the following to your functions.php file. The 2 menus are the “Primary”, and “Secondary” menus.

/Register Navigations
add_action( 'init', 'my_custom_menus' );
function my_custom_menus() {
   register_nav_menus(
        array(
            'primary-menu' => __( 'Primary Menu' ),
            'secondary-menu' => __( 'Secondary Menu' )
        )
    );
}

To add them to your site you need to add the following to your WordPress template files (most likely your header.php and footer.php files).

<?php wp_nav_menu (array('theme_location' => 'primary-menu','menu_class' => 'nav'));?>
<?php wp_nav_menu (array('theme_location' => 'secondary-menu','menu_class' => 'nav'));?>

Adding .active class to active menu item

Add this code in function.php file in your theme

add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2);
function special_nav_class($classes, $item){
     if( in_array('current-menu-item', $classes) ){
             $classes[] = 'active ';
     }
     return $classes;
}