Intereting Posts
как добавить пользовательский wp_nav_menu класс css selector в ul и теги? Настройка Propel для работы с Multisite get_queried_object () возвращает значение null в архиве post date Создать массив из пользовательского типа сообщения, чтобы отобразить слайдер Помогите мне с этим индексом Undefined? Добавьте вариант к детской теме Twenty Eleven Ребенок и редактор Jetpack next_post_link и previous_post_link в отдельной странице типа сообщения, в той же нестандартной категории подобно редактору, может создать любого нового пользователя, кроме администратора Текстовые фрагменты, разделяемые сообщениями Редактирование другой страницы в WP Customizer Обновить до старой версии WordPress от администратора? отображение и сортировка комментариев по настраиваемому полю (с использованием плагина PODS) Получить wp_title () из идентификатора страницы в переменную Группировка пользовательских сообщений по пользовательским именам таксономии

Добавление класса (стрелки) к ссылкам главного меню, в которых есть дети?

Мне интересно, можно ли добавлять разные классы к элементам второго / третьего / четвертого / и т. Д., У которых есть дети в представлении> Дерево меню?

Так я называю меню:

<?php $menu_args = array( 'container' => '', 'menu_class' => '', 'menu_id' => 'my-menu', 'walker' => new Description_Walker); wp_nav_menu($menu_args ); ?> 

Я знаю, что у каждой ссылки есть другой идентификатор, например <li id="menu-item-3230"> , но я хочу, чтобы решение было динамическим, поэтому мне не придется редактировать код каждый раз, когда я что-то меняю. Я думаю, что самый простой способ – присоединить дополнительный класс к этим элементам, но как?

введите описание изображения здесь

Solutions Collecting From Web of "Добавление класса (стрелки) к ссылкам главного меню, в которых есть дети?"

Есть два способа сделать это:

  • Javascript. Вы можете использовать JQuery для выбора <li> , у которого есть <ul> дочерние подклассы класса ", вставка содержимого или добавление класса CSS, который вы затем используете. Например: $('.sub-menu').parent().addClass('myclass')

  • PHP, новая функция walker. Скопируйте код из wp-includes / nav-menu-template.php (до строки 109) в свои темы functions.php, чтобы создать новый ходок. Передайте этот ходок в качестве аргумента для вашего вызова меню. В модифицированном Уокере вставьте a <span> для стрелки на элементе уровня подменю.

     function start_lvl(&$output, $depth) { $indent = str_repeat("\t", $depth); $output .= "\n$indent<span class=\"right-arrow\">&rarr;</span><ul class=\"sub-menu\">\n"; } 

    Это добавит небольшую стрелку, которую вы затем можете создать перед элементом списка подменю.

Вы можете расширить ходок меню и добавить класс has_children для элементов, имеющих подменю:

 class My_Walker_Nav_Menu extends Walker_Nav_Menu{ public function display_element($el, &$children, $max_depth, $depth = 0, $args, &$output){ $id = $this->db_fields['id']; if(isset($children[$el->$id])) $el->classes[] = 'has_children'; parent::display_element($el, $children, $max_depth, $depth, $args, $output); } } 

и передайте свой экземпляр класса в качестве аргумента в wp_nav_menu() :

 wp_nav_menu(array( 'theme_location' => 'whatever', 'walker' => new My_Walker_Nav_Menu(), )); 

Затем добавьте стрелку с помощью CSS, например, опубликованный Philip:

 li.has_children > a:after { content: " →"; } 

Одним из решений является добавление пользовательского класса CSS при создании / редактировании вашего меню в администраторе. Если вы еще не видите опцию CSS, перейдите к параметрам экрана на странице администратора меню и отметьте ее.

с помощью css вы также можете использовать свойство содержимого , что-то вроде этого должно выполнять эту работу,

 #div-id ul li a:after { content: " →"; }