Chime 移动端售后引导页（Onboarding Flow）
5 步走完 SmartLife + Google Home 配对流程。 用户扫描说明书上的二维码即进入
chime-s1.html，依次翻到 s5 完成配置。
部署位置（正式版）
| 项 | 值 |
|---|---|
| 源码目录 | docs/public/（git 仓库，随官网发布，页面位于站点根） |
| 线上短链（二维码用） | https://zelventa.com/chime-s1（s2–s5 同理） |
| 物理文件 URL | https://zelventa.com/chime-s1.html |
| 工作草稿 | /Users/wwj/WorkBuddy/zelventa网站优化/（非 git） |
VitePress 的 public/ 目录会原样发布到站点根路径。Cloudflare Pages 的 Clean URLs 功能已开启（你的 /smart-chime-pro 等页面已在用），会自动把 /chime-s1 映射到 /chime-s1.html，无需任何 _redirects 规则。二维码直接指向 https://zelventa.com/chime-s1 即可。
⚠️ 之前尝试用
_redirects规则（200 和 301 都试过），均与 Cloudflare Pages 的 Clean URLs 冲突，导致ERR_TOO_MANY_REDIRECTS死循环。已删除_redirects，依靠 Cloudflare 自带功能即可。
文件清单
| 文件 | 步骤 | 标题 | 状态 |
|---|---|---|---|
chime-s1.html | 01 | Add Your Chime to SmartLife | ✅ 就绪（视频已就位） |
chime-s2.html | 02 | Turn On Chime Alert Modes | 🟡 视频待上传 |
chime-s3.html | 03 | Link SmartLife to Google Home | 🟡 视频待上传 |
chime-s4.html | 04 | Create a Household Automation | 🟡 视频待上传（关键步骤） |
chime-s5.html | 05 | Doorbell Press → Chime Rings | 🟡 视频待上传 |
index.html | — | 桌面端 5 步预览（仅供测试） | ✅ |
页面间 Previous / Next 按钮已互链（chime-sX.html），无需手动跳转。
上线前必做
1. 视频来源（R2 CDN，已与 _headers 同步配置）
视频从 2026-08-26 起统一存放在 Cloudflare R2 桶（自定义域名 https://media.zelventa.com），5 页 chime-s*.html 的 <video src> 全部使用绝对 URL https://media.zelventa.com/chime-sN.mp4，smart-chime / smart-chime-pro 引用的 4 个 setup 视频同样在该桶：
nest-guide.mp4、nest-pro-guide.mp4、alexa-chime-guide.mp4、alexa-guide.mp4
CSP 已配：_headers 中 Content-Security-Policy 末尾追加 media-src https://media.zelventa.com，允许跨域加载该域名的媒体资源。以后再增改视频源域名，必须同步更新 _headers 的 media-src，否则视频会被 CSP 静默拦截（黑屏、控件显示 0:00）。
- 更新视频内容：直接在 Cloudflare R2 后台上传同名文件覆盖（页面无需重新部署）
- 改动 HTML / 视频引用：git push → CF Pages 自动构建部署
2. 客服入口
已按要求去掉全部 "Need help" 链接，footer 仅保留 Previous / Next 按钮，不追加任何客服入口。
s4 特殊设计（关键步骤）
第 4 步是退货/差评的头号原因。页面里专门加了：
- 蓝色 info 框：标准操作步骤
- 琥珀色 warning 框：「Use Household — not Personal. Personal routines will not trigger the chime.」
Google Home 在不同账号/版本下可能默认只有 Personal 路径，文案中已说明需更新 Google Home 到最新版。
设计要点
- 单文件 HTML：每个文件 5–8 KB，零外部依赖，离线可跑
- 竖屏视频容器：
aspect-ratio: 9/14，自动适配 - iPhone 安全区：
env(safe-area-inset-*)已处理刘海/底部小白条 - 懒加载：
preload="metadata"，首屏秒开，播放时再加载完整视频 - 无障碍：
aria-label、role="progressbar"、44px 触控目标
本地预览
bash
cd /Users/wwj/Documents/GitHub/zelventa-product-support/docs/public
python3 -m http.server 8000
# 浏览器打开 http://localhost:8000/index.html（桌面并排预览）
# 或 http://localhost:8000/chime-s1.html（真机扫码测试；短链 /chime-s1 仅在 Cloudflare 线上生效）文件历史
2026-08-24：.md源文件（内容为 HTML）已迁移为正式chime-sX.html，内部链接.md → .html已修正；正式版归档至docs/public/chime-setup/。2026-08-24：视频方案确认为站点同源部署（相对路径引用，无需改 CSP）；s5 文件名确认为chime-s5.mp4；"Need help" 客服入口已全部移除（页面与 README）。2026-08-24：页面从chime-setup/子目录移至站点根，_redirects先后尝试 200/301 均与 Cloudflare Pages Clean URLs 冲突导致死循环，最终方案：删除_redirects，依靠 Cloudflare Pages 自带 Clean URLs 功能自动映射/chime-s1→/chime-s1.html。