115 lines
4.2 KiB
Plaintext
115 lines
4.2 KiB
Plaintext
{% comment %}
|
|
Renders a list of product's price (regular, sale, unit)
|
|
Accompanies product listings (collection page, search result) and not updated dynamically
|
|
Accepts:
|
|
- variant: {Object} Variant Liquid object (optional)
|
|
- product: {Object} Product Liquid object (optional)
|
|
- show_vendor: {Boolean} Show the product's vendor depending on the section setting (optional)
|
|
|
|
Usage:
|
|
{% include 'product-price-listing', product: product %}
|
|
{% endcomment %}
|
|
{%- liquid
|
|
if product.title
|
|
assign compare_at_price = product.compare_at_price
|
|
assign price = product.price
|
|
assign available = product.available
|
|
assign variant = product.variants.first
|
|
else
|
|
assign compare_at_price = 1999
|
|
assign price = 1999
|
|
assign available = true
|
|
endif
|
|
|
|
if product.title and product.metafields.app--168074346497.min_auto_discounted_price.value and product.metafields.app--168074346497.discount_percentage.value > 0.01
|
|
assign deducted_percentage = 1.0 | minus: product.metafields.app--168074346497.discount_percentage.value
|
|
assign price = product.price | divided_by: 100.0 | times: deducted_percentage | times: 100.0 | ceil
|
|
|
|
assign compare_at_price = product.price
|
|
if product.compare_at_price > compare_at_price
|
|
assign compare_at_price = product.compare_at_price
|
|
endif
|
|
endif
|
|
|
|
assign money_price = price | money
|
|
-%}
|
|
|
|
<div class="price price--listing
|
|
{%- if available == false %} price--sold-out {% endif -%}
|
|
{%- if compare_at_price > price %} price--on-sale {% endif -%}
|
|
{%- if product.price_varies == false and product.compare_at_price_varies %} price--compare-price-hidden {% endif -%}
|
|
{%- if variant.unit_price_measurement %} price--unit-available {% endif -%}"
|
|
>
|
|
|
|
{%- comment -%}
|
|
Explanation of description list:
|
|
- div.price__regular: Displayed when there are no variants on sale
|
|
- div.price__sale: Displayed when a variant is a sale
|
|
- div.price__unit: Displayed when the first variant has a unit price
|
|
- div.price__availability: Displayed when the product is sold out
|
|
{%- endcomment -%}
|
|
<dl class="price__regular">
|
|
<dt>
|
|
<span class="visually-hidden visually-hidden--inline">{{ 'products.general.regular_price' | t }}</span>
|
|
</dt>
|
|
<dd>
|
|
<span class="price-item price-item--regular">
|
|
{%- if product.price_varies -%}
|
|
{{ 'products.product.from_lowest_price_html' | t: lowest_price: money_price }}
|
|
{%- else -%}
|
|
{{ money_price }}
|
|
{%- endif -%}
|
|
</span>
|
|
</dd>
|
|
</dl>
|
|
<dl class="price__sale">
|
|
<dt>
|
|
<span class="visually-hidden visually-hidden--inline">{{ 'products.general.sale_price' | t }}</span>
|
|
</dt>
|
|
<dd>
|
|
<span class="price-item price-item--sale">
|
|
{%- if product.price_varies -%}
|
|
{{ 'products.product.from_lowest_price_html' | t: lowest_price: money_price }}
|
|
{%- else -%}
|
|
{{ money_price }}
|
|
{%- endif -%}
|
|
</span>
|
|
</dd>
|
|
<dt>
|
|
<span class="visually-hidden visually-hidden--inline">{{ 'products.general.regular_price' | t }}</span>
|
|
</dt>
|
|
<dd>
|
|
<s class="price-item price-item--regular">
|
|
{{ compare_at_price | money }}
|
|
</s>
|
|
</dd>
|
|
</dl>
|
|
<div class="price__badges">
|
|
<span class="price__badge price__badge--sold-out">
|
|
<span>{{ 'products.product.sold_out' | t }}</span>
|
|
</span>
|
|
</div>
|
|
<dl class="price__unit">
|
|
<dt>
|
|
<span class="visually-hidden visually-hidden--inline">{{ 'products.product.unit_price_label' | t }}</span>
|
|
</dt>
|
|
<dd class="price-unit-price">
|
|
{%- capture unit_price_separator -%}
|
|
<span aria-hidden="true">/</span><span class="visually-hidden">{{ 'general.accessibility.unit_price_separator' | t }} </span>
|
|
{%- endcapture -%}
|
|
{%- capture unit_price_base_unit -%}
|
|
<span>
|
|
{%- if variant.unit_price_measurement -%}
|
|
{%- if variant.unit_price_measurement.reference_value != 1 -%}
|
|
{{- variant.unit_price_measurement.reference_value -}}
|
|
{%- endif -%}
|
|
{{ variant.unit_price_measurement.reference_unit }}
|
|
{%- endif -%}
|
|
</span>
|
|
{%- endcapture -%}
|
|
|
|
<span>{{ variant.unit_price | money }}</span>{{- unit_price_separator -}}{{- unit_price_base_unit -}}
|
|
</dd>
|
|
</dl>
|
|
</div>
|