How to change navigation menu display style in wordpress

<?php
For change navigation menu display style you need to call your custom walker class.
When you can your navgation menu just add walker argument in it and initialize your walker class..




wp_nav_menu(array(
                'theme_location'    => 'main_navigation',
                'depth'                => 5,
                'menu_class'          => 'fusion-menu',
                'items_wrap'         => '<ul id="%1$s" class="%2$s">%3$s</ul>',
                'fallback_cb'           => 'RJFusionFootermenuWalker::fallback',
                'walker'            => new RJFusionFootermenuWalker(),
                'container_class'    => 'fusion-main-menu'
            ));
Below is one sample for how to create a walker or how to extend walker_nav_menu class

// Dont duplicate me!
if( ! class_exists( 'RJFusionFootermenuWalker' ) ) {
    class RJFusionFootermenuWalker extends Walker_Nav_Menu {

             private $menu_megamenu_status = "";

      
        private $menu_megamenu_width = "";

        private $num_of_columns = 0;

      
        private $max_num_of_columns = 6;

      
        private $total_num_of_columns = 0;

        private $num_of_rows = 1;

        private $submenu_matrix = array();

     
        private $menu_megamenu_columnwidth = 0;
     
        private $menu_megamenu_rowwidth_matrix = array(); 

        private $menu_megamenu_maxwidth = 0;

     
        private $menu_megamenu_title = '';

      
        private $menu_megamenu_widget_area = '';

     
        private $menu_megamenu_icon = '';

     
        private $menu_megamenu_thumbnail = '';

        private function set_megamenu_max_width() {
            global $smof_data;
     
            // Set overall width of megamenu
            $site_width = (int) str_replace( 'px', '', $smof_data['site_width'] );
            $megamenu_max_width = (int) str_replace( 'px', '', $smof_data['megamenu_max_width'] );
            $megmanu_width = 0;

            // Site width in px
            if ( strpos( $smof_data['site_width'], 'px' ) !== false ) {
                if ( $site_width > $megamenu_max_width &&
                     $megamenu_max_width > 0
                ) {
                    $megamenu_width = $megamenu_max_width; 
                } else {
                    $megamenu_width = $site_width;
                }
            // Site width in %
            } else {
                $megamenu_width = $megamenu_max_width;
            }
            $this->menu_megamenu_maxwidth = $megamenu_width;
        }

        public function start_lvl( &$output, $depth = 0, $args = array() ) {
            $indent = str_repeat( "\t", $depth );
            $output .= "\n$indent<ul class=\"sub-menu\">\n";
        }

        public function end_lvl( &$output, $depth = 0, $args = array() ) {
            global $smof_data;
              $indent = str_repeat("\t", $depth);
              $output .= "$indent</ul>\n";
        }

   
        public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
            global $smof_data;

            $item_output = $class_columns = '';
            $indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';

     

        $classes = empty( $item->classes ) ? array() : (array) $item->classes;
        $classes[] = 'menu-item-' . $item->ID;

    
        $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args, $depth ) );
        $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';

    
        $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args, $depth );
        $id = $id ? ' id="' . esc_attr( $id ) . '"' : '';
        $menu_icon = get_post_meta( $item->ID, '_menu_item_fusion_megamenu_icon', true);
        $menu_megamenu_thumbnail = get_post_meta( $item->ID, '_menu_item_fusion_megamenu_thumbnail', true);
     
        $output .= $indent . '<li' . $id . $class_names .'>';

        $atts = array();
        $atts['title']  = ! empty( $item->attr_title ) ? $item->attr_title : '';
        $atts['target'] = ! empty( $item->target )     ? $item->target     : '';
        $atts['rel']    = ! empty( $item->xfn )        ? $item->xfn        : '';
        $atts['href']   = ! empty( $item->url )        ? $item->url        : '';

     
        $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args, $depth );

        $attributes = '';
        foreach ( $atts as $attr => $value ) {
            if ( ! empty( $value ) ) {
                $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
                $attributes .= ' ' . $attr . '="' . $value . '"';
            }
        }

        $item_output = $args->before;
        $item_output .= '<a'. $attributes .' data-icon="'.$menu_icon.'">';
        /** This filter is documented in wp-includes/post-template.php */
        if ( ! empty( $menu_megamenu_thumbnail ) ) {
                        $item_output .= '<span class="fusion-megamenu-icon footer_menu_link_icon"><img src="' . $menu_megamenu_thumbnail . '"></span>';
        }elseif( ! empty( $menu_icon ) ) {
                        $item_output .= '<span class="fusion-megamenu-icon footer_menu_link_icon"><i class="fa glyphicon ' . avada_font_awesome_name_handler( $menu_icon) . '"></i></span>';
                    }
        $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
        if($item->description!='')
        {
            $item_output .='<span class="menu_link_footer_description foo_desc_'.$item->ID.'">'.$item->description.'</span>';
        }
        $item_output .= '</a>';
        $item_output .= $args->after;

     
        $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
        }

    
        function end_el( &$output, $item, $depth = 0, $args = array() ) {
            $output .= "</li>\n";
        }

   
        public function display_element( $element, &$children_elements, $max_depth, $depth, $args, &$output ) {
            if ( ! $element )
                return;

            $id_field = $this->db_fields['id'];

            // Display this element.
            if ( is_object( $args[0] ) )
               $args[0]->has_children = ! empty( $children_elements[ $element->$id_field ] );

            parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );
        }

     
        public static function fallback( $args ) {
            if ( current_user_can( 'manage_options' ) ) {

                extract( $args );

                $fb_output = null;

                /*if ( $container ) {
                    $fb_output = '<' . $container;

                    if ( $container_id )
                        $fb_output .= ' id="' . $container_id . '"';

                    if ( $container_class )
                        $fb_output .= ' class="' . $container_class . '"';

                    $fb_output .= '>';
                }

                $fb_output .= '<ul';

                if ( $menu_id )
                    $fb_output .= ' id="' . $menu_id . '"';

                if ( $menu_class )
                    $fb_output .= ' class="' . $menu_class . '"';

                $fb_output .= '>';
                $fb_output .= '<li><a href="' . admin_url( 'nav-menus.php' ) . '">Add a menu</a></li>';
                $fb_output .= '</ul>';
                */
                return $fb_output;
            }
        }
    }
}

?>