From 6fb1381567dafa338a073d811a504d1a74afdb0e Mon Sep 17 00:00:00 2001 From: Axel Kee Date: Wed, 15 Apr 2026 23:00:53 +0800 Subject: [PATCH] first commit --- snippets/product-tile.liquid | 449 +++++++++++++++++++++++++++++++++++ yagi.txt | 25 ++ 2 files changed, 474 insertions(+) create mode 100644 snippets/product-tile.liquid create mode 100644 yagi.txt diff --git a/snippets/product-tile.liquid b/snippets/product-tile.liquid new file mode 100644 index 0000000..7cead6e --- /dev/null +++ b/snippets/product-tile.liquid @@ -0,0 +1,449 @@ +{%- liquid + assign crop = crop | default: settings.product_tiles_aspect_ratio + assign shape = shape | default: settings.product_tile_media_shape + assign hover_image = blank + if settings.product_tiles_second_image_on_hover and product.media.size > 1 + assign hover_image = product.media[1] + endif + if enable_quick_buy + assign product_form_id = 'product-form-' | append: section.id | append: '-' | append: product.id + assign current_variant = product.selected_or_first_available_variant + assign featured_media = current_variant.featured_media | default: product.featured_media + endif + if use_variant + assign target = product.selected_or_first_available_variant + else + assign target = product + endif + + assign compare_at_price = target.compare_at_price + assign price = target.price | default: 1999 + + + assign current_variant_price = current_variant.price + assign current_variant_compare_at_price = current_variant_compare_at_price + + assign product_price = product.price + assign product_compare_at_price_max = product.compare_at_price_max + + comment + start Yagi app code + endcomment + assign product_price = product.metafields.app--168074346497.min_auto_discounted_price.value | default: product.price + if product_price < product.price and product_compare_at_price_max == 0 or product_compare_at_price_max == blank + assign product_compare_at_price_max = product.price_max + endif + + + assign current_variant_price = current_variant.metafields.app--168074346497.auto_discounted_price.value | default: current_variant.price + + if current_variant_price < current_variant.price and current_variant_compare_at_price == empty + assign current_variant_compare_at_price = current_variant.price + endif + + if use_variant + assign 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 price = target.price | divided_by: 100.0 | times: deducted_percentage | times: 100.0 | ceil + + assign compare_at_price = target.price + + if target.compare_at_price > compare_at_price + assign compare_at_price = target.compare_at_price + endif + endif + + if price < target.price and compare_at_price == blank + assign compare_at_price = target.price + endif + else + assign 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 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 + + if price < product.price and compare_at_price == blank + assign compare_at_price = product.price + endif + endif + + comment + end Yagi app code + endcomment + + if compare_at_price > price + assign on_sale = true + else + assign on_sale = false + endif + assign available = target.available | default: false + assign money_price = price | money + if settings.currency_code_enabled + assign money_price = price | money_with_currency + endif + + if target == product and product.price_varies + assign money_price = money_price | append: '+' + endif + + if odd_even == 'odd' + assign rotate = 5 + else + assign rotate = -5 + endif + + unless loading + assign loading = 'lazy' + endunless + + unless preload + assign preload = false + endunless + + unless sizes + assign sizes = '100vw' + endunless +-%} +{%- if product and product != empty -%} +
+ {% if enable_quick_buy %} + {% assign yagi_discount_percentage = '"discount_percentage": 0,"id"' %} + {% if product.metafields.app--168074346497.discount_percentage.value > 0.01 %} + {% capture yagi_discount_percentage %}"discount_percentage": {{ product.metafields.app--168074346497.discount_percentage.value }},"id"{% endcapture %} + {% endif %} + + + + + {% endif %} +
+ {%- if product.featured_media -%} + +
+ {%- render 'product-tile-media-image', + media: product.featured_media, + shape_id: shape_id, + shape: shape, + is_card: display_on_card, + crop: crop, + hover_image: hover_image, + container_id: section.id, + quick_buy: enable_quick_buy, + product: product, + index: index, + preload: preload, + loading: loading, + sizes: sizes, + will_transform: will_transform + -%} +
+
+ {%- endif -%} + + {%- if enable_quick_buy -%} +
+ {%- render 'product-tile-quick-buy', + section: section, + product: product, + product_form_id: product_form_id, + current_variant: current_variant, + current_variant_only: product.has_only_default_variant, + is_card: display_on_card + -%} +
+ {%- endif -%} + + {% comment %} + start Yagi app code + {% endcomment %} + {% if true or settings.show_save_percentage_badge %} + {%- if compare_at_price > price or product.metafields.app--168074346497.min_auto_discounted_price.value > 1 -%} + {% assign sale_text = "Save [percentage]%" %} + + {% if product.metafields.app--168074346497.discount_percentage.value > 0.005 %} + {% assign percentage = product.metafields.app--168074346497.discount_percentage.value | times: 100 | floor %} + + + {% assign text = sale_text | replace: "[percentage]", percentage | replace: ".0", "" %} + {% elsif compare_at_price > price %} + {% assign tmp_percentage = price | times: 1.0 | divided_by: compare_at_price | times: 100 | floor %} + {% assign percentage = 100.0 | minus: tmp_percentage | floor %} + {% assign text = sale_text | replace: "[percentage]", percentage | replace: ".0", "" %} + {% endif %} + + {%- liquid + + assign id = 'yagi-sticker-' | append: product.id + assign shape = settings.on_sale_badge_shape + assign vertical_position = 15 + assign horizontal_position = 90 + if rotate > 0 + assign rotate = -5 + else + assign rotate = 5 + endif + if display_on_card + assign vertical_position = 5 + endif + if scatter_position + assign vertical_position = vertical_position | plus: 15 + endif + -%} + {% if text != 'Save [percentage]%' %} + {%- render 'static-sticker', + static_id: 'automatic-discounted', + shape: shape, + id: id, + text: text, + vertical_position: vertical_position, + horizontal_position: horizontal_position, + rotate: rotate, + width: 100, + font_size: settings.badge_font_size, + color: 'bg-scheme-accent-2 text-scheme-accent-2-contrast', + will_transform: will_transform + %} + {% endif %} + {%- endif -%} + {% endif %} + {% comment %} + end Yagi app code + {% endcomment %} + {%- if settings.show_on_sale_badge and on_sale -%} + {%- liquid + assign text = 'products.product.on_sale' | t + assign id = 'on-sale-sticker-' | append: product.id + assign shape = settings.on_sale_badge_shape + assign vertical_position = 15 + assign horizontal_position = 90 + if rotate > 0 + assign rotate = -5 + else + assign rotate = 5 + endif + if display_on_card + assign vertical_position = 5 + endif + if scatter_position + assign vertical_position = vertical_position | plus: 15 + endif + -%} + {%- render 'static-sticker', + static_id: 'on-sale', + shape: shape, + id: id, + text: text, + vertical_position: vertical_position, + horizontal_position: horizontal_position, + rotate: rotate, + width: 100, + font_size: settings.badge_font_size, + color: 'bg-scheme-accent-1 text-scheme-accent-1-contrast', + will_transform: will_transform + %} + {%- endif -%} + {%- if settings.show_sold_out_badge and available == false -%} + {%- liquid + assign text = 'products.product.sold_out' | t + assign id = 'sold-out-sticker-' | append: product.id + assign vertical_position = 15 + assign horizontal_position = 10 + if rotate > 0 + assign rotate = -5 + else + assign rotate = 5 + endif + if display_on_card + assign vertical_position = 5 + endif + if scatter_position + assign vertical_position = vertical_position | plus: 15 + endif + -%} + {%- render 'static-sticker', + static_id: 'sold-out', + id: id, + text: text, + vertical_position: vertical_position, + horizontal_position: horizontal_position, + rotate: rotate, + width: 100, + font_size: settings.badge_font_size, + color: 'bg-scheme-text text-scheme-text-contrast', + will_transform: will_transform + %} + {%- endif -%} + {%- liquid + assign metafield_namespace = settings.product_tile_metafield_badge | split: '.' | first + assign metafield_key = settings.product_tile_metafield_badge | split: '.' | last + assign metafield_badge = product.metafields[metafield_namespace][metafield_key] + -%} + {% if metafield_badge != blank %} + {%- liquid + assign text = metafield_badge.value + assign id = 'metafield-sticker-' | append: product.id + assign shape = settings.metafield_badge_shape + assign vertical_position = 15 + if display_on_card + assign vertical_position = 5 + endif + if on_sale and available + assign horizontal_position = 10 + else + assign horizontal_position = 90 + endif + if on_sale and sold_out + if display_on_card + assign vertical_position = 30 + else + assign vertical_position = 40 + endif + endif + if rotate > 0 + assign rotate = -5 + else + assign rotate = 5 + endif + if scatter_position + assign vertical_position = vertical_position | plus: 15 + endif + -%} + {%- render 'static-sticker', + static_id: 'metafield-badge', + id: id, + text: text, + vertical_position: vertical_position, + horizontal_position: horizontal_position, + rotate: rotate, + width: 100, + font_size: settings.badge_font_size, + color: 'bg-scheme-accent-1 text-scheme-accent-1-contrast', + will_transform: will_transform + %} + {% endif %} +
+ {% if enable_quick_buy %} +
+ {% endif %} +
+{%- else -%} +
+
+
+ {%- render 'media-image-placeholder', + shape_id: shape_id, + container_id: section.id, + index: index, + shape: shape, + crop: crop, + is_card: section.settings.display_on_card + -%} +
+
+

