时间戳

首页 > 解决方案 > 如何在产品概览中仅显示可用的产品多属性价格

shopify - 如何在产品概览中仅显示可用的产品多属性价格

问题描述

我想显示可用/库存产品变体的最低价格，而不是“从”+所有产品变体的最低价格，即使它们没有库存。我正在使用 Prestige 主题，关于如何实现这一目标的任何提示？

如果我是对的，我在 product-item.liquid 中找到了以下代码部分，它显示了价格，并在 flickity 轮播和产品概览页面中呈现：

<div class="ProductItem__PriceList {% if show_price_on_hover %}ProductItem__PriceList--showOnHover{% endif %} Heading">
        {%- if product.compare_at_price > product.price -%}
          <span class="ProductItem__Price Price Price--highlight Text--subdued">{{ product.price | money_without_trailing_zeros }}</span>
          <span class="ProductItem__Price Price Price--compareAt Text--subdued">{{ product.compare_at_price | money_without_trailing_zeros }}</span>
        {%- elsif product.price_varies -%}
          {%- capture formatted_min_price -%}{{ product.price_min | money_without_trailing_zeros }}{%- endcapture -%}
          {%- capture formatted_max_price -%}{{ product.price_max | money_without_trailing_zeros }}{%- endcapture -%}
          <span class="ProductItem__Price Price Text--subdued">{{ 'collection.product.from_price_html' | t: min_price: formatted_min_price, max_price: formatted_max_price }}</span>
        {%- else -%}
          <span class="ProductItem__Price Price Text--subdued">{{ product.price | money_without_trailing_zeros }}</span>
        {%- endif -%}
      </div>

      {%- if product.selected_or_first_available_variant.unit_price_measurement -%}
        <div class="ProductItem__UnitPriceMeasurement">
          <div class="UnitPriceMeasurement Heading Text--subdued">
            <span class="UnitPriceMeasurement__Price">{{ product.selected_or_first_available_variant.unit_price | money_without_trailing_zeros }}</span>
            <span class="UnitPriceMeasurement__Separator">/ </span>

            {%- if product.selected_or_first_available_variant.unit_price_measurement.reference_value != 1 -%}
              <span class="UnitPriceMeasurement__ReferenceValue">{{ product.selected_or_first_available_variant.unit_price_measurement.reference_value }}</span>
            {%- endif -%}

            <span class="UnitPriceMeasurement__ReferenceUnit">{{ product.selected_or_first_available_variant.unit_price_measurement.reference_unit }}</span>
          </div>
        </div>
      {%- endif -%}

我尝试使用 Shopify-Blog 中的以下代码https://www.shopify.com/partners/blog/collection-page-price-range

{% if available %}
  {% if product.price_varies and template == 'collection' %}
    From {{ product.price_min | money }} to {{ product.price_max | money }} 
  {% else %}
    {{ money_price }}
  {% endif %}
{% else %}
  {{ 'products.product.sold_out' | t }}
{% endif %}

但是，此代码显示产品已售罄。

标签： shopify

解决方案

如果您设置product_pricetocompare为第一个变量的值会更好。这将检查是否有变体。如果没有变体，你会看到 999999，这是不好的。

例子：

{% for variant in product.variants %}
  {% if forloop.index == 1 %}
     {% assign product_pricetocompare = variant.price %}
  {% else %}
    {% if variant.available %}
      {% if variant.price < product_pricetocompare %}
        {% assign product_pricetocompare = variant.price %}
      {% endif %}
    {% endif %}
  {% endif %}
{% endfor %}

推荐阅读