TKL侧边导航定制教程：Works作品集、分类菜单与友情链接下拉框的完整配置方法
【免费下载链接】TKLHexo Theme项目地址: https://gitcode.com/gh_mirrors/tk/TKL
TKL 是一款免费且高度可定制的 Hexo 响应式博客主题，其右侧滑出的侧边导航是整站导航体验的核心。本教程是一份 TKL 侧边导航定制完整指南，只改一个主题配置文件，就能让你轻松搞定Works 作品集下拉框、Categories 分类菜单、Links 友情链接下拉框三大板块——全程无需修改任何模板代码，10 分钟即可拥有专业级 Hexo 博客导航栏 🚀
📋 侧边导航结构速览：下拉框从哪里来
TKL 的侧边导航由固定项 + 三个下拉板块组成，整体结构一目了然：
| 板块 | 配置来源 | 数据来源 | 说明 |
|---|---|---|---|
| Home / Archives | 无需配置 | 自动 | 固定入口，始终显示 |
| Works | 主题_config.yml的works | 手工配置 | 作品集/项目页下拉框 |
| Categories | 无需配置 | 文章 front-matter 自动生成 | 按分类名排序，并显示文章数 |
| Links | 主题_config.yml的links | 手工配置 | 友情链接下拉框 |
三个下拉板块的渲染逻辑都集中在侧边导航模板 layout/_partial/header.ejs 中。理解一条关键规则后，后续配置事半功倍：
下拉框只在对应列表非空时才会渲染——配置为空或没配置，整个入口直接消失，而不是显示一个空菜单。
✍️ Works 作品集下拉框：一分钟完成配置
打开主题根目录下的配置文件 _config.yml，找到works字段，按列表格式逐项添加：
works: - works_name: 个人作品 works_url: /portfolio - works_name: 摄影集 works_url: /gallery每个条目只需两个字段：
| 字段 | 作用 |
|---|---|
works_name | 侧边导航中显示的菜单文字 |
works_url | 点击后跳转的地址（内部路径或完整网址） |
几个实用细节：
- 菜单项点击后会在新标签页打开（模板中已内置
target="_BLANK"），适合跳转外部作品集页面； - 想隐藏 Works 入口？把整个
works块删掉（或留空）即可，侧边导航会自动跳过它； - 建议条目控制在 4~6 个以内，下拉框过长会影响可读性。
🗂️ 分类菜单：全站最省事的导航入口
Categories 下拉菜单是 TKL 最"省心"的部分：它不需要任何配置，由主题自动扫描全站文章的分发生成，菜单名后还自带文章计数，例如C/C++(2)、JavaScript(3)。
你只需要做好两件事：
1. 在文章 front-matter 中写明分类
--- title: 我的第一篇文章 categories: [Hexo, 主题定制] ---2. 确认 Hexo 主配置启用了分类页面
在 Hexo 根目录的_config.yml中确保以下值为 1（启用分页）：
archive: 1 category: 1 tag: 1分类页对应的页面模板为 layout/category.ejs，菜单按分类名自动排序，文章数越多，读者越容易找到内容 📖
🔗 Links 友情链接下拉框：配置方法
友情链接同样在 _config.yml 中配置，结构与 Works 一致，只是字段名不同：
links: - name: 朋友A link: 朋友A的博客地址 - name: 朋友B link: 朋友B的博客地址name为显示名称，link填写朋友的完整博客网址；- 与 Works 不同，Links 的链接在当前窗口打开（模板未加新标签页属性）；
- 列表留空时 Links 入口自动隐藏，和 Works 的行为完全一致。
✅ 配置生效与常见问题清单
改完配置后，执行一次重新生成并部署，让改动真正生效：
hexo clean && hexo g -d遇到效果不符预期时，按这份排查清单逐项检查：
| 现象 | 原因与解决办法 |
|---|---|
| 下拉框没出现 | 列表为空、YAML 缩进错误（-需与字段顶格、子字段缩进 2 格） |
菜单文字显示成[object Object] | 漏写了works_name/name字段名 |
| 顶部导航栏整体不显示 | 新版 Hexo 会自动补全闭合标签，可按 README.md 说明安装 hexo 3.7.1 解决 |
| 首页横幅模糊、留白多 | 换一张高分辨率图片，在 _config.yml 中修改cover字段即可 |
最后检查一遍：配置改动全部集中在一个_config.yml，Works、Categories、Links 三板块各司其职。把作品链接、内容分类、好友博客都安排进侧边导航后，你的 Hexo 博客就有了清晰完整的站点地图——剩下的，就是安心写文章了 ✍️
【免费下载链接】TKLHexo Theme项目地址: https://gitcode.com/gh_mirrors/tk/TKL
创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