+ {{ 'sections.onboarding.product_title' | t }} +

+ {% render 'price', price_class: 'mt-2' %} +
+
+
+{%- endif -%} diff --git a/yagi.txt b/yagi.txt new file mode 100644 index 0000000..6f9b928 --- /dev/null +++ b/yagi.txt @@ -0,0 +1,25 @@ +custom original price selector +, .product-content [data-product-price] + +custom injected CSS + +.yagi-price-container{display: flex !important; gap: 0.5em; align-items: center !important;} .yagi-price-container .price__sale { display: flex; flex-direction: row !important; justify-content: flex-end; gap: 0.5em; align-items: center;} .yagi-discounted-price { font-size: var(--font-size-lg); font-weight: var(--main-font-weight); } .yagi-original-price { font-size: var(--font-size-lg); font-weight: var(--main-font-weight); } .yagi-sale-badge { font-family: var(--main-font-stack); font-weight: var(--main-font-weight); font-style: var(--main-font-style); letter-spacing: 0; text-decoration: none; color: rgba(var(--color-scheme-accent-2-contrast),var(--tw-text-opacity)); font-size: var(--font-size-sm); line-height: var(--base-line-height); text-align: center; padding-bottom: .25rem; padding-top: .125rem; padding-left: .5rem; padding-right: .5rem; background-color: rgba(var(--color-scheme-accent-2),var(--tw-bg-opacity)); border-color: #000; border-style: solid; border-width: var(--input-border-width); border-radius: var(--button-border-radius); display: inline-block; position: relative; } + + +custom injected JS + +document.addEventListener("yagi:replacedBlock", (event) => { + setTimeout(function() { + const yagiBlock = document.querySelector("[data-block-handle='auto_discounted_price_product'],[id*='yagi_automatic_discount_helper_auto_discounted_price_product']"); + const cartDiscountedPrice = document.querySelectorAll('.add-to-cart-btn span')[3]; + const cartOriginalPrice = document.querySelector('.add-to-cart-btn span s'); + + if(cartDiscountedPrice) { + cartDiscountedPrice.textContent = yagiBlock.querySelector('.yagi-discounted-price').textContent; + } + + if(cartOriginalPrice) { + cartOriginalPrice.textContent = yagiBlock.querySelector('.yagi-original-price').textContent; + } + }, 100); +});