我有一个html结构, 需要自定义wp_nav_menu代码。
这是我需要生成的html:
<
ul class="main-nav">
<
li class="item">
<
a href="http://example.com/?p=123" class="title">
Title<
/a>
<
a href="http://example.com/?p=123" class="desc">
Description<
/a>
<
ul class="sub-menu">
<
li class="item">
<
a href="http://example.com/?p=123" class="title">
Title<
/a>
<
a href="http://example.com/?p=123" class="desc">
Description<
/a>
<
/li>
<
/ul>
<
/li>
<
li class="item">
<
a href="http://example.com/?p=123" class="title">
Title<
/a>
<
a href="http://example.com/?p=123" class="desc">
Description<
/a>
<
/li>
<
/ul>
我目前正在使用wp_get_nav_menu_items从菜单中将所有项作为数组获取。
现在, 我可以使用以下代码在没有子菜单的情况下生成上述html:
<
?php$menu_name = 'main-nav';
$locations = get_nav_menu_locations()
$menu = wp_get_nav_menu_object( $locations[ $menu_name ] );
$menuitems = wp_get_nav_menu_items( $menu->
term_id, array( 'order' =>
'DESC' ) );
foreach ( $menuitems as $item ):$id = get_post_meta( $item->
ID, '_menu_item_object_id', true );
$page = get_page( $id );
$link = get_page_link( $id );
?>
<
li class="item">
<
a href="http://www.srcmini.com/<
?php echo $link;
?>" class="title">
<
?php echo $page->
post_title;
?>
<
/a>
<
a href="http://www.srcmini.com/<
?php echo $link;
?>" class="desc">
<
?php echo $page->
post_excerpt;
?>
<
/a>
<
/li>
<
?php endforeach;
?>
我可以使用wp_nav_menu函数生成菜单, 但是我仍然需要使用$ page-> post_excerpt显示的描述。
我发现每个项目都有一个名为$ item-> menu_item_parent的属性, 该属性给出了父菜单项的ID。
我如何在foreach循环中生成子菜单?还是Google忘记提及的使用wp_nav_menu的方法真的很简单?
#1【如何在WordPress中使用wp_get_nav_menu_items生成自定义菜单/子菜单系统()】对于解决类似问题的任何人, 这是我的解决方案:
要点上的快速代码示例这是github要点上的代码, 适用于任何想要进行复制粘贴操作的人。
TL; DRTL; DR遍历列表, 向下钻取是否有子菜单, 如果到达子菜单和菜单的末尾, 则关闭。
完整的代码说明首先将菜单项作为平面数组获取:
<
?php
$menu_name = 'main_nav';
$locations = get_nav_menu_locations();
$menu = wp_get_nav_menu_object( $locations[ $menu_name ] );
$menuitems = wp_get_nav_menu_items( $menu->
term_id, array( 'order' =>
'DESC' ) );
?>
然后遍历菜单项的数组:
<
nav>
<
ul class="main-nav">
<
?php
$count = 0;
$submenu = false;
foreach( $menuitems as $item ):
// set up title and url
$title = $item->
title;
$link = $item->
url;
// item does not have a parent so menu_item_parent equals 0 (false)
if ( !$item->
menu_item_parent ):// save this id for later comparison with sub-menu items
$parent_id = $item->
ID;
?>
编写第一个父项< li> :
<
li class="item">
<
a href="http://www.srcmini.com/<
?php echo $link;
?>" class="title">
<
?php echo $title;
?>
<
/a>
<
?php endif;
?>
检查此项目的父ID是否与存储的父ID匹配:
<
?php if ( $parent_id == $item->
menu_item_parent ): ?>
启动子菜单< ul> 并将$ submenu标志设置为true以供以后参考:
<
?php if ( !$submenu ): $submenu = true;
?>
<
ul class="sub-menu">
<
?php endif;
?>
编写子菜单项:
<
li class="item">
<
a href="http://www.srcmini.com/<
?php echo $link;
?>" class="title">
<
?php echo $title;
?>
<
/a>
<
/li>
如果下一项没有相同的父代ID, 并且我们声明了一个子菜单, 请关闭子菜单< ul>
<
?php if ( $menuitems[ $count + 1 ]->
menu_item_parent != $parent_id &
&
$submenu ): ?>
<
/ul>
<
?php $submenu = false;
endif;
?>
<
?php endif;
?>
同样, 如果数组中的下一个项目没有相同的父ID, 请关闭< li>
<
?php if ( $menuitems[ $count + 1 ]->
menu_item_parent != $parent_id ): ?>
<
/li>
<
?php $submenu = false;
endif;
?>
<
?php $count++;
endforeach;
?>
<
/ul>
<
/nav>
#2最好的选择是创建自己的Walker类, 以根据你的需求定制输出。像这样:
class Excerpt_Walker extends Walker_Nav_Menu
{
function start_el(&
$output, $item, $depth, $args)
{
global $wp_query;
$indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';
$class_names = $valuehttp://www.srcmini.com/= '';
$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="' . esc_attr( $class_names ) . '"';
$id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->
ID, $item, $args );
$id = strlen( $id ) ? ' id="' . esc_attr( $id ) . '"' : '';
$output .= $indent . '<
li' . $id . $value . $class_names .'>
';
$attributes= ! empty( $item->
attr_title ) ? ' title="'. esc_attr( $item->
attr_title ) .'"' : '';
$attributes .= ! empty( $item->
target )? ' target="' . esc_attr( $item->
target) .'"' : '';
$attributes .= ! empty( $item->
xfn )? ' rel="'. esc_attr( $item->
xfn) .'"' : '';
$attributes .= ! empty( $item->
url )? ' href="'. esc_attr( $item->
url) .'"' : '';
$item_output = $args->
before;
$item_output .= '<
a'. $attributes .'>
';
$item_output .= $args->
link_before . apply_filters( 'the_title', $item->
title, $item->
ID ) . $args->
link_after;
/*GET THE EXCERPT*/
$q = new WP_Query(array('post__in'=>
$item->
object_id));
if($q->
have_posts()) : while($q->
have_posts()) : $q->
the_post();
$item_output .= '<
span class="menu-excerpt">
'.get_the_excerpt().'<
/span>
';
endwhile;
endif;
/*****************/$item_output .= '<
/a>
';
$item_output .= $args->
after;
$output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
}
}
然后这样称呼它:
<
?php
wp_nav_menu(array('walker' =>
new Excerpt_Walker()));
?>
在我的示例中, GET EXCERPT标记之前和之后的所有内容都是wp-includes / nav-menu-template.php中start_el函数的直接副本。我的示例使用WP_Query来确定帖子/页面是否具有摘录, 并将摘录放在链接标题之后的span标签之间。
一个想法是使span标签仅在悬停时出现, 这可以使用CSS来完成。
有关Walkers的更多信息, 请点击此处:
WP导航菜单法典
使用沃克课程
使用Walker类的另一个不错的示例
#3
//Just set your variable and apply.. for sub menu
<
ul>
<
?php$activeclass = '';
$activeclass1='';
$count=0;
$submenu = FALSE;
foreach ( $primaryNav as $navItem ) {
$activeclass = '';
if($navItem->
object_id == $getid){
$activeclass = 'class="live-act"';
}
if (!$navItem->
menu_item_parent ){
$parent_id = $navItem->
ID;
echo '<
li>
<
a href="'.$navItem->
url.'" '.$activeclass.'title="'.$navItem->
title.'">
'.$navItem->
title.'<
/a>
';
}
?>
<
?php if ( $parent_id == $navItem->
menu_item_parent ) { ?>
<
?php if ( !$submenu ): $submenu = true;
?>
<
ul>
<
?php endif;
?>
<
li>
<
a href="http://www.srcmini.com/<
?php echo $navItem->
url;
?>" class="title">
<
?php echo $navItem->
title;
?>
<
/a>
<
/li>
<
?php if ( $primaryNav[ $count + 1 ]->
menu_item_parent != $parent_id &
&
$submenu ){ ?>
<
/ul>
<
?php $submenu = false;
}
?>
<
?php }
if ( $primaryNav[ $count + 1 ]->
menu_item_parent != $parent_id ){ ?>
<
/li>
<
?php $submenu = false;
} ?>
<
?php $count++;
?>
<
?php } ?>
<
/ul>
推荐阅读
- 如何获得缩进的WordPress帖子文本()
- 如何在vc_single_image中找到属性图像
- 如何在WordPress中向移动用户显示不同的网站徽标()
- 如何自定义wp_list_pages()的输出,以便可以将链接包装在自己的HTML中()
- 如何在WordPress页面中创建不同的可编辑section()
- 如何为所有”h2标签”添加数字
- 如何恢复wordpress备份()
- 如何在WordPress自定义meta框中保存复选框状态()
- 英国脱欧后,亚马逊电商产品要从新认证