Butterfly 主题菜单配置

简介: Butterfly 主题菜单配置

开启菜单和配置页面

打开主题配置文件_config.butterfly.yml, 就可以看到被注释掉的菜单


menu:
  # Home: / || fas fa-home
  # Archives: /archives/ || fas fa-archive
  # Tags: /tags/ || fas fa-tags
  # Categories: /categories/ || fas fa-folder-open
  # List||fas fa-list:
  #   Music: /music/ || fas fa-music
  #   Movie: /movies/ || fas fa-video
  # Link: /link/ || fas fa-link
  # About: /about/ || fas fa-heart


取消注释,并将菜单名称改为中文

menu:
   首页: / || fas fa-home
   归档: /archives/ || fas fa-archive
   标签: /tags/ || fas fa-tags
   分类: /categories/ || fas fa-folder-open
   列表||fas fa-list:
     音乐: /music/ || fas fa-music
     电影: /movies/ || fas fa-video
   友链: /link/ || fas fa-link
   关于: /about/ || fas fa-heart


除了首页和归档,其它菜单需要手动创建

source 目录下创建 tagscategoriesmusicmovieslinkabout 这 6 个目录,并在目录下分别创建 index.md 文件

2.png

index.md 文件中,title 值可以自定义,该字符串最终会显示在页面上; type 值为目录名称即可


自定义菜单

如果想添加更多的菜单和页面仿照上面的写法继续在下面添加即可。

设置菜单图标

双竖线 (||) 后面就是菜单的图标,例如首页: / || fas fa-home,这里的 fas fa-home 就是对应的图标

直接复制 fas fa-home 百度搜索进入

3.png


可以看到,图标直接在线引用。在这个网站(The Icons)继续英文单词搜索对应的图标,把代码中 class 属性值复制到配置文件中双竖线后即可,注意空格

4.png


上图就是我的博客菜单设置,多级菜单仿照例子照搬即可

相关文章
|
前端开发 开发者 容器
|
安全 应用服务中间件 API
我发现了宝塔的未授权访问漏洞
宝塔的未授权访问漏洞
764 1
|
5月前
|
Linux 网络安全 虚拟化
阿里云开发者分享VMware17 Pro保姆级安装秘籍,详细步骤助你轻松搞定安装!
这是一篇超详细的VMware 17 Pro虚拟机下载与安装教程。VMware 17 Pro支持多操作系统模拟运行,适合开发、测试及教育使用。文章涵盖从下载到安装的全流程,包括解压安装包、接受协议、配置安装路径等步骤,并提供虚拟机优化(如安装VMware Tools、配置快照和共享文件夹)及使用指南。同时,针对常见问题如虚拟化未启用或软件阻止启动,提供了具体解决方案,帮助用户顺利部署和使用虚拟机环境。
1321 36
阿里云开发者分享VMware17 Pro保姆级安装秘籍,详细步骤助你轻松搞定安装!
|
SQL 存储 开发框架
数据库必知词汇:用户定义函数(UDF)
用户定义函数(UDF) 由一个或多个SQL语句组成的子程序,可用于封装代码以便重新使用。通常情况下不将用户限制在定义为SQL语言一部分的内置函数上,而是允许用户创建自己的用户定义函数。
2582 0
|
9月前
|
存储 关系型数据库 数据库
极简开发,极速上线:构建端到端大模型应用
本文将以一个经典的 RAG(检索增强生成)知识问答系统为例,详细介绍从智能体设计到最终应用部署的全流程。
1376 82
|
9月前
|
机器学习/深度学习 运维 监控
灵骏智算实例异常预测技术
本文介绍了灵骏智算实例异常预测技术,旨在提前预测GPU等设备的故障,确保大模型训练的稳定性。文章首先探讨了为何需要进行异常预测,指出大规模GPU集群在大模型训练中面临的稳定性挑战。接着阐述了预测的可行性和原理,通过分析复杂系统中的小异常逐步积累导致故障的现象,利用时序指标和关键指标分布模式进行预测。目前该技术可在1-250分钟内提前预测故障,准确率达95%以上,召回率超过20%。最后介绍了系统的集成与应用,强调了端侧部署预测模型的优势,包括降低网络开销、保护用户数据隐私等。
|
前端开发 JavaScript 开发工具
使用jsDelivr和GitHub,上传本地静态资源到免费CDN
本文介绍了一种将本地图片和静态资源(如 js、css、文档等)上传至免费CDN的方法,便于随时调用。具体步骤包括:在GitHub创建仓库`resources`存放资源;通过上传或Git命令同步文件;在仓库中创建新版本并发布。之后即可通过指定格式的URL访问这些CDN资源。此方法简单高效,适合开发者快速部署和共享静态内容。
811 2
使用jsDelivr和GitHub,上传本地静态资源到免费CDN
|
运维 JavaScript Devops
DevOps实践:通过云效实现hexo自动构建部署发布
DevOps是一种融合开发、技术运营和质量保证的流程,旨在增强跨部门沟通与协作。通过自动化软件交付和架构变更,DevOps加速了构建、测试和发布软件的过程。本文作者分享了如何使用阿里云效平台实现个人Hexo博客的自动化部署,从而实现持续集成和持续部署(CI/CD)。在应用DevOps之前,作者需手动上传和部署文件;应用后,只需提交Markdown文件,其余步骤由DevOps平台自动完成。通过云效平台的代码管理和流水线功能,实现了从代码提交到自动发布的无缝衔接。
314 2
DevOps实践:通过云效实现hexo自动构建部署发布
|
域名解析 前端开发 Cloud Native
【阿里云开发】一键部署静态博客——Hexo
【阿里云开发】一键部署静态博客——Hexo
611 0
【阿里云开发】一键部署静态博客——Hexo
|
安全 Linux 调度
Linux线程管理:深入探索多线程编程的原理与实践
在Linux操作系统中,线程是轻量级的执行单元,多线程编程允许程序在同一进程内执行多个并发任务,提高程序性能和资源利用率。本文将深入探讨Linux线程管理的相关知识,包括线程的创建、终止与调度,以及线程间通信的实现,旨在帮助读者深入理解多线程编程的原理与实践。
790 1