Halo-Theme-Hao文档:如何设置导航栏?

本篇文章会教你如何配置导航栏,最终效果参考如下。

感谢 Lanbin小孙同学 等同学的贡献(语雀参与编辑)。

标题

  1. 进入站点后台
  2. 点击左侧面板中的主题
  3. 点击上方的导航
  4. 修改标题字段即可

主菜单

主菜单即网站导航栏中间部分的菜单

  1. 进入站点后台
  2. 点击左侧面板中的菜单
  3. 点击主菜单
  4. 点击右上角的新增
  5. 可以通过拖拽调整缩进,从而创建子菜单
  6. 填写相应表单即可

标题左侧相关链接

  1. 进入站点后台
  2. 点击左侧面板中的菜单
  3. 新增一个菜单,如媒体
  4. 按照自己的需求新增菜单项
  5. 点击左侧面板中的主题
  6. 点击顶部的导航
  7. 导航栏左侧相关链接设置成你刚刚新建的菜单即可

版本>=1.3.2起,顶部菜单理论支持无限级,并且可自由配置菜单的显示方向

如何取消左上角导航

暂时没有办法进行取消,这里与主题无关,如果需要取消,建议创建一个空菜单,然后选择空菜单即可。

导航栏图标

不仅仅可以对主菜单设置图标,还可以对左上角导航设置,可以参考下面教程进行配置。

主题图标配置

图标地址

npm.onmicrosoft.cn/hao-theme-s...

选择 Font class,找到自己喜欢的图标,复制名字即可,注意名字不带.

使用方式

在创建菜单时,可以选择设置图标,图标格式为 haofont xxxxx,注意前缀为 haofont

自定义导航栏图标

自定义导航栏图标www.yuque.com/liuzhihangs...

本文由mdnice多平台发布

相关推荐
神奇小汤圆16 分钟前
别再只会用ArrayList了!Java集合框架的性能天花板到底在哪?
后端
神奇小汤圆29 分钟前
Dubbo 的 SPI 和 JDK 的 SPI 有什么区别?
后端
叫我少年34 分钟前
C# 字符串基础
后端
道友可好1 小时前
从今天开始:你的第一个 Harness Engineering 实践
前端·人工智能·后端
其实是白羊2 小时前
CoderTools 1.5.3:让 AI 帮你看懂代码调用链路
后端·ai编程·vibecoding
妙码生花2 小时前
从 PHP 到 AI + Golang,程序员自救转型手记(二):目录结构、初始化 GIT、设计并开发配置系统
前端·后端·go
千寻girling2 小时前
一份不可多得的《微服务》教程
后端·面试·github
用户6362300571672 小时前
NestJS实战-文章专栏功能模块
后端
洛阳泰山2 小时前
从 0 到 1.6K Star:一个 Java 开源项目的增长复盘
人工智能·后端·开源
铁皮饭盒3 小时前
Bun执行python代码
前端·javascript·后端