> WordPress中文手册 > wordpress进阶教程(三十五):给菜单加上分隔线或者分隔字符

很多网页设计都会给菜单之间加一个分割线,最常见的就是“|”了,如图:

wordpress进阶教程(三十五):给菜单加上分隔线或者分隔字符

我们需要的是,每个菜单项之间有一个分隔符。传统的方法是配置WordPress的菜单输出函数wp_nav_menu,给它加上一个after参数,

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.PHP文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_CSS_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>

这样可以给每个菜单项的后面加一个字符,且html结构如下

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>

这样有个显而易见的缺点就是每个菜单项后面都有个竖线,最后一个菜单项也有,可是我们肯定不需要菜单的最后面也出现竖线,当然这样的结构,通过css还是可以写出上面图片中的样式的。

我们要的效果:以及菜单每个菜单项后面加一个分割线,菜单的最后面不要,二级菜单不要。

分析:wp_nav_menu函数输出菜单项的代码在 wp-includes/nav-menu-template.php文件里面,具体的呢,在文件中Walker_Nav_Menu类里面的start_el函数,所以,方法就是改造这个函数。

步骤一:找到wp_nav_menu函数,增加一个walker参数,如下:

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>

关于walker参数的用法,请参考官网。

步骤二:前面的代码中walker参数的值,后面是一个类,类名是ashuwp_navwolker,所以第二部就是新建这个类,如下:

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>

新定义一个ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu,然后将Walker_Nav_Menu类的start_el函数直接复制进去,复制完后,如下:

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>

步骤三:改造ashuwp_navwalker类中的start_el函数。

1.在start_el函数开头,定义一个静态数组变量,用来计数,用数组可以支持多个菜单。注意数组中的初始值,需要支持多少个菜单,都需要手动加上,静态变量用来记每个输出的菜单里面的一级菜单的数量。

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>

2.添加计算菜单中一级菜单数量的函数。该函数不需要放入类中,随便放在主题的functions.php文件的某一位置。

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>

3.重新定义$args-after的值,将下面的代码加入start_el函数中。

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>

做好1 3两个点之后, ashuwp_navwalker extends类如下:

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>

至此,就可以完成了。

懒人专用

将下列代码复制到你的主题的functions.php文件中

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>

然后修改你的wp_nav_menu函数,添加walker参数

<?php $args = array( 'after'=>'|' //菜单项后面加|字符 ); wp_nav_menu($args); ?> <ul> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> <li><a href="">阿树工作室</a>|</li> </ul> <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' //注意这个theme-location参数 ); wp_nav_menu($args); ?> //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); //...... //参数$menu_id为菜单id function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ //定义ashuwp_navwalker类,继承wp-includes/nav-menu-template.php文件中的Walker_Nav_Menu class ashuwp_navwalker extends Walker_Nav_Menu { //在中间添加函数,直接复制Walker_Nav_Menu类的start_el函数进来 function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //定义静态变量$top_level_count 数组中的值对应多个wp_nav_menu函数中的theme_location参数的值 static $top_level_count = array('ashuwp-menu'=>0,'ashuwp-nav'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes =empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } function ashuwp_count_top_level_menu_items($menu_id){ $count = 0; $menu_items = wp_get_nav_menu_items($menu_id); foreach($menu_items as $menu_item){ if($menu_item->menu_item_parent==0){ $count++; } } return $count; } class ashuwp_navwalker extends Walker_Nav_Menu { function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) { //根据实际增加和修改下面的数组 static $top_level_count = array('ashu-menu'=>0,'top-menu'=>0); $indent = ( $depth ) ? str_repeat( "\t", $depth ) : ''; $class_names = $value = ''; $classes = empty( $item->classes ) ? array() : (array) $item->classes; $classes[] = 'menu-item-' . $item->ID; /** * Filter the CSS class(es) applied to a menu item's <li>. * * @since 3.0.0 * * @param array $classes The CSS classes that are applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) ); $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : ''; /** * Filter the ID applied to a menu item's <li>. * * @since 3.0.1 * * @param string The ID that is applied to the menu item's <li>. * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args ); $id = $id ? ' id="' . esc_attr( $id ) . '"' : ''; $output .= $indent . '<li' . $id . $value . $class_names .'>'; $atts = array(); $atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : ''; $atts['target'] = ! empty( $item->target ) ? $item->target : ''; $atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : ''; $atts['href'] = ! empty( $item->url ) ? $item->url : ''; /** * Filter the HTML attributes applied to a menu item's <a>. * * @since 3.6.0 * * @param array $atts { * The HTML attributes applied to the menu item's <a>, empty strings are ignored. * * @type string $title The title attribute. * @type string $target The target attribute. * @type string $rel The rel attribute. * @type string $href The href attribute. * } * @param object $item The current menu item. * @param array $args An array of arguments. @see wp_nav_menu() */ $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args ); $attributes = ''; foreach ( $atts as $attr => $value ) { if ( ! empty( $value ) ) { $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value ); $attributes .= ' ' . $attr . '="' . $value . '"'; } } /***add code****/ $args->after=''; if($item->menu_item_parent==0 and $top_level_count[$args->theme_location]!==null){ //Count top level menu items $top_level_count[$args->theme_location]++; //Increment } $location_name = $args->theme_location; if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $location_name ] ) ) { $main_nav = wp_get_nav_menu_object( $locations[ $location_name ] ); if($item->menu_item_parent==0 && $top_level_count[$args->theme_location]!=ashuwp_count_top_level_menu_items($main_nav->term_id)){ $args->after= '<span class="menu_line">|</span>'; } } /*****add code*****/ $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; /** This filter is documented in wp-includes/post-template.php */ $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after; $item_output .= '</a>'; $item_output .= $args->after; /** * Filter a menu item's starting output. * * The menu item's starting output only includes $args->before, the opening <a>, * the menu item's title, the closing </a>, and $args->after. Currently, there is * no filter for modifying the opening and closing <li> for a menu item. * * @since 3.0.0 * * @param string $item_output The menu item's starting HTML output. * @param object $item Menu item data object. * @param int $depth Depth of menu item. Used for padding. * @param array $args An array of arguments. @see wp_nav_menu() */ $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args ); } } <?php $args = array( 'depth'=>2, //支持二级菜单 'walker' => new ashuwp_navwalker(), //后面的ashuwp_navwolker是类名 'theme_location' => 'ashuwp-menu' ); wp_nav_menu($args); ?>