会员登录 还没有账号? 立即注册

WordPress网站定制开发专家
成为WPYOU会员, 享受更多专属优惠吧!

成为WPYOU联盟推广代理,获取高比例的推广佣金分成

立即加入

自定义导航菜单操作使用方法

WordPress 自 3.0版本后,新增了非常实用的自定义菜单功能,可以帮助我们更加容易地对网站菜单进行可视化操作,最重要的是,可以把Pages(页面列表)、Links(自定义链接)和Categories(分类列表)在自定义菜单中混合显示了。

这里,WPYOU为大家详细介绍最新版 WordPress 自定义菜单的操作使用方法,具体如下:

1. 首先,登录您的 WordPress 网站管理后台,在左侧菜单中找到【 外观(Appearance) – 菜单(Menus)】模块,进入自定义菜单添加管理页面,找到“ 编辑菜单(Edit Menus)”标签项,如下图所示:

WordPress导航菜单教程

创建新的导航菜单

2. 如果您之前没有创建过自定义菜单的话,您需要点击顶部位置的“创建新菜单create a new menu )”链接,添加新的自定义菜单项 (菜单名),如下图所示:

WordPress自定义导航菜单

添加新的菜单名称

3. 添加好新的菜单名称后,点击WordPress自定义菜单 (Create Menu)按钮,建立新的菜单项:HeaderMenu;

4. 新创建的菜单项默认状态是空的,需要自己添加菜单中需要显示的页面、分类或者自定义链接;

5. 在这个页面左侧,可以看到你已经创建好的 页面(Pages)、 链接(Links)、分类(Categories)等内容,我们需要做的就是,把你希望在刚刚创建的自定义菜单 HeaderMenu 中显示的内容选中,点“添加至菜单”按钮,添加到右侧的菜单结构(Menu Structure)中即可,如下图所示:

WordPress添加菜单项

添加指定栏目到菜单结构

:左侧显示的页面、分类是已经创建好的栏目(页面在【 页面 – 添加新页面 】里添加管理;分类在【 文章 – 分类目录】里添加)。

6. 把栏目添加到 菜单结构 后,z选择你要显示“菜单设置”里,把创建的菜单项和当前主题里的对应菜单匹配,在对应的菜单名称前勾选即可,如下图所示:

设置WordPress自定义菜单

添加到右侧新建菜单项 HeaderMenu 中的栏目以列表形式显示,在 菜单结构 中,可以使用鼠标上下拖拽的方式排列菜单的显示顺序;也可以使用鼠标左右拖拽的方式设置二级(多级)菜单,每右移一格为一级,如上图所示。

:鼠标移至要移动的 菜单栏 上,鼠标指针变为移动状态时,就可以对该菜单进行上下左右的拖拽操作了。

7.  至此,新的自定义菜单就基本创建完成了,最后,点击该页的WordPress保存菜单(Save Menu)按钮,保存该菜单项的内容设置即可完成。

 

==== 其他自定义菜单功能 ====

 

8. 首页链接:菜单中加入 首页 链接功能是非常常用的功能,在 WordPress的自定义菜单中,我们无需创建 首页 页面,在自定义菜单的 页面 列表中就已经内置了 首页 链接功能,在左侧的 页面 列表中,切换标签至“查看所有(View all)”,第一个就是 网站首页的链接了,选中添加至你的自定义菜单中就可以,默认添加到最前面位置,如下图所示:

WordPress菜单添加首页

菜单添加首页链接方法1

也可以使用下面的自定义 链接 功能,手工添加 首页链接,切换到 链接 状态,添加网站首页的 URL 和 链接文字,如下图所示:

WordPress自定义菜单添加首页

9. 编辑已有菜单:在创建后的菜单下拉列表中,选择要编辑的菜单名称,点击右侧“选择(Select)”按钮,即可进入对应的菜单编辑页面,如下图所示:

编辑WordPress自定义菜单

