Pet Field Guide · 主题使用文档
Shopify OS 2.0 宠物主题，v1.0.0。这一页把安装、设置、logo 规则和 demo 内容替换讲清楚；更细的逐区块说明写在主题包的 docs/ 目录里。
主题包含什么
- 44 个 section（全部可在主题编辑器里拖动、增删、改设置）
- 20 个页面模板 + 礼品卡模板（首页 / 商品 / 集合 / 搜索 / 购物车 / 博客 / 文章 / 404 / 密码页，以及 FAQ、尺寸指南、喂养指南、护理指南、成分表、配送与退货、关于、联系、数据共享退出等页面）
- 23 个 snippet、98 个文件；不依赖任何第三方 App
- 界面语言：英文 locale（含主题编辑器标签翻译）；多语言店铺由 Shopify Markets / Translate 承载
安装与配置
1 · 安装
- 后台 → Online Store → Themes
- 右上 Add theme → Upload zip file，选主题包 zip
- 上传完成后点 Preview 先看，确认无误再 Publish
2 · 换掉 demo 内容
- 首页各区块里的示例文案与图片都可以直接替换；图片是主题资源，换成自己的图即可
- 商品 / 集合 / 博客用你们自己的数据；主题自带的 demo 图只在没有真实图时作为兜底显示
- 导航、页尾菜单在 Content → Menus 里配（主题默认读
main-menu）
3 · 上线前检查
- Settings → Payments 开好收款方式（这一步只有店主能操作）
- 主题设置 → Style 里选配色与字体比例
- 手机宽度下过一遍首页 / 商品页 / 购物车，确认没有横向滚动
Logo 尺寸与形状
尺寸按高度算，不按宽度 —— 所以 logo 再宽也不会顶破导航条：
- Small 32px ｜ Medium 40px ｜ Large 52px ｜ Extra large 64px（高度）
- 宽度跟随图片自身比例，上限 高度 × 4；导航条高度会自动让出空间（只有 Extra large 会把条撑到 80px）
- 吸顶收缩态：logo 自动收到 36px，不会挤破缩小的导航条
- 手机端：高度封顶 44px、宽度 ≤ 42vw，与汉堡按钮留 8px 间距
四种形状：
- Original：原比例，不裁切 —— 上下堆叠或横向的完整 logo 用这个
- Rounded：原比例 + 12px 圆角
- Outline：原比例 + 细边框
- Circle：居中裁成方形做圆徽章（唯一会裁切的形状；写实照片或方形图形标最合适，宽字标会被切两端）
Border width / Padding 两个设置对所有形状生效，加上去也不会撑出容器。
设置在哪里
页头与导航（Header navigation）
- Layout：居中 logo / 左侧 logo + 巨型菜单 / 极简 + 抽屉
- Logo：图片、alt、文字兜底、尺寸、形状、边框、内边距
- Sticky / 首页透明：吸顶、滚动到 24px 后收缩并加模糊
- 菜单项带二级时自动生成多列巨型菜单面板（可加图文推荐位）
全局与风格
- 公告条：多条消息、滚动/居中/左对齐、速度（滚动无缝、无布局位移）
- 搜索抽屉、购物车抽屉（抽屉或页面模式）
- Style：配色预设
field-guide、字体比例、版心宽度、圆角与描边 - 页尾：多列菜单 + 邮件订阅 + 社交
可访问性与性能基线
- 可访问性：语义地标（
main）、每页一个 h1、可见焦点环、图片 alt、对比度按 WCAG AA 校准、图标按钮带 aria 标签；抽屉打开时锁焦点与滚动 - 性能：无 jQuery 等重依赖、图片原生懒加载与响应式 srcset、动效走 transform/opacity 并遵循
prefers-reduced-motion、公告条与抽屉无布局位移 - 实测基线：6 档宽度（375 / 390 / 414 / 768 / 1024 / 1440）× 首页、集合页、商品页逐页跑，横向溢出 0；
shopify theme check98 文件 0 offense
买之后：可选的三个出口
主题本身是自助的——买回去自己装就行。下面三项是给不想自己动手的人准备的，价格固定，不用先问价。
① 【店装】帮你装好并接上 —— $249
- 上传主题、接好你的导航菜单、logo、品牌色与字体
- 替换 demo 内容与演示图，核对支付/配送/税费设置
- 交期 3 天，交付前给你一页「哪个设置控制什么」的说明
② 【定制】按你的设计改 —— $899 起
- 新增自定 section、调整页面结构、按设计稿改造
- 固定范围固定价：谈好写下来再开工
③ 【照看】月度维护 —— $79/月（限 3 个名额）
- 可用性监控（掉了第一时间通知）+ 每月性能与 SEO 简报
- 坏链与证书检查 + 每月 2 小时小改
不确定该选哪个， 把店铺地址发我，我告诉你属于哪一档。
常见问题
需要安装 App 才能用吗？
不需要。主题只用 Shopify 原生能力（OS 2.0 区块 + JSON 模板），图片、字体都随主题走。
为什么上传 logo 之后看起来变小了？
尺寸是按高度算的（32/40/52/64px），这样 logo 不会顶破导航条。想更大就把 Logo size 调到 Large 或 Extra large。
选了 Circle，我的 logo 文字被切掉了
Circle 是居中方形裁切，适合方形图形标。上下堆叠或横长的 logo 请用 Original / Rounded / Outline，这三种不裁切。
更新主题会覆盖我的设置吗？
主题设置与模板设置会保留；但你手改过的主题代码文件会在更新时被覆盖 —— 有改代码就先备份。
订阅、评价、quiz 这些区块怎么用？
它们是预留槽位：版式与样式已就位，具体数据由对应的 App 或你们自己的实现注入。
支持哪些语言？
主题自带英文 locale（含编辑器标签翻译）。多语言店铺用 Shopify Markets 或 Translate 类 App 扩展。
需要帮忙？
安装卡住、设置找不到、或者觉得是主题的 bug —— 到支持页写清现象，一般 1–2 个工作日内回复。
版本 v1.0.0（2026-10-04）· 遇到问题请走 主题支持页。主题包内附许可文件，授权范围以该文件为准。