From efd443032486f756ac298ae3b5506581bbc4e8a9 Mon Sep 17 00:00:00 2001 From: soulchild Date: Fri, 6 Nov 2026 09:08:20 +0000 Subject: [PATCH] Add snippets/product-item.liquid --- snippets/product-item.liquid | 392 +++++++++++++++++++++++++++++++++++ 1 file changed, 392 insertions(+) create mode 100644 snippets/product-item.liquid diff --git a/snippets/product-item.liquid b/snippets/product-item.liquid new file mode 100644 index 0000000..23c06b6 --- /dev/null +++ b/snippets/product-item.liquid @@ -0,0 +1,392 @@ +{%- assign color_label_list = 'general.label.color' | t | replace: ', ', ',' | downcase | split: ',' -%} +{%- assign color_white_label = 'general.label.white' | t | downcase -%} +{%- assign quick_buy_icon_name = 'quick-buy-' | append: settings.cart_icon | replace: '_', '-' -%} + +{%- if product.url contains '?' -%} + {%- assign product_url_contains_query = true -%} +{%- else -%} + {%- assign product_url_contains_query = false -%} +{%- endif -%} + + + {%- capture product_labels -%} + {%- for tag in product.tags -%} + {%- if tag contains '__label' -%} + {{ tag | split: ':' | last }} + {%- endif -%} + {%- endfor -%} + + {%- unless product.available -%} + {{ 'collection.product.sold_out' | t }} + {%- endunless -%} + + {%- assign cheapest_variant = product.variants | sort: 'price' | first -%} + + {%- if settings.show_discount and product.available and product.price < product.compare_at_price and cheapest_variant.compare_at_price != blank -%} + {%- if settings.discount_mode == 'percentage' -%} + {%- assign savings = product.compare_at_price | minus: product.price | times: 100.0 | divided_by: product.compare_at_price | round | append: '%' -%} + {%- else -%} + {%- capture savings -%}{{ product.compare_at_price | minus: product.price | money }}{%- endcapture -%} + {%- endif -%} + + {{ 'collection.product.discount_html' | t: savings: savings }} + {%- endif -%} + {%- endcapture -%} + +
+ + + {%- if product_labels != blank and reduced_content != true -%} +
+ {{- product_labels -}} +
+ {%- endif -%} + + + {% assign title = product.title | split: '- Style #' -%} + {%- for i in (1..title.size) -%} + {% if title.size > 1 and forloop.last %} + 1 and forloop.last %} class="style-number"{% endif %}> + {%- if title.size > 1 and forloop.last -%} + No. + {%- endif -%} + {{ title[forloop.index0] | remove:' - Ready to Ship' }} + {% comment %} + {%- if forloop.first -%} + + {%- render 'saw_compute_discount' with product -%} + {%- if saw_has_discount == false or saw_product_price >= saw_product_compare_at_price -%} + + {{ product.price | money | remove: '.00' }} + {%- if on_sale -%} + {{ product.compare_at_price | money | remove: '.00' }} + {%- endif -%} + {%- else -%} + {{ saw_product_price | money }} + {{ saw_product_compare_at_price | money | remove: '.00'}} + {%- endif -%} + + {%- endif -%} + {% endcomment %} + + {% endif %} + {%- endfor -%} + + {%- if product.featured_media -%} + {{ product.featured_media | image_url: width: product.featured_media.width | image_tag: loading: 'lazy', sizes: sizes_attribute, widths: '200,300,400,500,600,700,800,900,1000,1100,1200', class: 'product-item__primary-image', data-media-id: product.featured_media.id }} + {%- endif -%} + + {%- if settings.product_color_display == 'swatch' -%} + {%- for color_label in color_label_list -%} + {%- if product.options_by_name[color_label] != blank -%} + {%- for color_option in product.options_by_name[color_label].values -%} + {%- for variant in product.variants -%} + {%- if variant.options contains color_option and variant.featured_media != blank -%} + {%- unless variant.featured_media == product.featured_media -%} + {{ variant.featured_media | image_url: width: variant.featured_media.width | image_tag: loading: 'lazy', sizes: sizes_attribute, widths: '200,300,400,500,600,700,800,900,1000,1100,1200', class: 'product-item__primary-image', data-media-id: variant.featured_media.id, hidden: true }} + {% break %} + {%- endunless -%} + {%- endif -%} + {%- endfor -%} + {%- endfor -%} + {%- endif -%} + {%- endfor -%} + {%- endif -%} + + {%- if settings.show_secondary_image and product.media.size > 1 and hide_secondary_image != true -%} + {%- assign next_media = product.media[product.featured_media.position] | default: product.media[1] -%} + {{- next_media | image_url: width: next_media.width | image_tag: loading: 'lazy', sizes: sizes_attribute, widths: '200,300,400,500,600,700,800,900,1000,1100,1200', class: 'product-item__secondary-image' -}} + {%- endif -%} + + + {%- if request.page_type != 'password' and settings.product_add_to_cart and product.available and reduced_content != true and show_cta != true -%} + {%- if product.variants.size == 1 -%} + {%- capture form_id -%}product_form_{{ section.id }}_{{ block.id }}_{{ product.id }}_{% increment product_form_index %}{%- endcapture -%} + {%- form 'product', product, is: 'product-form', id: form_id, class: 'product-item__quick-form' -%} + + + + + {%- endform -%} + {%- else -%} + {%- comment -%} + IMPLEMENTATION NOTE: Depending on the device we show a different icon or open a different mode (either popover or drawer) + {%- endcomment -%} + +
+ + + + +
+ + + + {%- endif -%} + {%- endif -%} +
+ +
+
+ {%- if settings.show_vendor -%} + {%- assign vendor_handle = product.vendor | handle -%} + {%- assign collection_for_vendor = collections[vendor_handle] -%} + + {%- unless collection_for_vendor.empty? -%} + {{ product.vendor }} + {%- else -%} + {{ product.vendor }} + {%- endunless -%} + {%- endif -%} + + {{ product.title }} + + + +{%- assign product_in_collects = '[' -%} +{%- for collection in product.collections -%} +{%- assign product_in_collects = product_in_collects | append: '{"collection_id":"' | append: collection.id | append: '","product_id":"' | append: product.id | append: '"' | append: ',"product_handle":"' | append: product.handle | append: '"}' -%} +{% if forloop.last == false %} +{%- assign product_in_collects = product_in_collects | append: ',' -%} +{% endif %} +{%- endfor -%} +{%- assign product_in_collects = product_in_collects | append: ']' -%} + + + {% liquid + # start Yagi app code + assign target = product.variants | sort: 'price' | first + assign cheapest_variant_price = target.price + assign cheapest_variant_compare_at_price = target.compare_at_price + + assign product_price = product.price + assign product_compare_at_price = product.compare_at_price + + assign active_discount = true + + assign empty_array = "" | split: "" + assign dormant_discounts = shop.metafields.app--168074346497.dormant_discounts.value | default: empty_array + assign target_discount_id = product.metafields.app--168074346497.applied_discount_id.value + for dormant_discount in dormant_discounts + if dormant_discount == target_discount_id + assign active_discount = false + endif + endfor + + if active_discount + assign cheapest_variant_price = target.metafields.app--168074346497.auto_discounted_price.value | default: target.price + + if target.metafields.app--168074346497.discount_type.value != nil and target.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 target.metafields.app--168074346497.discount_percentage.value > 0.01 + assign deducted_percentage = 1.0 | minus: target.metafields.app--168074346497.discount_percentage.value + endif + + assign cheapest_variant_price = target.price | divided_by: 100.0 | times: deducted_percentage | times: 100.0 | ceil + + assign cheapest_variant_compare_at_price = target.price + + if target.compare_at_price > cheapest_variant_compare_at_price + assign cheapest_variant_compare_at_price = target.compare_at_price + endif + endif + + if cheapest_variant_price < target.price and cheapest_variant_compare_at_price == blank + assign cheapest_variant_compare_at_price = target.price + endif + + assign product_price = product.metafields.app--168074346497.min_auto_discounted_price.value | default: product.price + if product.metafields.app--168074346497.discount_percentage.value > 0.01 + assign deducted_percentage = 1.0 | minus: product.metafields.app--168074346497.discount_percentage.value + assign product_price = product.price | divided_by: 100.0 | times: deducted_percentage | times: 100.0 | ceil + endif + + assign product_compare_at_price = product.price + + if product.compare_at_price > product_compare_at_price + assign product_compare_at_price = product.compare_at_price + endif + endif + # end Yagi app code + %} + +
+
+ {%- if product.price_varies and product_compare_at_price -%} + {%- assign cheapest_variant = product.variants | sort: 'price' | first -%} + + {%- capture price_min -%} + {%- if settings.currency_code_enabled -%} + {{- cheapest_variant_price | money_with_currency -}} + {%- else -%} + {{- cheapest_variant_price | money -}} + {%- endif -%} + {%- endcapture -%} + + {%- if cheapest_variant_price < cheapest_variant_compare_at_price -%} + + + {{- 'collection.product.from_price_html' | t: price_min: price_min -}} + + + + + + {%- if settings.currency_code_enabled -%} + {{- cheapest_variant_compare_at_price | money_with_currency -}} + {%- else -%} + {{- cheapest_variant_compare_at_price | money -}} + {%- endif -%} + + {%- else -%} + + + {{- 'collection.product.from_price_html' | t: price_min: price_min -}} + + {%- endif -%} + {%- elsif product_price < product_compare_at_price -%} + + + + {%- if settings.currency_code_enabled -%} + {{- product_price | money_with_currency -}} + {%- else -%} + {{- product_price | money -}} + {%- endif -%} + + + + + {%- if settings.currency_code_enabled -%} + {{- product_compare_at_price | money_with_currency -}} + {%- else -%} + {{- product_compare_at_price | money -}} + {%- endif -%} + + {%- elsif product.price_varies -%} + {%- capture price_min -%} + {%- if settings.currency_code_enabled -%} + {{ product_price | money_with_currency }} + {%- else -%} + {{ product_price | money }} + {%- endif -%} + {%- endcapture -%} + + {%- capture price_max -%} + {%- if settings.currency_code_enabled -%} + {{- product.price_max | money_with_currency -}} + {%- else -%} + {{- product.price_max | money -}} + {%- endif -%} + {%- endcapture -%} + + + + {{- 'collection.product.from_price_html' | t: price_min: price_min, price_max: price_max -}} + + {%- else -%} + + + + {%- if settings.currency_code_enabled -%} + {{- product_price | money_with_currency -}} + {%- else -%} + {{- product_price | money -}} + {%- endif -%} + + {%- endif -%} + + {%- if product.selected_or_first_available_variant.unit_price_measurement -%} +
+
+ {{ product.selected_or_first_available_variant.unit_price | money }} + / + + {%- if product.selected_or_first_available_variant.unit_price_measurement.reference_value != 1 -%} + {{ product.selected_or_first_available_variant.unit_price_measurement.reference_value }} + {%- endif -%} + + {{ product.selected_or_first_available_variant.unit_price_measurement.reference_unit }} +
+
+ {%- endif -%} +
+
+ + {%- if settings.show_product_rating and reduced_content != true -%} + + {%- render 'product-rating', product: product -%} + + {%- endif -%} + + {%- if settings.product_color_display != 'hide' and reduced_content != true -%} + {%- for color_label in color_label_list -%} + {%- if product.options_by_name[color_label] != blank -%} + {%- assign product_option = product.options_by_name[color_label] -%} + + {%- case settings.product_color_display -%} + {%- when 'count' -%} +

{{- 'collection.product.available_colors_count' | t: count: product_option.values.size -}}

+ + {%- when 'swatch' -%} +
+ {%- assign variant_option = 'option' | append: product_option.position -%} + {%- assign color_swatch_config = settings.color_swatch_config | newline_to_br | split: '
' -%} + + {%- capture color_name -%}{{ section.id }}-{{ block.id }}-{{ product.id }}{%- endcapture -%} + + {%- for value in product_option.values -%} + {%- capture color_id -%}{{ color_name }}-{{ forloop.index }}{%- endcapture -%} + {%- assign color_value_downcase = value | downcase -%} + {%- assign variant_for_value = product.variants | where: variant_option, value | first -%} + +
+ + +
+ {%- endfor -%} +
+ {%- endcase -%} + + {%- break -%} + {%- endif -%} + {%- endfor -%} + {%- endif -%} +
+ + {%- if product.available and reduced_content or show_cta -%} +
+ {%- if product.variants.size == 1 -%} + {%- capture form_id -%}product_form_{{ section.id }}_{{ block.id }}_{{ product.id }}_{% increment product_form_index %}{%- endcapture -%} + {%- form 'product', product, is: 'product-form', id: form_id -%} + + + + {%- endform -%} + {%- else -%} + + + + + + {%- endif -%} +
+ {%- elsif reduced_content -%} +
+ {{ 'collection.product.sold_out' | t }} +
+ {%- endif -%} +
+ \ No newline at end of file