在Shopify中显示颜色变体的名称

Question

我们在Shopify项目中使用色样。我们正在寻找一种解决方案，仅显示所选颜色变体的名称。是否有可能用液体实现这一点，还是需要JavaScript解决方案？

看看应该发生的地方：printnil.com

{% for variant in product.variants %}
<span>{{ variant.title }}</span>
{% endfor %}

Answer 1

如果您想根据用户的选择更改所显示的内容，则需要使用JavaScript。看一下this tutorial in the Shopify docs，它解释了如何创建一个用户更改其选择时调用的回调（您可能已在主题中使用此回调）：

var selectCallback = function(variant, selector) {
  <your code goes here>
}

您可以在此回调中访问变体的选项。例如。如果Color是第一个选项，请使用variant.option1获取当前选定的颜色。