Intereting Posts

wp_nav_menu, добавить класс для каждого n-го элемента?

есть ли способ добавить класс в каждый n-й элемент в меню с помощью wp_nav_menu?

Попытка создания столбцов, но вам нужно добавить «последний» класс к третьему элементу.

ура! Округ Колумбия

Вы можете использовать jQuery для этого. Попробуйте это в своем заголовке:

$(document).ready(function() { $("#mymenu li:nth-child(3n+3)").addClass("last"); }); 

Примечание : для этого вам нужно установить enquued jQuery .

Nth уже является классом, это псевдокласс.

Почему бы вам просто не изменить любой CSS- .last на .last и применить его к #nav li:nth-child(3) . Если вам нужно настроить таргетинг на каждый третий пункт меню, это будет #nav li:nth-child(3n+3)

Редактировать:

О, я забыл упомянуть о поддержке тех, что надоедливые каменные векторы .

К счастью, есть хорошие библиотеки javascript и плагины jQuery, которые добавляют поддержку css3 в IE <9

  • Расширенные селектора jQuery
  • Selecivizr
  • ie7js

получилось, что это работает в конце концов …

 function add_nthclass($items, $args){ $scb = get_object_vars($args); switch($scb['menu']) { case 'mainpages': $nth = 2; $items = explode('</li>',$items); $newitems = array(); // loop through the menu items, and add the new link at the right position foreach($items as $index => $item) { if(($index+1) % $nth == 0){ $newitems[] = str_replace('class="', 'class="last ', $item); }else{ $newitems[]= $item; } } // finally put all the menu items back together into a string using the ending <li> tag and return $newitems = implode('</li>',$newitems); case 'footer': // footer menu nth funcs... default: $newitems = $items; } // End switch return $newitems; } add_filter('wp_nav_menu_items', 'add_nthclass', 10, 2); 

Если вы просто хотите добавить класс .last в последний пункт меню, это гораздо более короткий способ сделать это:

 /**********************************************************/ /* add .last to last menu item */ /**********************************************************/ add_filter('wp_nav_menu', 'add_last'); function add_last($output) { $output = substr_replace($output, 'class="last menu-item', strripos($output, 'class="menu-item'), strlen('class="menu-item')); return $output; }; 

Если у вас также есть подменю, вы можете использовать следующий код (благодаря этой статье ).

 add_filter('wp_nav_menu', 'add_last'); function add_last($menuHTML) { $last_items_ids = array(); // Get all custom menus $menus = wp_get_nav_menus(); // For each menu find last items foreach ( $menus as $menu_maybe ) { // Get items of specific menu if ( $menu_items = wp_get_nav_menu_items($menu_maybe->term_id) ) { $items = array(); foreach ( $menu_items as $menu_item ) { $items[$menu_item->menu_item_parent][] .= $menu_item->ID; } // Find IDs of last items foreach ( $items as $item ) { $last_items_ids[] .= end($item); } } } foreach( $last_items_ids as $last_item_id ) { $items_add_class[] .= ' menu-item-'.$last_item_id; $replacement[] .= ' menu-item-'.$last_item_id . ' last'; } $menuHTML = str_replace($items_add_class, $replacement, $menuHTML); return $menuHTML; };