Add class to menu items of one specific menu (nav_menu_css_class)
I was also trying to solve this problem and while searching for a solution, discovered that the nav_menu_css_class filter actually excepts a third parameter. This is an object containing variables related to your menu and includes the theme_location variable you can use to conditionally apply class names to a specific menu. You just need to ensure that you set the theme_location when you call wp_nav_menu in your theme.
Here’s an example:
add_filter( 'nav_menu_css_class', 'special_nav_class', 10, 3 ); function special_nav_class( $classes, $item, $args ) < if ( 'primary-menu' === $args->theme_location ) < $classes[] = 'btn'; >return $classes; > in my case, i called the menu via wp_nav_menu( [‘menu’ => ‘main’] ); so the $args->theme_location was empty. but the $args->name wasn’t (since i only set this..), so i went with this attribute and it works..
I came across this thread trying to solve the same problem — this is what I’ve come up with. I don’t know how well this performs, since it’ll be called for every single menu item, but it seems menus are set up as taxonomies inside WordPress, and so you can use has_term() to determine if the item is in a particular menu, and get_nav_menu_locations() to pull back the list of which menus are in which theme location.
add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2); function special_nav_class($classes, $item) < $menu_locations = get_nav_menu_locations(); if ( has_term($menu_locations['primary-menu'], 'nav_menu', $item) ) < $classes[] = 'btn'; >return $classes; > You don’t need to modify your functions.php. Just go into your template file and find wp_nav_menu and add ‘menu_class’ to it.
'primary','menu_class' => 'newmenuclass' ) ); ?> Adding it to myself in function.php and everything will work
add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2); function special_nav_class ($classes, $item) < $classes[] = 'nav__link'; if (in_array('current-menu-item', $classes) )< $classes[] = 'nav__link-active'; >return $classes; > Linked
Related
Hot Network Questions
Subscribe to RSS
To subscribe to this RSS feed, copy and paste this URL into your RSS reader.
Site design / logo © 2023 Stack Exchange Inc; user contributions licensed under CC BY-SA . rev 2023.7.20.43540
WordPress is a trademark of the WordPress Foundation, registered in the US and other countries. This site is not affiliated with the WordPress Foundation in any way.
By clicking “Accept all cookies”, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy.
nav_menu_css_class │ хук-фильтр │ WP 3.0.0
Использование
Array( [1] => menu-item [2] => menu-item-type-post_type [3] => menu-item-object-page [4] => menu-item-265 )
WP_Post Object ( [ID] => 265 [post_author] => 1 [post_date] => 2018-04-07 09:45:46 [post_date_gmt] => 2018-04-07 06:45:46 [post_content] => [post_title] => Обратная связь [post_excerpt] => [post_status] => publish [comment_status] => closed [ping_status] => closed [post_password] => [post_name] => 265 [to_ping] => [pinged] => [post_modified] => 2018-04-19 00:20:29 [post_modified_gmt] => 2018-04-18 21:20:29 [post_content_filtered] => [post_parent] => 0 [guid] => http://wp-test.ru/?p=265 [menu_order] => 1 [post_type] => nav_menu_item [post_mime_type] => [comment_count] => 0 [filter] => raw [db_id] => 265 [menu_item_parent] => 0 [object_id] => 214 [object] => page [type] => post_type [type_label] => Страница [url] => http://wp-test.ru/post-99 [title] => Обратная связь [target] => [attr_title] => [description] => [classes] => Array ( [0] => [1] => menu-item [2] => menu-item-type-post_type [3] => menu-item-object-page ) [xfn] => [current] => [current_item_ancestor] => [current_item_parent] => )
$depth(число) Уровень пункта меню. Добавлен в версии 4.1.0. Используется для отступов. Верхние пункты меню имеют $depth = 0, вложенные в них $depth = 1 и так далее.
Примеры
#1 Добавим CSS класс только определенному пункту меню
Пусть нам нужно добавить к пункту меню «Обратная связь» (id=265) дополнительный CSS класс, причем только если этот пункт выводится в меню, прикреплённом к области меню primary , тогда:
add_filter( 'nav_menu_css_class', 'change_menu_item_css_classes', 10, 4 ); function change_menu_item_css_classes( $classes, $item, $args, $depth ) < if( 265 === $item->ID && 'primary' === $args->theme_location ) < $classes[] = 'special-css-class'; >return $classes; >