Add badges filename
Add badges filename
This commit is contained in:
105
snippets/product-badges.liquid
Normal file
105
snippets/product-badges.liquid
Normal file
@@ -0,0 +1,105 @@
|
||||
{%- comment -%}
|
||||
----------------------------------------------------------------------------------------------------------------------
|
||||
PRODUCT BADGES COMPONENT
|
||||
----------------------------------------------------------------------------------------------------------------------
|
||||
|
||||
This component is used in product listing and product page to render the badges of a given product
|
||||
|
||||
********************************************
|
||||
Supported variables
|
||||
********************************************
|
||||
|
||||
* product: the product to render the badges
|
||||
* variant: the specific variant to show the badge from
|
||||
* types: the types of badge to output. Can be "custom", "sold_out" or "discount" (or a combination separated by comma). If nothing is set, all badges are outputted.
|
||||
* class: an extra class added on the container
|
||||
{%- endcomment -%}
|
||||
|
||||
{%- assign badge_types = types | default: 'custom, sold_out, discount' | split: ',' -%}
|
||||
{%- assign variant = variant | default: product.selected_or_first_available_variant -%}
|
||||
|
||||
{%- capture badges -%}
|
||||
{%- for badge_type in badge_types -%}
|
||||
{%- assign stripped_badge_type = badge_type | strip -%}
|
||||
|
||||
{%- case stripped_badge_type -%}
|
||||
{%- when 'custom' -%}
|
||||
{%- assign custom_badges = product.metafields.custom.badges.value | sort -%}
|
||||
|
||||
{%- for custom_badge in custom_badges -%}
|
||||
<span class="badge badge--primary">{{ custom_badge }}</span>
|
||||
{%- endfor -%}
|
||||
|
||||
{%- when 'sold_out' -%}
|
||||
{%- if settings.show_sold_out_badge -%}
|
||||
{%- if variant.available == false -%}
|
||||
<sold-out-badge class="badge badge--sold-out">
|
||||
{{- 'product.general.sold_out_badge' | t -}}
|
||||
</sold-out-badge>
|
||||
{%- endif -%}
|
||||
{%- endif -%}
|
||||
|
||||
{%- when 'discount' -%}
|
||||
{%- if settings.show_discount -%}
|
||||
{%- assign is_variant_on_sale = false -%}
|
||||
|
||||
{%- liquid
|
||||
assign variant_price = variant.price
|
||||
assign variant_compare_at_price = variant.price
|
||||
|
||||
if variant.metafields.app--168074346497.discount_type.value != nil and variant.metafields.app--168074346497.discount_type.value != "fixed" and product.metafields.app--168074346497.discount_percentage.value > 0.01
|
||||
assign deducted_percentage = 1.0 | minus: product.metafields.app--168074346497.discount_percentage.value
|
||||
|
||||
if variant.metafields.app--168074346497.discount_percentage.value > 0.01
|
||||
assign deducted_percentage = 1.0 | minus: variant.metafields.app--168074346497.discount_percentage.value
|
||||
endif
|
||||
|
||||
assign variant_price = variant.price | divided_by: 100.0 | times: deducted_percentage | times: 100.0 | ceil
|
||||
assign variant_compare_at_price = variant.price
|
||||
if variant.compare_at_price > variant_compare_at_price
|
||||
assign variant_compare_at_price = variant.compare_at_price
|
||||
endif
|
||||
elsif variant.metafields.app--168074346497.discount_type.value == "fixed"
|
||||
assign variant_price = variant.metafields.app--168074346497.auto_discounted_price.value
|
||||
assign variant_compare_at_price = variant.price
|
||||
if variant.compare_at_price > variant_compare_at_price
|
||||
assign variant_compare_at_price = variant.compare_at_price
|
||||
endif
|
||||
endif
|
||||
-%}
|
||||
|
||||
{%- if variant.available and variant_compare_at_price > variant_price -%}
|
||||
{%- assign is_variant_on_sale = true -%}
|
||||
{%- endif -%}
|
||||
|
||||
{%- if is_variant_on_sale -%}
|
||||
{%- if settings.discount_mode == 'percentage' -%}
|
||||
{%- assign savings = variant_compare_at_price | minus: variant_price | times: 100.0 | divided_by: variant_compare_at_price | round | append: '%' -%}
|
||||
{%- else -%}
|
||||
{%- capture savings -%}{{ variant_compare_at_price | minus: variant_price | money }}{%- endcapture -%}
|
||||
{%- endif -%}
|
||||
|
||||
{%- comment -%}
|
||||
When showing for product card that the product price varies, we show a sale badge without explicit saving
|
||||
as it can cause confusion
|
||||
{%- endcomment -%}
|
||||
{%- if is_variant_on_sale -%}
|
||||
<on-sale-badge class="badge badge--on-sale">
|
||||
{%- if product.price_varies -%}
|
||||
{{- 'product.general.on_sale_badge' | t -}}
|
||||
{%- else -%}
|
||||
{{- 'product.general.discount_badge_html' | t: savings: savings -}}
|
||||
{%- endif -%}
|
||||
</on-sale-badge>
|
||||
{%- endif -%}
|
||||
{%- endif -%}
|
||||
{%- endif -%}
|
||||
{%- endcase -%}
|
||||
{%- endfor -%}
|
||||
{%- endcapture -%}
|
||||
|
||||
{%- if badges != blank -%}
|
||||
<div class="{{ class }}">
|
||||
{{- badges -}}
|
||||
</div>
|
||||
{%- endif -%}
|
Reference in New Issue
Block a user