菜单是WordPress的一项重要功能,方便用户快速打开网站页面,我们通常说的网站导航栏就是菜单。菜单通常显示在网站的顶部或者底部,以Apple官网的为例:

这篇文章我们就学习下:如何添加、删除菜单;如何调整菜单顺序和层级;如何添加自定义链接菜单。

1. 如何增加、删除菜单

前置要求:已有文章、分类目录、页面等内容

增加菜单:

步骤1:进入wordpress后台->菜单->输入菜单名称->创建菜单

步骤2:在左侧添加菜单项中,点击查看所有,可看到已创建的页面,文章,分类目录等等;勾选需要添加的内容,点击“添加至菜单”。

删除菜单

步骤:菜单结构中,增加的每个项目右侧的三角符号可显示详细信息,可自由移除项目,若完全不想要了,可点击“删除菜单”。

2. 更改菜单层级

步骤:菜单支持拖动更改项目层级,拖动过程中会显示虚框表示该层级的隶属关系,向左为增加层级,向右为降低层级。一般建议菜单不要超过三级,避免降低页面打开率。

:更改导航栏显示内容时,如果你的菜单不是自定义链接,而是直接选用的页面或产品分类等,那么,如果在此处修改了它的导航标签(即菜单的名称),会导致菜单名称固化为你在此处修改的内容,而不会自动跟随页面或产品分类名称的修改。

3. 添加自定义链接菜单

使用自定义链接菜单可以添加任何想要添加的页面,也包括第三方的,如:油管、B站视频链接,微信,微博社交平台链接等等。

步骤:菜单->自定义链接->输入网址和链接文字->添加至菜单->保存菜单

4. 补充说明

菜单的增加、删除、修改在非常的简单,你可以自定义很多菜单并显示在不同的位置已达到想要的显示效果。

菜单可以结合页面编辑器或者其他插件实现更高级的功能,比如,使用Betheme主题可以自由设计导航栏的二级菜单样式,称之为超级菜单(mega menu),显示效果如下:

这些属于比较进阶的功能和设计了,这里先不讲,在Betheme主题教程中会结合Woocommerce电商插件详细介绍。

WordPress基础之菜单导航栏设置的更多相关文章

  1. jquery自定义插件-参数化配置多级菜单导航栏插件

    1 自定义菜单导航栏插件的必要性 看图说话,下面是利用自定义的菜单导航栏插件simpleMenu创建的网站导航示例: 插件默认提供的是如上图的导航栏样式,即一二级菜单为横向分布:三四级菜单为纵向分布. ...

  2. ABP(现代ASP.NET样板开发框架)系列之22、ABP展现层——导航栏设置

    点这里进入ABP系列文章总目录 基于DDD的现代ASP.NET开发框架--ABP系列之22.ABP展现层——导航栏设置 ABP是“ASP.NET Boilerplate Project (ASP.NE ...

  3. 前端css小米导航栏设置及盒子定位居中问题

    1.小米最上部导航栏设置 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  4. 转:ios导航栏设置

    原帖:http://www.cocoachina.com/industry/20131104/7287.html 本文提供的代码需要用Xcode 5来执行.如果你还在使用老版本的Xcode,那么在运行 ...

  5. Bootstrap3基础教程 03 导航栏

    Bootstrap导航栏 创建一个默认的导航栏的步骤如下: 1.向 <nav> 标签添加 class .navbar..navbar-default. 2.向上面的元素添加 role=&q ...

  6. Swift 导航栏设置图片点击事件,图片蓝色的解决方案

    如果导航栏想做一个点击事件,正好是一个图片 我们可以直接这样: self.navigationItem.rightBarButtonItem = UIBarButtonItem(image: UIIm ...

  7. Swift 导航栏设置

    let width = UIScreen.mainScreen().bounds.size.width let height = UIScreen.mainScreen().bounds.size.h ...

  8. 【原创】js实现一个可随意拖拽排序的菜单导航栏

    1.想做这个效果的原因主要是用在UC上看新闻发现他们的导航菜单很有趣.无聊的时候在哪划着玩了很久.所以就干脆自己写一个.原效果如下 2.整体效果如下,在已推荐和未添加里面每个小方块可以触摸移动位置互换 ...

  9. WordPress基础:固定链接的设置

    安装wordpressp后的工作之一最好修改固定链接,原因就是wp默认的/?p=123形式不利于搜索引擎优化而且也不美观. URL结构参数说明:%year%:日志发表的年份,如2009%monthnu ...

  10. 仿淘宝左侧菜单导航栏纯Html + css 写的

    这俩天闲来没事淘宝逛了一圈看到淘宝的左侧导航菜单做的是真心的棒啊,一时兴起,查了点资料抓了几个图片仿淘宝写了个css,时间紧写的不太好,大神勿喷,给小白做个参考 废话不多说先来个效果图 接下来直接上代 ...

随机推荐

  1. uniapp 组件使用

    组件使用情况:页面出现多个相似的页面这个时候我们就可以把公共的页面进行封装,避免冗余的代码 1. compoents 目录下新建组件,名称随意[案例就叫 newsList]2. 开始封装需要多次使用的 ...

  2. 算法学习笔记(13): Manacher算法

    Manacher算法 形象的被译为马拉车算法 这个算法用于处理简单的回文字符串的问题.可以在 \(O(n)\) 的复杂度内处理出每一个位置为中心的回文串的最长长度. 为了避免出现偶数长度的回文串,导致 ...

  3. VIVO IQOO 5G 开关

    VIVO IQOO 5G 开关 在拨号盘输入*#*#2288#*#*,然后点击网络模式选择. -

  4. C# .NET 拉卡拉支付接口解析 付款码支付 条码支付

    C# .NET 拉卡拉支付接口解析 付款码支付  条码支付 被扫 反扫 刷卡支付 B扫C. 简要: 1.测试环境给的私钥是PKCS8.签名用. 2.CRT证书用X509Certificate2 读取出 ...

  5. list对象转数组

    list对象转数组 package com.example.core.mydemo.json5; import org.apache.commons.collections4.CollectionUt ...

  6. 【译】向您介绍改版的 Visual Studio 资源管理器

    随着最近 Visual Studio 的资源管理器的改进,开发人员将得到一种全新的享受!我们非常激动地宣布重新设计的 Visual Studio 资源管理器,相信我们,它将改变游戏规则. 在 Visu ...

  7. 欢迎 Stable Diffusion 3 加入 🧨 Diffusers

    作为 Stability AI 的 Stable Diffusion 家族最新的模型,Stable Diffusion 3 (SD3) 现已登陆 Hugging Face Hub,并且可用在 Diff ...

  8. 无法启动 IIS Express Web 服务器.....另一个程序正在使用此文件,进程无法访问。 问题解决

    一般是由于端口被占用导致的,但是这个端口你在命令行netstat -a里 排除 如果发现被占用,那么就kill进程就可以了 如果没有发现被占用,依然无法启动,可以尝试以下方法 解决方案1: 修改iis ...

  9. ODPS 不用循环生成连续日期

    生成 20230801 ~ 20230831之间的每一天的sql代码怎么写? 只要一行代码. 一行代码: select TO_CHAR(DATEADD(TO_DATE(bizdate,'yyyymmd ...

  10. MyBase 7.1 可用的 Markdown 配置表

    背景 找到了一款Markdown 笔记本软件MyBase,7.1版本支持markdown,所以我非常喜欢,修改了自己博客的css到软件里面,瞬间变得好看了. 效果图 设置方法 "工具 - 编 ...