编辑管理自定义菜单

10. 管理位置:每套主题都有对应的菜单功能模块(以WPYOU的主题为例,基本都包括 顶部菜单底部菜单),您需要把创建好的菜单项和其中的主题菜单位置对应起来,方法如下:切换标签到“管理位置(Manage Locations)”,在里面设置对应的菜单项即可。

比如:上面创建好的 HeaderMenu,你想显示在主题的 顶部菜单 位置,就在 顶部菜单 设置 项中,选择 HeaderMenu 即可;当然,你也可以把创建好的 HeaderMenu 同时设置为 顶部菜单 和底部菜单 共用。

WordPress主题位置管理

WordPress主题位置管理

11. 新窗口打开菜单项:有时,我们需要设置某个菜单项为新窗口打开,这种功能WordPress也已经为我们想到了,具体方法如下:

11.1 首先,在【外观-菜单】页面顶部右上角位置,找到“显示选项”,如下图所示:

WordPress自定义菜单 新窗口打开

设置菜单项新窗口打开

11.2 点击“显示选项”下拉展开,在里面的“显示菜单高级属性”选项中,勾选“链接目标”,如下图所示:

WordPress自定义菜单属性

菜单高级属性

11.3 然后,在你创建的菜单项中,找到你要设置为“在新窗口打开”的菜单,比如我们要设置“关于我们”栏目在新窗口打开,那么找到这个菜单,点击展开,如下图所示:

WordPress新窗口打开菜单

新窗口打开菜单

我们会看到在具体设置中,多了一项名为“在新窗口或标签页打开链接”的选项,勾选该项即可实现在新窗口打开对应栏目了。

 

12. WordPress高级菜单项介绍

在WordPress的自定义菜单中,除了默认的设置选项外,还有更多隐藏的高级功能,如果你需要控制菜单更多的属性,可以点击屏幕右上角的“显示选项”,勾选隐藏的功能即可显示出来:

WordPress自定义菜单高级设置

菜单高级选项

12.1 显示下列项目:勾选你要在左侧显示的项目,包括:文章、链接、分类目录、标签、页面;勾选显示后的项目都可以添加到自定义菜单中。

12.2 显示菜单高级项目:显示菜单的高级属性,包括:链接目标、CSS类、链接关系网(XFN)、描述; 具体功能描述如下:

WordPress自定义菜单高级选项

菜单高级选项介绍

  • 链接目标 – 控制菜单打开方式,在新窗口打开(target=”_blank”)或在当前窗口打开(默认)。
  • 导航标签 – 就是链接的文字
  • 标题属性 – 就是A标签的title属性值,比如上图填写”WPYOU.com”
  • CSS类 – 给某个菜单项添加 class 类,通过css控制来实现是这个菜单项的独立显示效果,如上图我添加了“home-page”
  • 链接关系网 – 通过链接关系网(XFN)给菜单添加 rel 属性,例如不想搜索引擎跟随这个菜单,可以为其添加rel=”nofllow”属性

 

以上就是 WordPress 自定义菜单功能的全部教程了,相信你仔细阅读的话,操作起来还是非常方便的。

在线留言

您的昵称 *

您的邮箱 *

您的网站

