在 Shopify 中显示特定产品的产品价格

Question

我目前正在尝试在我的 shopify 商店中显示我所有产品的价格。我已经设法使用以下代码为我的第一个产品展示了这一点：

<div class="grid__item">
{% for collection in collections %}



    {% for product in collection.products %}
   {% for variant in product.variants %}


{% if forloop.index <=1 %}
<div id="temp_first" style="display:none;">
<div class="style14">Style</div>
<div class="style11">(No)</div>
<div class="front"><img src="//files/front.jpg?v=1473520767" title="1 Sided Full Color" /></div>
<div class="reverse"><img src="//1/1265/7581/files/reverse.jpg?v=1473520807" title="1 Sided Only" /></div>
<div class="price"><a href="/products/leaflets?variant={{ variant.id }}">{{ variant.price | money | remove: '.00'}}</a></div>

{% elsif forloop.index <7 %}
<div class="price"><a href="/products/leaflets?variant={{ variant.id }}">{{ variant.price | money | remove: '.00'}}</a></div>

{% elsif forloop.index <10 %} 
<div class="price2"><a href="/products/leaflets?variant={{ variant.id }}">{{ variant.price | money | remove: '.00'}}</a></div>

{% elsif forloop.index <13 %} 
<div class="price3"><a href="/products/leaflets?variant={{ variant.id }}">{{ variant.price | money | remove: '.00'}}</a></div>

{% elsif forloop.index ==13 %}
<div class="price3"><a href="/products/leaflets?variant={{ variant.id }}">{{ variant.price | money | remove: '.00'}}</a></div>
</div>
{% endif %}

   {% endfor %}
{% endfor %}


{% endfor %}

现在效果很好。我现在遇到的问题是我想显示第二个产品的价格，我复制了上面的代码并更改了链接，以便将其链接到正确的产品页面和变体，这工作正常。问题是显示的价格是针对第一个产品的，我不知道我需要在代码中更改什么以针对第二个产品。无论是它的句柄名称还是什么，我只是不确定，因此需要一些帮助。

如果有人可以建议，我如何定位第二个产品，我将不胜感激。

提前致谢。

Answer 1

您可以使用以下语法获取任意产品变量：

{% assign custom_product = all_products['product-handle'] %} （其中 'product-handle' 将替换为您要抓取的产品的手柄）。

这可以动态完成：

{% assign some_handle = 'product-handle' %}
{% assign custom_product = all_products[some_handle] %}

如果您有一些主要产品的属性来说明次要产品是什么（例如使用应用程序或 Shopify FD 浏览器扩展设置的元字段），您可以像这样引用它：

{% assign some_handle = product.metafields.custom_namespace.related_product %}
{% assign custom_product = all_products[some_handle] %}

以上任何示例中的变量 custom_product 都是代表此时适​​当产品的变量，因此我们可以引用该产品的任何产品属性，就像我们引用主要产品一样。例如：

<h3>{{ product.title }} is {{ product.price | money }}, but {{ custom_product.title }} is {{ custom_product.price | money }}</h3>

PS - 此外，您可以使用 {{ variant.price | money_without_trailing_zeros }} 而不是链接金钱和删除过滤器。

PPS - 再次查看您的原始代码，请注意，您可以通过使链接动态化来省去一些麻烦：<a href="/products/{{ product.handle }}?variant={{ variant.id }}">

PPPS - 您编写的代码试图遍历每个集合中每个产品的每个变体。根据您的产品列表的大小，这可能不起作用 - Shopify 对在您不分页时为集合返回的产品数量有一个硬性上限。根据您要完成的具体工作，您可能能够更好地利用 Liquid 模板语言，以更简洁和易于管理的方式让一切工作。 :)

---

示例（根据原发帖者的说明）

如果您要创建多个网格以显示在页面的背景中，那么这样的内容呢？

<div class="product_grid_container">
{% for custom_product in collection.products %}
  <div class="price_grid" data-product-id="{{ custom_product.id }}" data-index="{{ forloop.index }}">
    <a href="/products/{{ custom_product.handle }}">{{ custom_product.title }}</a>
    <!-- Any other header information here -->
    {% for variant in custom_product.variants %}
    <!-- Logic/structure for displaying variants for the product in the grid here. If it's complicated, you might want to move it to a separate snippet and then use an include statement. -->
    {% endfor %}
  </div>
{% endfor %}
</div>

这将为您关心的每个产品生成一个独特的 HTML 网格，然后您可以使用 CSS 规则对它们进行适当的定位/样式设置。

这会让你更接近你所追求的吗？