Shopify 主题与 Liquid

Liquid 菜单链接输出成绝对地址导致预览站跳到正式站

现象#

在主题预览或 theme dev 环境点导航,直接跳到线上正式域名,预览环境的改动完全看不到。

原因#

  • 模板里用了 {{ link.url }},它返回带域名的绝对地址,且指向发布主题所在店铺
  • 菜单项被设置成完整 URL 而不是站内资源,后台菜单里填了 https:// 开头的地址
  • 多域名店铺下 routes.root_url 指向主域名,预览参数 ?_ab=0 丢失

处理步骤#

  1. 把 {{ link.url }} 换成 {{ link.url | within: collection }} 无效时,改用 {{ link.url }} 输出后用 JS 无关的相对化处理,或直接使用 {{ link.handle }} 拼 {{ routes.root_url }}
  2. 后台「内容 → 菜单」里检查每一项,站内页面必须选资源而不是手填 URL
  3. 预览时用「分享预览链接」而不是直接拼域名,预览令牌会跟着链接走
  4. 多域名店铺在 settings_data.json 里确认 primary_domain,避免预览被重定向

验收标准#

在预览链接下点击导航仍停留在预览域,URL 里保留预览参数;正式站导航地址正确。

本文由 风格技术 技术团队整理,适用于 Shopify 标准版与 Plus 店铺。Shopify 平台能力迭代较快,具体操作路径与字段以官方文档和店铺后台实际版本为准。