Shopify 主题与 Liquid

Shopify routes 对象写错导致站内链接 404

现象#

导航里的「全部商品」点进去是 404,链接显示成 /collections// 或 /collectionsundefined,但后台集合确实存在。

原因#

  • routes 是固定对象,属性名拼错时输出空字符串,路径就少了一段
  • 把 handle 直接拼在 routes 后面,漏掉了 /collections/ 这一段前缀
  • 集合未发布或 handle 为空时拼出双斜杠路径,服务器按无效地址处理
  • 多语言站点没有使用带语言前缀的地址,切换语言后链接全部失效

处理步骤#

  1. 全部商品统一用 {{ routes.all_products_collection_url }},不要手写 /collections/all
  2. 集合链接用 {{ collection.url }},或拼 {{ routes.collections_url }}/{{ collection.handle }}
  3. 临时输出 {{ collection.handle | json }},确认 handle 不为空
  4. 核对属性名大小写,如 routes.root_url、routes.search_url、routes.cart_url
  5. 多语言环境下不要拼绝对路径,改用 routes 提供的本地化地址

验收标准#

导航点击后进入对应集合页,URL 中只有一层 /collections/;切换语言后路径带语言前缀且不再 404。

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