Overview && 在线 Demo 与源码
skill当前比较🔥,我个人也写了很多skill,每一个skill都放到github感觉比较重,不是很有必要,所以单独开发了一个halo的plugin用于展示,过程中借鉴各种skillhub。
在线展示:https://boommanpro.cn/skill
插件源码:halo-plugin-skill-showcase
配套主题模板:halo-theme-chirpy 的 skill 模板
如果你也在用 Halo,并且手里攒了一堆 skill,欢迎直接装这个插件,把作品集当成内容和博客一起管理。
三种 Skill 形态
插件把 skill 抽象成三种内容形态,前台分别用合适的方式展示:
Markdown 文档:直接在管理端写/导入 markdown,前台渲染成图文文档
ZIP 网站包:包含 index.html,前台用 iframe 直接打开成可交互演示站
ZIP 项目包:以 SKILL.md 作为入口,前台用文件树加代码查看器浏览
外链:只填一个 URL,前台一键跳转
管理端做了哪些事
插件装到后台后,在「插件」页比原生页面多出两个标签,用来管理数据和展示形态:
Skill 管理:增删改查、发布/下架、搜索、分类筛选、标签内联编辑
Category 管理:维护分类的显示名、图标和排序
ZIP 支持在线更新:重新上传替换,slug 不变
所有类型都支持预览:Markdown 直接预览,ZIP 在线预览,外链跳转

技术实现
做这个插件的过程里,实现细节:
路由复用 Halo 官方的 @Component + RouterFunction 模式,插件安装后自动注册到根上下文
ZIP 上传后解压并解析入口文件,优先级是 SKILL.md → README.md → 首个 md
主题模板通过 SkillFinder 这个 Bean 读取数据,所以可以被任意主题复用
Markdown 渲染、代码高亮、iframe 预览都在前台用现成库完成