Есть ли способ изменить дочернее <ul class="sub-menu"> сгенерированное самой WordPress, на собственное имя класса?
Я знаю, что родительский <ul> вы можете удалить или изменить имя с помощью 'menu_class' => 'newname'.
Я не мог найти ответ. Itried 'submenu_class' => 'customname'. Мне кажется, логика, но, очевидно, это не правильно.
есть идеи?
Для этого нет никакой опции, но вы можете расширить объект 'walker', который WordPress использует для создания меню HTML. Только один метод должен быть переопределен:
class My_Walker_Nav_Menu extends Walker_Nav_Menu {
function start_lvl(&$output, $depth) {
$indent = str_repeat("\t", $depth);
$output .= "\n$indent<ul class=\"my-sub-menu\">\n";
}
}
Затем вы просто передаете экземпляр вашего ходунка в качестве аргумента wp_nav_menu следующим образом:
'walker' => new My_Walker_Nav_Menu()
заменить класс:
echo str_replace('sub-menu', 'menu menu_sub', wp_nav_menu( array(
'echo' => false,
'theme_location' => 'sidebar-menu',
'items_wrap' => '<ul class="menu menu_sidebar">%3$s</ul>'
) )
);
Вы можете использовать фильтр WordPress preg_replace (в вашем файле functions.php темы) Пример:
function new_submenu_class($menu) {
$menu = preg_replace('/ class="sub-menu"/','/ class="yourclass" /',$menu);
return $menu;
}
add_filter('wp_nav_menu','new_submenu_class');
Здесь обновление к тому, что сделал Ричард, добавляет индикатор глубины. Вывод - уровень 0, уровень-1, уровень-2 и т.д.
class UL_Class_Walker extends Walker_Nav_Menu {
function start_lvl(&$output, $depth) {
$indent = str_repeat("\t", $depth);
$output .= "\n$indent<ul class=\"level-".$depth."\">\n";
}
}
Это старый вопрос, и я не уверен, что решение, о котором я собираюсь упомянуть, было доступно к тому моменту, когда вы спросили, но я думаю, это стоит упомянуть. Вы можете добиться того, чего хотите, добавив фильтр в nav_menu_submenu_css_class. См. Пример ниже - вы можете заменить my-new-submenu-class на класс (ы), который вы хотите:
function my_nav_menu_submenu_css_class( $classes ) {
$classes[] = 'my-new-submenu-class';
return $classes;
}
add_filter( 'nav_menu_submenu_css_class', 'my_nav_menu_submenu_css_class' );
Как всегда, после долгого поиска, прежде чем что-то писать на сайте, через минуту после того, как я разместил здесь сообщение, я нашел свое решение.
Я подумала, что я поделюсь этим здесь, чтобы кто-то еще мог найти это.
//Add "parent" class to pages with subpages, change submenu class name, add depth class
class Prio_Walker extends Walker_Nav_Menu {
function display_element( $element, &$children_elements, $max_depth, $depth=0, $args, &$output ){
$GLOBALS['dd_children'] = ( isset($children_elements[$element->ID]) )? 1:0;
$GLOBALS['dd_depth'] = (int) $depth;
parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );
}
function start_lvl(&$output, $depth) {
$indent = str_repeat("\t", $depth);
$output .= "\n$indent<ul class=\"children level-".$depth."\">\n";
}
}
add_filter('nav_menu_css_class','add_parent_css',10,2);
function add_parent_css($classes, $item){
global $dd_depth, $dd_children;
$classes[] = 'depth'.$dd_depth;
if($dd_children)
$classes[] = 'parent';
return $classes;
}
//Add class to parent pages to show they have subpages (only for automatic wp_nav_menu)
function add_parent_class( $css_class, $page, $depth, $args )
{
if ( ! empty( $args['has_children'] ) )
$css_class[] = 'parent';
return $css_class;
}
add_filter( 'page_css_class', 'add_parent_class', 10, 4 );
Вот где я нашел решение: Решение на форуме поддержки WordPress
Мне пришлось изменить:
function start_lvl(&$output, $depth)
to:
function start_lvl( &$output, $depth = 0, $args = array() )
Потому что я получаю ошибку несовместимости:
Strict Standards: Declaration of My_Walker_Nav_Menu::start_lvl() should be compatible with Walker_Nav_Menu::start_lvl(&$output, $depth = 0, $args = Array)
Это может быть полезно для вас
Как добавить родительский класс для пункта меню
function wpdocs_add_menu_parent_class( $items ) {
$parents = array();
// Collect menu items with parents.
foreach ( $items as $item ) {
if ( $item->menu_item_parent && $item->menu_item_parent > 0 ) {
$parents[] = $item->menu_item_parent;
}
}
// Add class.
foreach ( $items as $item ) {
if ( in_array( $item->ID, $parents ) ) {
$item->classes[] = 'menu-parent-item';
}
}
return $items;
}
add_filter( 'wp_nav_menu_objects', 'wpdocs_add_menu_parent_class' );
/**
* Add a parent CSS class for nav menu items.
* @param array $items The menu items, sorted by each menu item menu order.
* @return array (maybe) modified parent CSS class.
*/
Добавление условных классов в элементы меню
function wpdocs_special_nav_class( $classes, $item ) {
if ( is_single() && 'Blog' == $item->title ) {
// Notice you can change the conditional from is_single() and $item->title
$classes[] = "special-class";
}
return $classes;
}
add_filter( 'nav_menu_css_class' , 'wpdocs_special_nav_class' , 10, 2 );
Для справки: нажмите меня
Вы можете просто использовать крюк
add_filter( 'nav_menu_submenu_css_class', 'some_function', 10, 3 );
function some_function( $classes, $args, $depth ){
foreach ( $classes as $key => $class ) {
if ( $class == 'sub-menu' ) {
$classes[ $key ] = 'my-sub-menu';
}
}
return $classes;
}
где
$classes(array) - The CSS classes that are applied to the menu <ul> element.
$args(stdClass) - An object of wp_nav_menu() arguments.
$depth(int) - Depth of menu item. Used for padding.
Вам не нужно расширять Уокер. Это будет делать:
function overrideSubmenuClasses() {
return array('myclass1', 'myclass2');
}
add_action('nav_menu_submenu_css_class', 'overrideSubmenuClasses');
в приведенном выше мне нужно небольшое изменение, которое я пытаюсь разместить, но я не могу этого сделать, ваш результат будет выглядеть следующим образом
<ul>
<li id="menu-item-13" class="depth0 parent"><a href="#">About Us</a>
<ul class="children level-0">
<li id="menu-item-17" class="depth1"><a href="#">Sample Page</a></li>
<li id="menu-item-16" class="depth1"><a href="#">About Us</a></li>
</ul>
</li>
</ul>
что я ищу
<ul>
<li id="menu-item-13" class="depth0"><a class="parent" href="#">About Us</a>
<ul class="children level-0">
<li id="menu-item-17" class="depth1"><a href="#">Sample Page</a></li>
<li id="menu-item-16" class="depth1"><a href="#">About Us</a></li>
</ul>
</li>
</ul>
в приведенном выше я разместил родительский класс внутри родительской привязки, <li id="menu-item-13" class="depth0"><a class="parent" href="#">About Us</a>
Я бы предложил заменить ваше имя класса cocom-cutomclass на подменю. используйте поиск и замену: т.е. find:.customclass заменить на .sub-menu, работает для меня.
Чтобы изменить имя класса "подменю", существует простой способ. Вы можете просто изменить его в файле wordpress.
местоположение: www/project_name/wp-includes/nav-menu-template.php.
откройте этот файл и в строке с номером 49 измените имя класса подменю на свой собственный класс.
Или вы также можете добавить свой собственный класс рядом с подменю.
Готово.
Это сработало для меня. Я использовал wordpress-4.4.1.