Themes
Components
Show the credit cost on product cards on your collection pages.
Create a new snippet called credit-cost. Copy and paste in the code below. Reference the snippet from your product card liquid file. In Dawn this is snippets/card-product.liquid.
{% comment %} Renders a list of product's credit cost Accepts: - product: {Object} Product Liquid object (optional) Usage: {% render 'credit-cost', product: product %} {% endcomment %} {% assign credit_costs = product.variants | map: 'metafields' | map: 'supercycle' | map: 'credit_cost' %} {% assign min_credit_cost = credit_costs[0] %} {% assign max_credit_cost = credit_costs[0] %} {% for cost in credit_costs %} {% if cost < min_credit_cost %} {% assign min_credit_cost = cost %} {% elsif cost > max_credit_cost %} {% assign max_credit_cost = cost %} {% endif %} {% endfor %} {% if min_credit_cost == max_credit_cost %} {% capture credit_cost %}{{min_credit_cost}} {{min_credit_cost | pluralize: "credit", "credits"}}{% endcapture %} {% else %} {% capture credit_cost %}{{'products.product.price.from_price_html' | t: price: min_credit_cost}} {{min_credit_cost | pluralize: "credit", "credits"}}{% endcapture %} {% endif %} {% if min_credit_cost > 0 %} <div class="price"> <div class="price__container"> <div class="price__regular"> <span class="price-item price-item--regular"> {{ credit_cost }} </span> </div> </div> </div> {% endif %}
To reference the snippet use the code below:
{% render 'credit-cost', product: card_product %}