高效、专业、符合SEO优化,首选翠竹林wordpress主题,大气,简洁,清新。点击群2:翠竹林wordpress主题 群1:484421506(已满)QQ:458940846,985300418

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

空谷 1902次浏览 0个评论

我们在做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/">首页</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">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">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">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">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">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">示例页面</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/">首页</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">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">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">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">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">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">示例页面</a></li>

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


翠竹林版权所有,如未注明 , 均为原创,转载需注明出处。
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址