wordpress要调用自定义菜单首先要注册菜单,将代码添加到主题文件夹下的function.php中,比如wordpress自带主题2019的定义如下

// This theme uses wp_nav_menu() in two locations.
register_nav_menus(
array(
'menu-1' => __( 'Primary', 'twentynineteen' ),
'footer' => __( 'Footer Menu', 'twentynineteen' ),
'social' => __( 'Social Links Menu', 'twentynineteen' ),
)
);

  这个表示导航栏的名称,左边是别名,右边是名称。别名会用在导航栏的调用上,名称则显示在菜单后台页面上

  添加上述函数后,进入wp后台,在左侧菜单的“外观”里即多了“菜单”选项,primary,footer menu,social links menu就是可选的显示位置

  在主题的header.php对应位置,引用导航栏。需要用到下面这个函数

<?php if ( has_nav_menu( 'menu-1' ) ) : ?>
<?php
wp_nav_menu( array $args = array(
'menu' => "", // (int|string|WP_Term) Desired menu. Accepts a menu ID, slug, name, or object.
'menu_class' => "", // (string) CSS class to use for the ul element which forms the menu. Default 'menu'.
'menu_id' => "", // (string) The ID that is applied to the ul element which forms the menu. Default is the menu slug, incremented.
'container' => "", // (string) Whether to wrap the ul, and what to wrap it with. Default 'div'.
'container_class' => "", // (string) Class that is applied to the container. Default 'menu-{menu slug}-container'.
'container_id' => "", // (string) The ID that is applied to the container.
'fallback_cb' => "", // (callable|bool) If the menu doesn't exists, a callback function will fire. Default is 'wp_page_menu'. Set to false for no fallback.
'before' => "", // (string) Text before the link markup.
'after' => "", // (string) Text after the link markup.
'link_before' => "", // (string) Text before the link text.
'link_after' => "", // (string) Text after the link text.
'echo' => "", // (bool) Whether to echo the menu or return it. Default true.
'depth' => "", // (int) How many levels of the hierarchy are to be included. 0 means all. Default 0.
'walker' => "", // (object) Instance of a custom walker class.
'theme_location' => "", // 指定显示的导航名,如果没有设置,则显示第一个(如果调用多个菜单这项一定要加)(string) Theme location to be used. Must be registered with register_nav_menu() in order to be selectable by the user.
'items_wrap' => "", // (string) How the list items should be wrapped. Default is a ul with an id and class. Uses printf() format with numbered placeholders.
'item_spacing' => "", // (string) Whether to preserve whitespace within the menu's HTML. Accepts 'preserve' or 'discard'. Default 'preserve'.
) );
?>
<?php endif; ?>

  当然有些参数是可选的,可根据实际需要进行调用

  2019主题的调用比较简单

<?php if ( has_nav_menu( 'menu-1' ) ) : ?>
<?php
wp_nav_menu(
array(
'menu_class' => 'menu clearfix',
'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',
)
);
?>
<!-- #site-navigation -->
<?php endif; ?>

  更多详情可参考https://developer.wordpress.org/reference/functions/wp_nav_menu/

<?php if ( has_nav_menu( 'footer' ) ) : ?>
<?php
wp_nav_menu(
array(
'theme_location' => 'footer',//调用具体的位置菜单,否则默认显示第一个创建的菜单
'menu_class' => '',
'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',
)
);
?>
<!-- #site-navigation -->
<?php endif; ?>

  来个中文版的,更容易理解

<?php
$parameter = array(
'theme_location' => '',//指定显示的导航名,如果没有设置,则显示第一个
'menu' => 'header-menu',
'container' => 'nav',//最外层容器标签名
'container_class' => 'primary',//最外层容器class名
'container_id' => '',//最外层容器id值
'menu_class' => 'sf-menu',//ul标签class
'menu_id' => 'topnav',//ul标签id
'echo' => true,//是否打印,默认是true,如果想将导航的代码作为赋值使用,可设置为false
'fallback_cb' => 'wp_page_menu',//备用的导航菜单函数,用于没有在后台设置导航时调用
'before' => '',//显示在导航a标签之前
'after' => '',//显示在导航a标签之后
'link_before' => '',//显示在导航链接名之后
'link_after' => '',//显示在导航链接名之前
'items_wrap' => '<ul id="%1$s">%3$s</ul>',
'depth' => 0,//显示的菜单层数,默认0,0是显示所有层
'walker' => ''//调用一个对象定义显示导航菜单
);
wp_nav_menu($parameter);
?>

相关文章:给 wp_nav_menu函数添加缓存提高页面效率  

