Claude Code presentation-structure 技能:维护 HTML 幻灯片编号和目录
EnglishClaude Code 安装步骤
- 打开固定提交的仓库工作副本。确认 `.claude/skills/presentation/presentation-structure/SKILL.md` 和 `presentation/vibe-coding-to-agentic-engineering/index.html` 存在,保留原有目录结构。
- 从项目根目录启动 Claude Code,直接说明要增加或调换的幻灯片,并指定使用 `presentation-structure` 阅读原文件的编号与分段规则。
中文摘要
面向该项目的单文件 HTML 演示文稿。插页或调换顺序后,核对 `data-slide`、目录跳转和 `data-level` 继承,避免目录指到错页或进度条提前变化。
SKILL.md 中文导读
可复现示例
在原第 14 页后新增「如何写好交接提示」一页,仍属于 Low 段。请把新页排成第 15 页,原第 15 页以后依次顺延,目录仍应跳到各自的主题标题。工作步骤
- 先确定目标页属于哪个主题段,以及它是否需要开启新的难度层级。
- 按实际顺序重排后续页面的 `data-slide` 并更新目录中对应的 `goToSlide()` 参数。
- 浏览器打开演示文稿,检查目录链接、左右方向键、页面总数及插页前后的进度条。
验收方法
新页编号为 15,所有编号连续且唯一,目录目标和顺延后的章节标题相符。插页继承 Low,进度条在该段仍显示 25%,页面总数增加一。
GitHub 原文 · 更新日期
适用环境
Claude Code 和固定版本的 claude-code-best-practice 仓库。演示文稿位于 `presentation/vibe-coding-to-agentic-engineering/index.html`,浏览器用于检查跳转和进度条。
常见问题
每张新增幻灯片都要写 `data-level` 吗?
仅在开启新层级的分隔页设置。普通页沿用最近一次设置的层级,页面脚本根据分隔页补上层级标识。