Created
September 26, 2020 08:20
-
-
Save pavlo-bondarchuk/bec29f3f4ad40b78383fe9ceadfb70a9 to your computer and use it in GitHub Desktop.
Edit submenu& subsubmenu classes and add arrow icon before submenu & subsubmenu and add custom class to <li> & link
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // create for wp_nav_menu custom options: list_item_class & link_class | |
| function add_menu_link_class( $atts, $item, $args ) { | |
| if (property_exists($args, 'link_class')) { | |
| $atts['class'] = $args->link_class; | |
| } | |
| return $atts; | |
| } | |
| add_filter( 'nav_menu_link_attributes', 'add_menu_link_class', 1, 3 ); | |
| // add custom ul submenu class if depth & class | |
| add_filter( 'nav_menu_submenu_css_class', 'change_wp_nav_menu', 10, 3 ); | |
| function change_wp_nav_menu( $classes, $args, $depth ) { | |
| foreach ( $classes as $key => $class ) { | |
| if ( $class == 'sub-menu' && $depth == 0 ) { | |
| $classes[ $key ] = 'area_dropdown'; | |
| } | |
| if( $class == 'sub-menu' && $depth == 1 ){ | |
| $classes[ $key ] = 'area_dropright'; | |
| } | |
| } | |
| return $classes; | |
| } | |
| // add custom icon via nav menu custom walker | |
| class Custom_Walker_Nav_Menu extends Walker_Nav_Menu { | |
| function start_lvl(&$output, $depth) { | |
| if ( $depth == 0 ) { | |
| $output .= '<svg class="icon arrow"><use xlink:href="../assets/images/sprite.svg#down-arrow"></use></svg>'; | |
| $output .= '<ul class="area_dropdown">'; | |
| } | |
| if ( $depth == 1 ) { | |
| $output .= '<svg class="icon arrow arrow_right"><use xlink:href="../assets/images/sprite.svg#down-arrow"></use></svg>'; | |
| $output .= '<ul class="area_dropright">'; | |
| } | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment