shopify - 如何验证 Shopify 主题设置？

Question

与 Shopify API您可以设置输入字段供用户调整主题，例如:

{
  "type": "number",
  "id": "products_per_page",
  "label": "Products per page",
  "default": 20
}

在页面主题管理面板侧边栏中显示一个复选框。但是，用户可以设置无效值，例如 -2。

在那种情况下，据我所知，我可以更改 liquid 文件以显示错误消息。

但是，问题是，当用户不会注意到错误时，其他用户就会看到它。

所以我的问题是:如何验证 Shopify 主题设置？

有没有办法在输入字段旁边的侧边栏中显示错误消息，或者仅向管理员显示液体中的错误消息？

Answer 1

很遗憾，不行:Shopify 不允许通过管理工具对主题设置进行自定义验证

如果您想对主题设置中的任何输入施加约束，则您只能使用可用数据类型的控件:

• Range :适用于具有最小值/最大值的数字范围，但分辨率限于您指定的 step。 Shopify 在最小值和最大值之间还有最多约 100 个步进点，因此如果您必须覆盖的范围足够大，则此选择不会覆盖您

• Select :最适合文本选项，如果选项超过 6-8 个，很快就会变得很麻烦。

• Radio : 也最适合文本选项，并且只有在只有少量选择的情况下。

如果这些有限的用例无法涵盖您的验证逻辑，那么不幸的是，您无法指定将在主题设置更新期间强制执行的自己的验证公式。

不过，有一种(有点笨拙的)方法可以仅在主题定制器中显示错误

使用 Shopify Community 中分享的这个技巧，您可以检查 content_for_header 的内容以测试通过定制器预览查看主题时注入(inject)的脚本之一:

{% if content_for_header contains "Shopify.designMode" %}
  Customizer
{% else %}
  Live!
{% endif %}

这样您就可以编写一个代码片段来测试任何具有复杂验证逻辑的设置，并在设置未 check out 的情况下在主题定制器页面上显示一个大错误栏，同时不会警告实际网站上的任何购物者。

请注意，这将依赖于您测试的注入(inject)代码是否存在 - 如果 Shopify 将来更新他们的代码注入(inject)，这个技巧将停止工作/需要更新以测试他们更新定制程序代码注入(inject)的任何内容到。