wordpress调用自定义菜单的更多相关文章

  1. wordpress去掉自定义菜单的外层div

    wordpress调用自定义菜单时自动会在外层加一个<div class="menu-nav-container">,如下图所示,nav是后台定义的菜单名称,如果想把这 ...

  2. [wordpress]后台自定义菜单字段和使用wordpress color picker

    Wordpress Version 4.4.2 参考链接 插件使用wordpress color picker:Add A New Color Picker To WordPress 后台菜单自定义字 ...

  3. wordpress调用自定义post_type文章

    前面我们讲了wordpress添加post_type自定义文章类型,我们现在来讲一下如何把自定义文章调用出来,我们以product为例,虽然我们自定义好了 Post Type 同时也编写了一些内容,但 ...

  4. WordPress自定义菜单和修改去除多余的css

    这里主要是用于模板制作的,一般前端已经写好了,我们只要将前端的内容套用WordPress后台就可以了. 所以我们在模板制作过程中,需要自定义WordPress菜单. 在functions.php文件中 ...

  5. wordpress自定义菜单间添加分隔符

    我们知道wordpress自定义菜单每个item是用<li></li>来固定的,那如果想在</li>加分隔符要如何操作呢?如下图所示.我们可以用PHP的str_re ...

  6. wordpress自定义菜单高级属性设置

    我们在创建wordpress自定义菜单时,右上角有一个screen option,点击展开可以选择显示菜单的高级属性,包括:链接目标Link Target.标题属性Title Attribute.CS ...

  7. ASP.NET MVC5+EF6+EasyUI 后台管理系统(74)-微信公众平台开发-自定义菜单

    系列目录 引言 1.如果不借用Senparc.Weixin SDK自定义菜单,编码起来,工作量是非常之大 2.但是借助SDK似乎一切都是简单得不要不要的 3.自定义菜单无需要建立数据库表 4.自定义菜 ...

  8. 《C#微信开发系列(2)-自定义菜单管理》

    2.0自定义菜单管理 ①接口说明 微信服务号聊天窗口下面的菜单项(有的公众号有启用有的则没有),这个可以在编辑模式简单配置,也可以在开发模式代码配置.微信公众平台开发者文档:微信公众号开发平台创建自定 ...

  9. 微信公众平台自定义菜单新增扫一扫、发图片、发位置 LBS运作更便捷

    今天微信公众平台发布更新,自定义菜单新增扫一扫.发图片.发送位置等功能,这对于有意挖掘微信LBS服务的运营者来说更便捷了,订阅号不用返回微信界面就能扫图.发送图片.调用地理位置,用户体验更友好,自然也 ...

随机推荐

  1. Postgres-XL集群ERROR :Failed to get pooled connections原因说明

    集群说明 6台服务器.其中1台(rt67-1)运行GTM,其余5台均运行1个GTM_PROXY.1个Coordinator node.3个Data node.每个服务器连接到3组网络中,每个Data ...

  2. [Docker] - 不同容器之间相互访问的实现方式(例如:Client 访问 DB)

    部署了两个独立的容器: Container #1 - Web ClientContainer #2 - SQL Server 不同容器间如何互访? 无法从 Container #1 访问到 Conta ...

  3. opencv之重映射

    好久没写呆码了 今天发个重映射 #include "opencv2/video/tracking.hpp" #include "opencv2/imgproc/imgpr ...

  4. 一文搞定Flask

    Flask 一 .Flask简介 Flask是一个基于Python开发并且依赖jinja2模板和Werkzeug WSGI服务的一个微型框架,对于Werkzeug本质是Socket服务端,其用于接收h ...

  5. Vue 公众号开发 (菜鸡前段的血泪史)

    首先vue-cli就不说了 接下来要说我们需要注意什么 公众号的每个页面都有一个title 所以我们在开发过程中 需要插件 安装vue-wechat-title 安装vue-js-sdk

  6. C# vb .net实现透视阴影特效滤镜

    在.net中,如何简单快捷地实现Photoshop滤镜组中的透视阴影特效效果呢?答案是调用SharpImage!专业图像特效滤镜和合成类库.下面开始演示关键代码,您也可以在文末下载全部源码: 设置授权 ...

  7. NMS(non maximum suppression,非极大值抑制)

    """nms输入的数据为box的左上角x1,y1与右下角x2,y2+confidence,rows=batch_size,line=[x1,y1,x2,y2,confid ...

  8. P1018 乘积最大(DP)

    题目 P1018 乘积最大 解析 区间DP 设\(f[i][j]\)表示选\(i\)个数,插入\(j\)个乘号时的最大值 设\(num[i][j]\)是\(s[i,j]\)里的数字 转移方程就是\(f ...

  9. webpack集成vue单文件模式的很多坑(研究了1个星期)

    1.一开始不知道局部安装webpack后,如何调用webpack. 后来看说明文档(webpack中文网)才知道,有个npx可以启动本地安装的webpack. 我估计:全局安装webpack,全局的w ...

  10. Alpha_4

    一. 站立式会议照片 二. 工作进展 (1) 昨天已完成的工作 a. 我的·主界面设计 b. 番茄钟的页面及音乐选择弹窗页面设计 c. 实现自定义习惯和设置新习惯的功能页面,并可预览 d.已实现番茄钟 ...