Shopify 知识库 · 指南
Shopify Contact Us 页面配方
从 page template type 出发，设计问题分流、联系表单、反馈状态与 Shopify Theme 实现。
Contact Us 的任务不是展示一个孤立表单，而是帮助访客判断“这个问题应不应该在这里提交、需要提供什么、提交后会发生什么”。它属于 page template type；简单联系页可以使用 page.json，稳定包含分流和表单的组成可以使用 page.contact.json。
页面内容清单
| 优先级 | 页面内容 | 回答的问题 | 来源边界 |
|---|---|---|---|
| 核心 | 联系范围 | 哪些问题可以在这里处理 | 真实支持或运营职责 |
| 核心 | 问题分流 | 订单、售前、合作等分别走哪里 | 当前可用渠道 |
| 核心 | 必要字段 | 为处理问题必须提供什么 | 最小化后的处理需求 |
| 核心 | 成功与错误反馈 | 是否提交成功、怎样修正 | 实际表单状态 |
| 可选 | 响应预期 | 什么时候、以什么方式回复 | 能兑现的服务流程 |
| 可选 | 地址与服务时间 | 是否适合线下或特定时段联系 | 当前地点和营业记录 |
| 可选 | 常见问题 | 能否先自助解决 | 与当前联系任务相关的 FAQ 子集 |
不要展示不存在的渠道、无法兑现的回复时效，或要求用户在公开字段提交支付凭证等敏感信息。
内容 × 展现形式
| 内容 | 首选形式 | 适用条件 | 退化方式 |
|---|---|---|---|
| 联系范围 | Intro | 有明确服务边界 | 标题和短段落 |
| 问题分流 | Link Cards 或 List | 存在两个以上真实入口 | 一个明确联系入口 |
| 联系字段 | Inline Form | 当前页面可直接提交 | 明确替代联系路径 |
| 服务时间与地址 | Definition List | 信息稳定且与联系有关 | 静态正文 |
| 常见问题 | Accordion 或分组列表 | 能减少重复提交 | 链接完整 FAQ 页面 |
推荐顺序是：
联系范围 × Intro → 问题分流 × Link List → 联系字段 × Form → 服务信息 × Definition List → FAQ 子集 × Accordion
如果只有一种联系方法，删除分流模块；如果没有可工作的提交处理，不能用静态表单伪装联系渠道。
Shopify Theme 实现
| 层次 | 建议职责 |
|---|---|
| 资源 | Page 保存联系范围、说明和真实替代渠道 |
| Template | 默认 page.json 或稳定的 page.contact.json |
| Main Section | 输出 Page 标题、说明和联系表单 |
| Liquid | 使用带 contact 类型的 form tag，并呈现错误与成功反馈 |
| Sections | 问题分流、地址服务信息和 FAQ 子集按需独立 |
| Blocks | 单个入口、地点或问答项 |
| Settings | 字段标签、必要说明和内容选择；字段由真实处理需求决定 |
表单字段、隐私说明、通知去向和处理责任必须在真实店铺流程中核验；页面配方不替代这些运营决定。
发布检查
- 每个联系入口都真实可用，且访客能判断适用问题；
- 必填字段确实为处理所需，错误和成功状态可理解；
- 键盘、标签、错误关联和焦点反馈可用；
- 不承诺未经确认的响应时间；
- 没有工作表单时提供真实替代路径，而不是保留无法提交的 UI。