HaloThemeHao文档:如何设置导航栏?

2023年 10月 16日 70.0k 0

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

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

标题

  • 进入站点后台
  • 点击左侧面板中的主题
  • 点击上方的导航
  • 修改标题字段即可
  • 主菜单

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

  • 进入站点后台
  • 点击左侧面板中的菜单
  • 点击主菜单
  • 点击右上角的新增
  • 可以通过拖拽调整缩进,从而创建子菜单
  • 填写相应表单即可
  • 标题左侧相关链接

  • 进入站点后台
  • 点击左侧面板中的菜单
  • 新增一个菜单,如媒体
  • 按照自己的需求新增菜单项
  • 点击左侧面板中的主题
  • 点击顶部的导航
  • 导航栏左侧相关链接设置成你刚刚新建的菜单即可
  • 版本>=1.3.2起,顶部菜单理论支持无限级,并且可自由配置菜单的显示方向

    如何取消左上角导航

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

    导航栏图标

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

    主题图标配置

    图标地址

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

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

    使用方式

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

    自定义导航栏图标

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

    本文由mdnice多平台发布

    相关文章

    JavaScript2024新功能:Object.groupBy、正则表达式v标志
    PHP trim 函数对多字节字符的使用和限制
    新函数 json_validate() 、randomizer 类扩展…20 个PHP 8.3 新特性全面解析
    使用HTMX为WordPress增效:如何在不使用复杂框架的情况下增强平台功能
    为React 19做准备:WordPress 6.6用户指南
    如何删除WordPress中的所有评论

    发布评论