外贸独立站的底层设计密码WordPress 成品站模板
当前位置:首页>WordPress建站>WordPress开发>禁止WordPress菜单函数 wp_nav_menu() 输出 div 和 ul 标签

禁止WordPress菜单函数 wp_nav_menu() 输出 div 和 ul 标签

使用 wp_nav_menu() 输出菜单是非常容易的事,为了实现主题菜单的某些样式效果,也许我们并不需要输出 div 和 ul 标签,下面就分享下具体的实现方法。

wp_nav_menu() 默认输出是带有 div 和 ul 标签的,比如:

<div class="menu-header-container">
	<ul id="menu-header" class="menu">
		<li class="current-menu-item"><a href="https://www.wpdaxue.com/">大学首页</a></li>
		<li><a href="https://www.wpdaxue.com/category/news">WordPress资讯</a></li>
	</ul>
</div>

我们要实现的效果应该是这样的:

<li class="current-menu-item"><a href="https://www.wpdaxue.com/">大学首页</a></li>
<li><a href="https://www.wpdaxue.com/category/news">WordPress资讯</a></li>

阅读 WordPress导航菜单函数register_nav_menus() 和 wp_nav_menu() ,了解了 wp_nav_menu() 的参数以后,我们不难发现,要去除 div 标签是非常容易的事情,只需添加 ‘container’ => false 参数即可。

要去除 ul 标签(只会去除最外围的 ul,对子级 ul 不影响),我们需要用到 items_wrap 参数。items_wrap 有三个可定义选项:

‘items_wrap’ => ‘<ul id="%1$s" class="%2$s">%3$s</ul>’

如果你要定义 ul 的 id 和 class 属性,可以直接修改 %1$s 和 %2$s 为具体的值,如果你要移除 ul 标签,使用参数 ‘items_wrap’ => ‘%3$s’ 即可

最终示例如下:

<?php if(function_exists('wp_nav_menu')) wp_nav_menu(array('container' => false, 'items_wrap' => '%3$s', 'theme_location' => 'foot-menu')); ?>

推荐阅读:移除 WordPress 菜单输出的多余的CSS选择器id或class

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

给TA打赏
共{{data.count}}人
人已打赏
欢迎关注WordPress大学公众号 WPDAXUE
WordPress开发

删除/添加/调用WordPress用户个人资料的联系信息

2013-7-27 9:36:51

WordPress开发

WordPress 检测某个插件是否已经启用

2013-8-10 10:57:15

10 条回复 A文章作者 M管理员
  1. 想知道最简单的 要去除 li 的方法?

  2. 话说如何去除li后保留class给a链接?

  3. 😀 很实用啊,谢谢。

  4. 你好 我想在<ul id="menu-header" class="menu"> 这个后面加一句<div class="hcent"> 应该怎么添加?

  5. 去除li呢?

    • 这个你可以用menu_walker 去解决, 这样你可以自己定义菜单输出形式..

    • 倡萌

      menu_walker是啥玩意~ 不是插件吧

    • 是个类

个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索