评论内容

  1. 小伟的博客欢迎访问2010/06/26 22:21:59

    来看看博主,文章写的不错
    值得一看哈

  2. lianyungang2010/07/01 20:09:53

    你好,否能做个友情链接呢?

    • 菠菜2010/07/01 23:42:01

      抱歉,暂不接受友链。感谢访问。

  3. 美女 身材2010/07/02 20:25:25

    特地起早看你更新没结果没更那我应该继续睡觉了

  4. 深圳标志设计2010/07/03 16:13:25

    真的是一切如烟。。看你的文章感觉。。我的烟抽完了。。

  5. 你好2010/07/04 22:43:08

    学习了,楼主博客不错

  6. QQ炫舞闪光跳2010/07/08 20:52:10

    多好的文章阿,佩服!

  7. 育儿专家2010/07/11 00:49:39

    你写的不错,了解育儿看我的博客

  8. 915262010/07/11 21:45:15

    人才啊

  9. 济南百度优化2010/07/13 13:44:55

    纯属路过。。。。不过博客很不错哦

  10. 网赚资源2010/07/13 23:39:50

    博客不错
    围观一下

  11. 文秘之家2010/07/14 00:24:49

    每一次来,不错的文章,很喜欢!!!!!!!!!

  12. cgupiao2010/07/14 10:28:25

    博主,你的空间是哪里的呀,速度很快呀

  13. 夜鼠2010/08/16 16:23:03

    你好,本地测试,我按你的教程做了,为啥前台不显示啊,我建了4个分类加上关于 未分类共6个,我选择好保存前台只显示,我建的4个分类和首页,其他两个不显示,请指点下,谢谢

    • 菠菜2010/08/16 23:13:43

      要确保你的主题是支持自定义菜单

  14. 92fdc2010/09/16 20:02:07

    写得不错,学习了

  15. 无线乐2010/10/01 19:49:08

    这个功能很实用

  16. 网络营销方案2011/03/10 19:04:02

    我现在正有一个这样的需要,谢谢分享!

  17. 柴油发电机2011/05/07 17:25:26

    留言功能在哪设啊

  18. 一错在错2011/05/09 17:06:26

    很好!很有帮助哈!

  19. QQ个性签名网2011/05/13 08:55:35

    很详细,终于弄明白了

  20. 星期六2011/07/02 07:11:11

    我的主题就能调首页菜单

  21. 蜂胶哪个牌子好2011/07/02 21:52:10

    主题不错,就是有点地方不怎么明白

  22. 昆明SEO2011/09/16 12:55:43

    教 程 很好。

  23. 咿呀传媒2011/09/17 03:40:46

    我的导航是别处下载的,不知道咋调用分类做导航,唉,法克 啊 法克。

  24. 丝印2011/10/29 12:02:53

    搞了半天终于懂了

  25. 温岭2011/10/29 16:15:14

    还有这功能呢

  26. Ezdinix2012/02/07 19:44:30

    谢谢你们了

  27. 宝缇革2012/03/02 23:58:03

    为什么我发现文章和产品介绍页面的文字都是粗体的呢,能不能有解决的办法,先谢谢了

  28. 佟子寒博客2012/04/13 21:35:32

    模板都挺好看的,不错的。。

  29. herb2012/04/26 14:56:40

    看了你的模板后悔之前买的了

  30. 名人录2012/04/28 22:52:19

    喔,你们的QQ没人在呀

    • WPYOU2012/04/29 08:09:49

      您好 如果客服不在线可以在线留言,或者发邮件到wpyou@qq.com,会及时回复您的。

  31. 代办原产地证2012/05/10 16:02:27

    我的后台不是中文的,真难弄

  32. hehe2012/06/04 03:09:01

    源代码上显示有主菜单,网页上却看不到 ,不知是什么原因。

  33. henry2012/06/30 13:21:48

    顶,你这个对我很我帮助哦,谢谢

  34. 横幅制作2012/08/02 19:31:01

    博主!!想咨询下您用的是华夏名网的哪款空间呢

    • WPYOU2012/08/03 09:14:51

      我们用的是 万网主机

  35. 2013/01/26 16:35:18

    怎么用了几天后网站首页和网站底部总是出现那个红色的彩虹呢 ?
    一出现就不好看,我是最菜的鸟。求帮忙解答下!

  36. 电脑技巧网2013/03/13 12:59:19

    为什么设置好了菜单和分类目录怎么,打开都显示找不到页面呢?

在线客服

点击这里给我发消息 定制开发 购买主题 售前咨询 售后服务
返回顶部