如果要修改html标记并更改菜单标题,可以创建自己的walker_nav
分类如下。在这里,我放置了fontawesome图标fa-home
的图标Home
下拉菜单前的菜单和更多图标。
class Sunrise_Universal_Walker_Nav_Primary extends Walker_Nav_menu {
function start_lvl( &$output, $depth = 0, $args = array() ){ //ul
$indent = str_repeat("\\t",$depth);
$submenu = ($depth > 0) ? \' sub-menu\' : \'\';
$output .= "\\n$indent<ul class=\\"dropdown-menu $submenu depth_$depth\\">\\n";
}
function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ){ //li a span
$indent = ( $depth ) ? str_repeat("\\t",$depth) : \'\';
$li_attributes = \'\';
$class_names = $value = \'\';
// look you can put home icon for home page and what not
if($item->title == \'Home\'){
$item->title = \'<span class="fa fa-home"></span>\';
}
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
/*echo "<pre>";
var_dump($item);
die();*/
$classes[] = ($args->walker->has_children) ? \'dropdown\' : \'\';
$classes[] = ($item->current || $item->current_item_ancestor) ? \'active\' : \'\';
$classes[] = \'menu-item-\' . $item->ID;
if( $depth && $args->walker->has_children ){
$classes[] = \'dropdown-submenu\';
}
$numbers[] = get_post_meta($item->ID,\'_menu_item_object_id\',true);
//here i use the glyphicon for the menus of dropdown
$glyphicon= \'\';
foreach ($numbers as $number) {
if(in_category("services",$number)){
$glyphicon = get_post_meta($number,"glyphicon",true);
}
}
$class_names = join(\' \', apply_filters(\'nav_menu_css_class\', array_filter( $classes ), $item, $args ) );
$class_names = \' class="\' . esc_attr($class_names) . \'"\';
$id = apply_filters(\'nav_menu_item_id\', \'menu-item-\'.$item->ID, $item, $args);
$id = strlen( $id ) ? \' id="\' . esc_attr( $id ) . \'"\' : \'\';
$output .= $indent . \'<li\' . $id . $value . $class_names . $li_attributes . \'>\';
$attributes = ! empty( $item->attr_title ) ? \' title="\' . esc_attr($item->attr_title) . \'"\' : \'\';
$attributes .= ! empty( $item->target ) ? \' target="\' . esc_attr($item->target) . \'"\' : \'\';
$attributes .= ! empty( $item->xfn ) ? \' rel="\' . esc_attr($item->xfn) . \'"\' : \'\';
$attributes .= ! empty( $item->url ) ? \' href="\' . esc_attr($item->url) . \'"\' : \'\';
$attributes .= \'class="dropdown-toggle"\';
$attributes .= ( $args->walker->has_children ) ? \' class="dropdown-toggle drop-down full-width hover-fade" data-toggle="dropdown"\' : \'\';
$item_output = $args->before;
//glyhicons are here
$item_output .= \'<a\' . $attributes . \'><span class="glyphicons \'.$glyphicon.\'"></span>\';
$item_output .= $args->link_before . apply_filters( \'the_title\', $item->title, $item->ID ) . $args->link_after;
$item_output .= ( $depth == 0 && $args->walker->has_children ) ? \' <b class="caret"></b></a>\' : \'</a>\';
$item_output .= $args->after;
$output .= apply_filters ( \'walker_nav_menu_start_el\', $item_output, $item, $depth, $args );
}
}
然后您必须在标题处使用下面的代码。php,您希望在其中显示菜单。
<nav class="navbar collapse navbar-collapse navbar-sunshine" id="navbar-collapse-1">
<?php wp_nav_menu( array(\'menu\' => \'Main\', \'theme_location\' => \'Primary\',\'container\' => \'\', \'items_wrap\' => \'<ul class="nav navbar-nav" id="main-menu">%3$s</ul>\' , \'walker\' => new Sunrise_Universal_Walker_Nav_Primary())); ?>
</nav>
更新:如果不想使用
walker_nav
全班做这样的事
add_filter( \'wp_nav_menu_items\', \'your_custom_menu_item\', 10, 2 );
function your_custom_menu_item ( $items, $args ) {
preg_match_all(\'~>\\K[^<>]*(?=</a)~\', $items, $matches);
$return = $items;
foreach ($matches[0] as $match) {
$return = preg_replace(\'@\'.$match.\'@\', $match.\' -\', $return);
}
return $return;
}