wordpress主题开发:导航菜单函数wp_nav_menu()使用方法

我们在做wordpress主题开发的时候,必不可少的是要读取后台外观-菜单中的导航结构,那么就需要用到wp_nav_menu()函数,本篇文章小编问大家介绍wp_nav_menu()函数的使用方法。
wordpress主题开发:导航菜单函数wp_nav_menu()使用方法
wp_nav_menu()函数使用非常的简单,只需要在你需要的地方放入以下代码即可:

 <?php wp_nav_menu($args) ;?>

其中$args是函数的参数,下面会详细说明:

 <?php   $defaults = array(  'theme_location'  => '',//用于在调用导航菜单时指定注册过的某一个导航菜单名,如果没有指定,则显示第一个  'menu'            => '',//使用导航菜单的名称调用菜单,可以是 id, slug, name (按顺序匹配的) 。  'container'       => 'div',//最外层容器标签名   'container_class' => '',//最外层容器class名    'container_id'    => '',//最外层容器id值    'menu_class'      => 'menu',//ul 节点的 class 属性值。  'menu_id'         => '',//ul 节点的 id 属性值。  'echo'            => true,//确定直接显示导航菜单还是返回 HTML 片段,如果想将导航的代码作为赋值使用,可设置为false。  'fallback_cb'     => 'wp_page_menu',//备用的导航菜单函数,用于没有在后台设置导航时调用    'before'          => '',//显示在导航a标签之前    'after'           => '',//显示在导航a标签之后  'link_before'     => '',//显示在导航链接名之前  'link_after'      => '',//显示在导航链接名之后    'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>',//使用字符串替换修改ul的class。  'depth'           => 0,//显示菜单的深度, 当数值为 0 时显示所有深度的菜单。  'walker'          => ''//自定义的遍历对象,调用一个对象定义显示导航菜单。 ); wp_nav_menu( $defaults ); ?>

使用

 <?php wp_nav_menu($args) ;?>

读取出来的导航菜单HTML结构如下

 <div class="menu-%e5%af%bc%e8%88%aa-container"><ul id="menu-%e5%af%bc%e8%88%aa" class="menu"><li id="menu-item-62" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-62"><a href="http://localhost/wordpress/" rel="external nofollow"  rel="external nofollow" >首页</a></li> <li id="menu-item-32" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-32"><a href="http://localhost/wordpress/category/html" rel="external nofollow"  rel="external nofollow" >HTML</a></li> <li id="menu-item-33" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-33"><a href="http://localhost/wordpress/category/css" rel="external nofollow"  rel="external nofollow" >CSS</a></li> <li id="menu-item-34" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-34"><a href="http://localhost/wordpress/category/javascript" rel="external nofollow"  rel="external nofollow" >JavaScript</a></li> <li id="menu-item-35" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-35"><a href="http://localhost/wordpress/category/jquery" rel="external nofollow"  rel="external nofollow" >jquery</a></li> <li id="menu-item-36" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-36"><a href="http://localhost/wordpress/category/php" rel="external nofollow"  rel="external nofollow" >PHP</a></li> <li id="menu-item-37" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-37"><a href="http://localhost/wordpress/sample-page" rel="external nofollow"  rel="external nofollow" >示例页面</a></li> </ul></div>

如果我们希望把DIV和UL去掉可以用以下代码:

  <?php echo str_replace("</ul></div>", "", ereg_replace("<div[^>]*><ul[^>]*>", "", wp_nav_menu(array('theme_location' => 'nav', 'echo' => false)) )); ?>

读取的HTML代码结构如下:

 <li id="menu-item-62" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-62"><a href="http://localhost/wordpress/" rel="external nofollow"  rel="external nofollow" >首页</a></li> <li id="menu-item-32" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-32"><a href="http://localhost/wordpress/category/html" rel="external nofollow"  rel="external nofollow" >HTML</a></li> <li id="menu-item-33" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-33"><a href="http://localhost/wordpress/category/css" rel="external nofollow"  rel="external nofollow" >CSS</a></li> <li id="menu-item-34" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-34"><a href="http://localhost/wordpress/category/javascript" rel="external nofollow"  rel="external nofollow" >JavaScript</a></li> <li id="menu-item-35" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-35"><a href="http://localhost/wordpress/category/jquery" rel="external nofollow"  rel="external nofollow" >jquery</a></li> <li id="menu-item-36" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-36"><a href="http://localhost/wordpress/category/php" rel="external nofollow"  rel="external nofollow" >PHP</a></li> <li id="menu-item-37" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-37"><a href="http://localhost/wordpress/sample-page" rel="external nofollow"  rel="external nofollow" >示例页面</a></li>

推荐阅读:字符串替换函数str_replace() 与正则表达式替换函数ereg_replace()的使用方法

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
7. 如果您也有好的资源或教程,您可以投稿发布,成功分享后有M币奖励和额外收入!

模板下载吧 WP技术 wordpress主题开发:导航菜单函数wp_nav_menu()使用方法 https://www.mbxzb.com/blog/file/wordpress/3385.html

从明天起,做一个幸福的人,喂马、劈柴、周游世界…

常见问题
  • 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。
查看详情
  • 最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用
查看详情

相关文章

评论
暂无评论
点击按钮快速添加回复内容: 支持 高兴 激动 给力 加油 苦寻 生气 回帖 路过 威武 友军 顶贴
官方客服团队

为您解决烦忧 - 24小时在线 专业服务

wordpress主题开发:导航菜单函数wp_nav_menu()使用方法-海报

分享本文封面