这是一篇完整的 WordPress 菜单新增+编辑教程。
WordPress 新手入门常会问说,要如何在 WordPress 网站上新增菜单?
还是 WordPress 主题主题 的菜单位置比较多,不知该如何设定? 或是有多层选单的需求?
这篇有对 WordPress菜单 进行详细的教程,如下。
- 1. 什么是 WordPress 菜单?
- 2. 建立第一个菜单
- 3. 如何设定多层菜单?
- 4. 将文章新增至菜单
- 5. 将自定义链接新增至菜单
- 6. 将分类新增至菜单
- 7. 侧边栏或页脚新增菜单
- WordPress 学习资源
准备好了吗? 我们开始吧:)
1. 什么是 WordPress 菜单?
「WordPress菜单」可让你快速到指定网页,方便访客找到想要的资料。
WordPress 菜单设计其实很容易,就是菜单制作完成后,放入指定的菜单位置即可显示。
菜单功能
WordPress 菜单主要包括几种功能,像是页面功能、文章功能、自定义链接功能、分类功能,可依照需求将不同功能加入到菜单中。
菜单位置
不同的 WordPress 主题主题 菜单位置可能会不同,可能有单个至多个菜单位置。
像是主菜单(Primary Menu),也有次菜单(Secondary Menu)、侧边栏菜单(Sidebar Menu)、页尾选单(Footer Menu)、手机版菜单(Mobile Menu) ..
这几个常见的菜单位置,其中主菜单是印象比较深刻的,因为就在网站正上方。
这些就是 WordPress 菜单的基本组成。
2. 建立第一个菜单
开始建立第一个菜单,下面会使用 WordPress 默认主题主题 Twenty Twenty 搭配教程,你不一定要使用相同主题,这不会有影响。
首先,前往 WordPress 外观 > 菜单,填入选单名称后,点 建立菜单。
![tan-wp-nav2-4 WordPress 建立第一个菜单](https://img.itaoda.cn/wp-content/uploads/2023/05/tan-wp-nav2-4.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
这样主选单就建立完成了,接着我们需帮它加上不同功能。
将页面新增至菜单
自己 新增完成的页面,例如关于我们、服务项目、联络我们等 .. ,我们可以将页面加入至菜单。
选取要新增至菜单的页面,如果找不到页面,可切换成检视全部,或用搜寻也可。
确认后,点新增至菜单 就会新增至菜单结构。
![tan-wp-nav3-1 WordPress菜单 :新增页面至菜单中](https://img.itaoda.cn/wp-content/uploads/2023/05/tan-wp-nav3-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
编辑、删除菜单
点击展开箭头,就可编辑菜单项目,点击移除可删除菜单。
![tan-wp-nav16-1 WordPress菜单 :编辑、删除菜单](https://img.itaoda.cn/wp-content/uploads/2023/05/tan-wp-nav16-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
菜单排序&设定菜单位置
菜单可上下拖放设定顺序,也可左右拖放变成多层菜单。
然后,选取菜单的显示位置,先勾选 桌面版水平菜单(站点主菜单),完成后 储存菜单。
![tan-wp-nav4-1 WordPress 菜单排序、设定菜单位置](https://img.itaoda.cn/wp-content/uploads/2023/05/tan-wp-nav4-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
- 不同的主题主题,菜单位置的命名可能会不同,找到网站主菜单位置,并将菜单设定到此位置即可。
可自行勾选测试,然后对照前台网页,看菜单是否有出现。
确认菜单是否显示
完成后,前往你的网站前台,会看到菜单已经出现啰。
恭喜你完成第一个 WordPress 菜单 。
3. 如何设定多层菜单?
许多Blog网站、公司形象官网、购物网站搭建,可能会有多层选单设计需求。
把项目新增至菜单中,然后用拖放方式(上下是排序、左右是设定父子关系),即可编辑多层菜单。
![tan-wp-nav7-1 WordPress菜单 :制作 WordPress 多层菜单](https://img.itaoda.cn/wp-content/uploads/2023/05/tan-wp-nav7-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
回到网站前台,我们看一下前台选单成果。
![tan-wp-nav8-1 WordPress菜单 :设定多层菜单](https://img.itaoda.cn/wp-content/uploads/2023/05/tan-wp-nav8-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
恭喜你完成 WordPress 的多层菜单了。
4. 将文章新增至菜单
这章节示范如何新增文章至网站菜单。
像是博客文章、最新消息、与公司服务有关的内容 ..,都属于 WordPress 文章,请参考如何 新增 WordPress 文章。
有了 WordPress 文章后,一样前往 WordPress 外观 > 菜单。
选取要新增至菜单中的文章(可切换成检视全部,方便找寻),编辑项目名称,完成后储存。
![tan-wp-nav9-1 WordPress菜单 :将文章新增至菜单中](https://img.itaoda.cn/wp-content/uploads/2023/05/tan-wp-nav9-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
前往网站首页,看一下是否有顺利出现。
太棒了,我们现在也学会把文章放到菜单中了。
5. 将自定义链接新增至菜单
如果想要一个链接功能的菜单,像是点击菜单可前往社群网站,或是连结到相关网站 ..,就可使用这功能。
前往 WordPress 外观 > 菜单,点击自定义链接功能,设定网址和链接文字,完成后记得保存菜单。
到前台看一下成果,连结功能的菜单出现了。
点击后也能顺利到刚设定的 FB 社团。
6. 将分类新增至菜单
开始经营网站的内容,会产生许多网站文章,此时可能有多个分类。
如果需要将分类新增至菜单,要如何做呢?
前往 WordPress 外观 > 菜单,点击分类功能,然后把分类新增至菜单中,完成后记得储存菜单。
![tan-wp-nav14-1 WordPress菜单 :将分类新增至菜单](https://img.itaoda.cn/wp-content/uploads/2023/05/tan-wp-nav14-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
前往网站首页,看是否有正确显示。
太好了,我们已经将分类新增至菜单中了,如果你有多个分类需设定,也用一样的教程流程操作即可。
7. 侧边栏或页脚新增菜单
WordPress 菜单可放置在多个地方,像是站点侧边栏、页脚,都是常见的放置位置。
不同 WordPress 主题主题 的侧边栏、页脚位置或设计都不太相同,有些主题也不一定都会有,这里先用页脚进行教程。
首先,前往 WordPress 外观 > 小工具,选取导览菜单功能。
![tan-wp-nav17-1 WordPress 将小工具添加到侧边栏或页脚](https://img.itaoda.cn/wp-content/uploads/2023/05/tan-wp-nav17-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
将导览菜单新增至页脚,然后指定菜单和命名,确认后储存。
![tan-wp-nav18-1 新增导航菜单到页脚](https://img.itaoda.cn/wp-content/uploads/2023/05/tan-wp-nav18-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
前往网站前台,确认一下网站页脚是否出现菜单。
太好了,顺利在页脚设定选单,当然也可以用一样方式,在侧边栏设定菜单。
依照你的需求设定即可。
原文链接:https://www.itaoda.cn/blog/10467.html,转载请注明出处。
评论0