Shopify 在添加到购物车按钮中添加产品价格

Question

我想在“添加到购物车”按钮中添加价格。

如您所见，我可以在按钮内添加价格，但是当我更改变体时，它就会消失。 （URL 会随着选择不同的变体而改变）

显示问题的 GIF

有什么建议？

目前的代码是：

 <button {% if product.empty? %}type="button"{% else %}type="submit"{% endif %} name="add" id="AddToCart-{{ section_id }}" class="btn btn--full add-to-cart{% if enable_dynamic_buttons %} btn--secondary{% endif %}" {% unless current_variant.available %} disabled="disabled"{% endunless %}> <span id="AddToCartText-{{ section_id }}" data-default-text="{{ default_text }}"> {{ button_text }} {{ current_variant.price | money }} </span> </button>

Answer 1

答案是使用Javascript。 当您第一次渲染页面时，Liquid 渲染会在按钮上定价。 但是当你改变一个变体时，没有 Liquid 正在渲染，所以你只能使用 Javascript。 我相信现在，10 多年后，您可以找到一些可以完成您需要完成的工作的示例。

当变体发生变化时，通常一些 Javascript 运行“知道”变体，因此它是价格，因此唯一的挑战是在按钮上找到旧价格，并覆盖它。 通常是简单的东西。