5ucms论坛

标题: wp_nav_menu()函数 register_nav_menus()函数 自定义导航菜单调用 [打印本页]
作者: admin    时间: 2021-5-29 09:21
标题: wp_nav_menu()函数 register_nav_menus()函数 自定义导航菜单调用
wp_nav_menu() 函数是WordPress 3.0 以后添加的一个自定义导航菜单调用函数，可用来调用 register_nav_menus() 函数 注册的菜单。

语法结构

  1. <php wp_nav_menu(array $args = array()) ?> //实现前端调用WordPress后台添加的菜单
复制代码



参数

$args所调用菜单名称及HTML结构等
  1. <?php has_nav_menu('$location') ?>
  2. //判断是否有此菜单，其主要用途是通过该方法，实现后台的生成菜单调用。
复制代码



默认版

  1. <?php wp_nav_menu(); ?>
复制代码

通过默认版设置导航菜单，则后台添加的菜单会自动生成顶部菜单，通过此方法生成的菜单的结构如下：

  1. <div class="menu-menu-container">
  2.     <ul id="menu-menu" class="menu">
  3.         <li id="menu-item-49" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49">
  4.             <a href="link">菜单名称</a>
  5.         </li>
  6.         <li id="menu-item-50" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49">
  7.             <a href="link">菜单名称</a>
  8.         </li>
  9.     </ul>
  10. </div>
复制代码


简单版

获取的菜单名称为nav，只列出一级菜单，样式名为navcontainer

  1. <?php wp_nav_menu(array(
  2.     'menu' => 'header_menu',
  3.     'depth' => 1,
  4.     'menu_class'=>'navcontainer'
  5.     )
  6. ); ?
复制代码
>

完整版参数

  1. <?php wp_nav_menu( array(
  2.     'theme_location'  => '',
  3.     'menu'            => '',
  4.     'container'       => 'div',
  5.     'container_class' => '',
  6.     'container_id'    => '',
  7.     'menu_class'      => 'menu',
  8.     'menu_id'         => '',
  9.     'echo'            => true,
  10.     'fallback_cb'     => 'wp_page_menu',
  11.     'before'          => '',
  12.     'after'           => '',
  13.     'link_before'     => '',
  14.     'link_after'      => '',
  15.     'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>',
  16.     'depth'           => 0,
  17.     'walker'          => ''
  18.     )
  19. );?>
复制代码

theme_location        导航别名，register_nav_menu( ‘header-menu’, ‘顶部导航’ ); header-menu即为导航别名
menu        后台设置的菜单的名称
container        最外层容器标签名字如div标签 nav标签，如果为 false 时去除div标签
container_id        最外层容器id名
container_class        最外层容器class名
menu_class        ul标签class值
menu_id        ul标签id值
before        显示在导航a标签之前（测试无效果）
after        显示在导航a标签之后（测试无效果）
link_before        每个菜单链接文本前的文本如<a>（link_before对应的字段）网站首页</a>
link_after        每个菜单链接文本后的文本如<a>网站首页（link_before对应的字段）</a>
depth        菜单深度 0代表多级菜单，1代表一级菜单
walker        调用一个对象定义显示导航菜单
items_wrap        使用字符串替换修改ul的class（测试无效果）

根据是否登录生成不同该菜单栏

  1. <?php
  2. if (is_user_logged_in()) {
  3.     wp_nav_menu(array( 'theme_location' => 'logged-in-menu'));
  4. } else {
  5.     wp_nav_menu(array('theme_location' => 'logged-out-menu'));
  6. } ?>
复制代码
作者: admin    时间: 2021-5-29 09:25
register_nav_menus()函数

导航菜单是每一个WordPress主题必须的元素，如果你要制作一个WordPress主题，那就必须熟悉WordPress导航菜单注册函数 register_nav_menus() 和 导航菜单调用函数wp_nav_menu()函数 ，这两个函数一般都是配合使用的.

语法结构

  1. <?php register_nav_menu($location, $description); ?> //开启导航菜单功能，注册单个菜单
复制代码


参数
$location 导航菜单的位置
$description 导航菜单的描述


实例

  1. <?php register_nav_menu( 'header-menu', 'Main Navigation' ); ?>
复制代码

如果是多个菜单的话则使用register_nav_menus()函数

语法结构

  1. <?php register_nav_menus($locations); ?> //开启多个导航菜单功能
复制代码

参数
$locations 是一个由多个菜单组成的数组


实例
  1. <?php
  2. register_nav_menus(
  3.     array(
  4.         'header_menu' => 'Main Navigation',
  5.         'footer_menu' => 'Footer Navigation'
  6.     )
  7. );
  8. ?>
复制代码


上面的实例可以放置在functions.php文件中直接使用，也可以如下利用钩子进行使用，两种方式皆可。

实例

  2. function register_my_menus() {
  3.   register_nav_menus(
  4.     array(
  5.       'header-menu' => 'Main Navigation',
  6.       'footer-menu' =>'Footer Navigation'
  7.     )
  8.   );
  9. }
  10. add_action( 'init', 'register_my_menus' );
复制代码

效果展示（顶部导航对应Main Navigation，底部导航对应Footer Navigation）



欢迎光临 5ucms论坛 (http://bbs.5ucms.com/) Powered by Discuz! X3.2