From 5ba12da054747b711b39d02baa16fc3d6849c4b7 Mon Sep 17 00:00:00 2001 From: Axel Date: Tue, 24 Feb 2026 01:49:15 +0800 Subject: [PATCH] first commit --- sections/product.liquid | 2561 ++++++++++++++++++++++++++++ snippets/product-grid-price.liquid | 74 + snippets/product-price.liquid | 181 ++ 3 files changed, 2816 insertions(+) create mode 100644 sections/product.liquid create mode 100644 snippets/product-grid-price.liquid create mode 100644 snippets/product-price.liquid diff --git a/sections/product.liquid b/sections/product.liquid new file mode 100644 index 0000000..4158de9 --- /dev/null +++ b/sections/product.liquid @@ -0,0 +1,2561 @@ + + +{%- liquid + assign current_variant = product.selected_or_first_available_variant + assign product_sticky_enable = section.settings.product_sticky_enable + assign enable_video_looping = section.settings.enable_video_looping + assign image_size = section.settings.image_size + assign image_layout = section.settings.image_layout + assign mobile_image_style = section.settings.mobile_image_style + assign featured_media = current_variant.featured_media | default: product.featured_media + assign featured_media_aspect_ratio = featured_media.aspect_ratio | default: 1 + assign is_title_linked = true + if template.name == 'product' + assign is_title_linked = false + endif + + assign show_thumbnails = false + assign enable_thumbs = false + assign enable_thumbs_mobile = false + + if image_layout == 'thumbnails' or image_layout == 'thumbnails-left' + assign enable_thumbs = true + assign show_thumbnails = true + endif + + if mobile_image_style == 'thumbs' + assign show_thumbnails = true + assign enable_thumbs_mobile = true + endif + + assign modifier = image_layout | default: 'thumbnails' + assign product_wrapper_modifier = 'product__wrapper--' | append: modifier + + assign wrapper_tag = 'div' + if product_sticky_enable + assign wrapper_tag = 'product-sticky' + endif + + assign show_buy_buttons = false + assign buy_buttons = section.blocks | where: 'type', 'buttons' + + if buy_buttons.size > 0 + assign show_buy_buttons = true + endif + + assign image_width = 770 + + if image_size == 'small' + assign product_wrapper_modifier = product_wrapper_modifier | append: ' product__wrapper--small' + assign image_width = 525 + endif + + if image_size == 'stretch' + assign product_wrapper_modifier = product_wrapper_modifier | append: ' product__wrapper--stretch' + assign image_width = 970 + endif + + assign product_form_id = 'ProductForm--' | append: section.id | append: '-' | append: product.id + assign show_cart_bar = false + assign unique = section.id + + assign sibling_color = product.metafields.theme.sibling_color.value | default: product.metafields.theme.sibling_colour.value | default: product.metafields.theme.siblings_color.value | default: product.metafields.theme.siblings_colour.value | default: product.metafields.theme.siblings_colors.value | default: product.metafields.theme.siblings_colours.value + + if section.settings.show_cart_bar + assign show_cart_bar = true + endif + + capture product_images_classlist + echo 'product__images' + + if enable_thumbs + echo ' product__images--thumbs' + else + echo ' product__images--no-thumbs' + endif + + if enable_thumbs_mobile + echo ' product__images--mobile-thumbs' + else + echo ' product__images--mobile-slider' + endif + endcapture + + assign preorder = false + if product.metafields.theme.preorder.type == 'boolean' and product.metafields.theme.preorder.value == true + assign preorder = true + endif + + assign sold_out = false + unless product.available + assign sold_out = true + endunless + + assign product_tags = product.tags | join: ',' + if product_tags contains '_preorder' + assign preorder = true + endif + + assign product_price = product.metafields.app--168074346497.min_auto_discounted_price.value | default: product.price + assign product_compare_at_price = product.compare_at_price + assign product_compare_at_price_max = product.compare_at_price_max + + 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 + + assign product_compare_at_price = product.price + assign product_compare_at_price_max = product.price_max + + if product.compare_at_price > product_compare_at_price + assign product_compare_at_price = product.compare_at_price + endif + + if product.compare_at_price_max > product_compare_at_price_max + assign product_compare_at_price_max = product.compare_at_price_max + endif + endif + + assign on_sale = false + if product_compare_at_price > product_price + assign on_sale = true + endif + + assign badge = '' + if badge == '' and product_tags contains '_badge_' + assign badge = product_tags | split: '_badge_' + assign badge = badge[1] | split: ',' | first | replace: '_', ' ' + endif + + assign color_scheme = 'color-' | append: section.settings.color_scheme +-%} + +{%- style -%} + {%- if show_cart_bar -%} + :root { --cart-bar-height: 80px; } + {%- endif -%} + + #Product--{{ section.id }} { + --PT: {{ section.settings.padding_top }}px; + --PB: {{ section.settings.padding_bottom }}px; + + --swatch-size: var(--swatch-size-product); + } +{%- endstyle -%} + + +{%- if product_sticky_enable -%} + +{%- endif -%} + + + <{{ wrapper_tag }} class="product__wrapper {{ product_wrapper_modifier }}" data-product> +
+
+ + {%- if product.media.size > 0 -%} + {%- capture product_slides_attributes -%} + class="product__slides product-single__photos" + style="--featured-media-aspect-ratio: {{ featured_media_aspect_ratio | round: 2 }};" + data-product-media-list + {%- endcapture -%} + + {%- if section.settings.enable_zoom -%} + + {%- else -%} +
+ {%- endif -%} + + {%- for media in product.media -%} + {%- render 'media', + media: media, + featured_media: featured_media, + enable_video_looping: enable_video_looping, + sectionkey: unique, + image_width: image_width, + cover: true + -%} + {%- endfor -%} + + {%- if section.settings.enable_zoom -%} + + + + + {%- else -%} +
+ {%- endif -%} + + {%- assign first_3d_model = product.media | where: 'media_type', 'model' | first -%} + {%- if first_3d_model -%} + + {%- endif -%} + + {%- if show_thumbnails -%} + +
+ {%- for media in product.media -%} +
+ + {%- liquid + render 'image', image: media.preview_image, width: 150, height: 150, sizes: '75px', widths: '75, 100, 150, 225, 300', aspect_ratio: 1 + + if media.media_type == 'video' or media.media_type == 'external_video' + render 'icon-media-video' + elsif media.media_type == 'model' + render 'icon-media-model' + endif + -%} + +
+ {%- endfor -%} +
+ + + + {%- endif -%} + + {%- comment -%} Thumbnails template for Photoswipe {%- endcomment -%} + {%- if section.settings.enable_zoom -%} + + {%- endif -%} + {%- else -%} +
+
+
+ {%- endif -%} + + +
+
+
+ {% comment %} The input with name="id" submits to cart {% endcomment %} + + + {% comment %} Add a line item property called 'Preorder' to preorder products {% endcomment %} + {%- if preorder -%} + + {%- endif -%} + + {%- if sibling_color != blank -%} + + {%- endif -%} + + {%- for block in section.blocks -%} + {%- liquid + assign padding_bottom = block.settings.padding_bottom + assign bg_accent = block.settings.bg_color + assign icon_size = block.settings.icon_size + + capture block_style + if padding_bottom + echo '--block-padding-bottom: ' | append: block.settings.padding_bottom | append: 'px;' + endif + + if block.type == 'upsell' or block.type == 'complementary-products' + unless bg_accent == 'rgba(0,0,0,0)' or bg_accent == blank + echo '--bg-accent: ' | append: bg_accent | append: ';' + endunless + endif + + if icon_size + echo '--icon-size:' | append: icon_size | append: 'px;' + endif + + if block.type == 'countdown' + assign bg_color = block.settings.bg_color + assign text_color = block.settings.color + + unless bg_color == 'rgba(0,0,0,0)' or bg_color == blank + echo '--bg: ' | append: bg_color | append: ';' + echo '--countdown-padding: ' | append: 'var(--inner);' + endunless + + unless text_color == 'rgba(0,0,0,0)' or text_color == blank + echo '--text: ' | append: text_color | append: ';' + endunless + endif + endcapture + + if block_style != blank + assign block_style = 'style="' | append: block_style | append: '"' + endif + -%} + + {%- case block.type -%} + {%- when '@app' -%} + {%- render block -%} + + {%- when 'title' -%} + {%- render 'product-title', + product: product, + block: block, + block_style: block_style, + is_title_linked: is_title_linked + -%} + + {%- when 'price' -%} + {%- render 'product-price', + product: product, + unique: unique, + block: block, + block_style: block_style + -%} + + {%- when 'variants' -%} + {%- render 'product-variant-options', + product: product, + unique: unique, + block: block, + block_style: block_style, + product_form_id: product_form_id, + enable_size_chart: true + -%} + + {%- when 'buttons' -%} + {%- render 'product-buttons', + product: product, + current_variant: current_variant, + unique: unique, + block: block, + block_style: block_style, + product_form_id: product_form_id, + preorder: preorder + -%} + + {%- when 'description' -%} + {%- render 'product-description', product: product, block: block, block_style: block_style -%} + + {%- when 'tab_richtext' -%} + {%- render 'product-description', product: product, block: block, block_style: block_style -%} + + {%- when 'accordion' -%} + {%- render 'product-description', product: product, block: block, block_style: block_style -%} + + {%- when 'inventory_countdown' -%} + {%- render 'product-inventory', product: product, block: block, block_style: block_style -%} + + {%- when 'upsell' -%} + {%- liquid + assign upsell_product = product.metafields.theme.upsell.value | default: block.settings.upsell_product + assign upsell_product_list = product.metafields.theme.upsell_list.value | default: block.settings.upsell_product_list + assign slider_enabled = false + assign block_tag = 'div' + + if block.settings.layout == 'slider' + assign slider_enabled = true + assign block_tag = 'slider-component' + assign dots_style = settings.dots_style + assign autoplay_speed = false + assign autoplay = block.settings.autoplay + + if autoplay + assign autoplay_speed = block.settings.autoplay_speed | times: 1000 + endif + endif + -%} + + {%- if upsell_product != blank or upsell_product_list != blank or request.design_mode -%} + {%- assign upsell_title = 'products.general.upsell_title' | t -%} + + {%- capture upsell_products -%} + {%- if upsell_product == blank and upsell_product_list == blank -%} + {%- render 'upsell-product' -%} + {%- else -%} + {%- if upsell_product != blank -%} + {%- render 'upsell-product', upsell_product: upsell_product, show_available_upsell_only: block.settings.show_available_upsell_only, slider_enabled: slider_enabled, is_product_block: true -%} + {%- endif -%} + + {%- if upsell_product_list != blank -%} + {%- for upsell_product in upsell_product_list -%} + {%- render 'upsell-product', upsell_product: upsell_product, show_available_upsell_only: block.settings.show_available_upsell_only, slider_enabled: slider_enabled, is_product_block: true -%} + {%- endfor -%} + {%- endif -%} + {%- endif -%} + {%- endcapture -%} + + {%- if upsell_products != blank -%} +
+

{{ upsell_title }}

+ <{{ block_tag }} + class="product__upsell product__upsell--{{ block.settings.layout }}" + {% if slider_enabled %} + data-slider + data-dots="{{ dots_style }}" + data-options='{"autoPlay": {{ autoplay_speed }}, "prevNextButtons": false }' + {% endif %} + {{ block.shopify_attributes }} + {{ block_style }} + > + {{ upsell_products }} + +
+ {%- endif -%} + {%- endif -%} + + {%- when 'complementary-products' -%} + {%- liquid + assign slider_enabled = false + + if block.settings.layout == 'slider' + assign slider_enabled = true + assign dots_style = settings.dots_style + assign autoplay_speed = false + assign autoplay = block.settings.autoplay + + if autoplay + assign autoplay_speed = block.settings.autoplay_speed | times: 1000 + endif + endif + -%} +
+ {%- assign complementary_products_title = 'products.general.complementary_products_title' | t -%} + {%- if complementary_products_title != blank -%} +

{{ complementary_products_title }}

+ {%- endif -%} + + + {%- if slider_enabled -%} + + {%- endif -%} + + {%- if recommendations.performed and recommendations.products_count > 0 -%} + {%- for product in recommendations.products limit: block.settings.complementary_limit -%} + {%- render 'upsell-product', upsell_product: product, slider_enabled: slider_enabled -%} + {%- endfor -%} + {%- endif -%} + + {%- if slider_enabled -%} + + {%- endif -%} + +
+ + + + {%- when 'pickup' -%} + + + + + {%- when 'code' -%} +
+ {{ block.settings.code }} +
+ + {%- when 'siblings' -%} + {%- render 'product-siblings', + product: product, + product_form_id: product_form_id, + block: block, + block_style: block_style, + quick_add_product: false + -%} + + {%- when 'text' -%} + {%- render 'product-block-text', block: block, block_style: block_style -%} + + {%- when 'icon' -%} + {%- render 'icon', block: block, index: forloop.index0, is_product: true -%} + + {%- when 'sharing' -%} +
+ {%- assign share_url = current_variant.url | prepend: request.origin -%} + {%- render 'share-button', share_url: share_url -%} +
+ + {%- when 'divider' -%} + {%- render 'divider', block: block, modifier: 'product__block product__block--divider' -%} + + {%- when 'line-item' -%} + {%- render 'product-properties', + product: product, + block: block, + block_style: block_style, + unique: unique, + product_form_id: product_form_id + -%} + + {%- when 'features' -%} + {%- liquid + assign block_id = block.id + assign text = block.settings.text + assign title = block.settings.title + assign prev_index = forloop.index0 | minus: 1 + assign next_index = forloop.index0 | plus: 1 + assign prev_block = section.blocks[prev_index] + assign next_block = section.blocks[next_index] + assign image = block.settings.icon_alt + assign bg_color = block.settings.bg_color + assign text_color = block.settings.color + + comment + Always force dots style to be "line" except if "Circle" is chosen from the global settings + endcomment + assign dots_style = 'line' + if settings.dots_style == 'circle' + assign dots_style = 'circle' + endif + + capture style + if bg_color != 'rgba(0,0,0,0)' and bg_color != blank + echo '--bg-accent: ' | append: bg_color | append: ';' + endif + + if text_color != 'rgba(0,0,0,0)' and text_color != blank + echo '--text: ' | append: text_color | append: ';' + endif + endcapture + -%} + + {%- if forloop.index0 == 0 or prev_block.type != 'features' -%} + + {%- endif -%} + +
+
+
+ {%- assign icon_size = block.settings.icon_size -%} +
+ {%- liquid + if image + assign icon_width = icon_size + assign icon_width_retina = icon_width | times: 2 + assign icon_sizes = icon_width | append: 'px' + assign icon_widths = icon_width | append: ', ' | append: icon_width_retina + render 'image', image: image, width: icon_width_retina, sizes: icon_sizes, widths: icon_widths, show_backfill: false + else + render 'animated-icon', filename: block.settings.icon_name + endif + -%} +
+ + {%- if title != blank -%} +
+

{{ title }}

+
+ {%- endif -%} +
+ + {%- if text != blank -%} +
+ {{ text }} +
+ {%- endif -%} +
+
+ + {%- if forloop.index == section.blocks.size or next_block.type != 'features' -%} + + {%- endif -%} + + {%- when 'popup' -%} + {%- render 'product-popup', block: block -%} + + {%- when 'badges' -%} +
+ {%- if badge != '' and block.settings.product_badges -%} + {{ badge }} + {%- endif -%} + + {%- if preorder and sold_out == false and block.settings.product_badges -%} + {{ 'products.product.pre_order' | t }} + {%- endif -%} + + {%- if on_sale and sold_out == false and block.settings.sale_badge -%} + {{ 'products.product.on_sale' | t }} + {%- endif -%} +
+ + {%- when 'countdown' -%} + {%- assign layout = block.settings.text_align -%} + +
+
+ {%- if block.settings.text != blank -%} + {{ block.settings.text }} + {%- endif -%} +
+ +
+ {%- render 'countdown-timer', + digits_font_size: block.settings.digits_font_size, + text_font_size: block.settings.text_font_size, + end_date: block.settings.end_date, + end_time: block.settings.end_time, + period: block.settings.period, + end_message: block.settings.end_message, + hide_on_complete: block.settings.hide_on_complete + -%} +
+
+ + {%- when 'sku' -%} +
+ {{ 'products.product.sku' | t }}: {{ current_variant.sku }} +
+ + {%- when 'fit-guide' -%} + {%- liquid + assign fit_color = block.settings.fit_color + unless fit_color.alpha == 0.0 or fit_color == blank + capture style + echo '--text:' | append: fit_color + endcapture + endunless + -%} + +
+ {%- if block.settings.heading != blank -%} +

{{ block.settings.heading }}

+ {%- endif -%} + +
+ {%- assign selected_segment = block.settings.selected_segment | plus: 0 -%} + {%- for idx in (1..5) -%} + + {{- forloop.index -}} + + {%- endfor -%} +
+ + {%- if block.settings.left_label != blank + or block.settings.middle_label != blank + or block.settings.right_label != blank + -%} +
+ {%- if block.settings.left_label != blank -%} + {{ block.settings.left_label }} + {%- endif -%} + + {%- if block.settings.middle_label != blank -%} + {{ block.settings.middle_label }} + {%- endif -%} + + {%- if block.settings.right_label != blank -%} + {{ block.settings.right_label }} + {%- endif -%} +
+ {%- endif -%} +
+ {%- endcase -%} + {%- endfor -%} +
+
+
+
+
+ + + {% unless product == empty %} + + + + {%- liquid + assign metafields_data = '[' + for variant in product.variants + assign metafield_value = variant.metafields.theme.final_sale.value | replace: '"', "''" + assign metafields_data = metafields_data | append: '{"variant_id":"' | append: variant.id | append: '" , "metafield_value":"' | append: metafield_value | append: '"},' + endfor + assign metafields_data = metafields_data | append: ']' + assign metafields_data = metafields_data | replace: ',]', ']' + -%} + + {{ metafields_data }} + {% endunless %} + + {% comment %} Google wants to know when to check your price again {% endcomment %} + + {%- liquid + assign days_price_is_valid = 1 + assign seconds_in_a_day = 86400 + assign seconds_price_valid = days_price_is_valid | times: seconds_in_a_day + + if product.selected_or_first_available_variant.featured_media + assign seo_media = product.selected_or_first_available_variant.featured_media + else + assign seo_media = product.featured_media + endif + -%} + + {%- if show_cart_bar -%} + {%- render 'cart-bar', product: product -%} + {%- endif -%} + + + + +{% schema %} +{ + "name": "Product pages", + "class": "section-overlay-header", + "settings": [ + { + "type": "header", + "content": "Layout" + }, + { + "type": "checkbox", + "id": "product_sticky_enable", + "label": "Enable sticky form", + "default": true + }, + { + "type": "checkbox", + "id": "variant_image_scroll", + "label": "Enable product image variant scroll", + "info": "Clicking a variant scrolls user to assigned image", + "default": true + }, + { + "type": "checkbox", + "id": "show_cart_bar", + "label": "Enable cart bar", + "default": true + }, + { + "type": "header", + "content": "Media", + "info": "Learn more about [media types](https://help.shopify.com/manual/products/product-media)" + }, + { + "type": "checkbox", + "id": "enable_zoom", + "label": "Enable zoom", + "default": true + }, + { + "type": "checkbox", + "id": "enable_video_looping", + "label": "Enable video looping", + "default": false + }, + { + "type": "header", + "content": "Desktop" + }, + { + "type": "select", + "id": "image_layout", + "label": "Product gallery", + "default": "stacked", + "options": [ + {"value": "thumbnails", "label": "Thumbnails - Bottom"}, + {"value": "thumbnails-left", "label": "Thumbnails - Left"}, + {"value": "stacked", "label": "Stacked"}, + {"value": "grid-1", "label": "Mosaic"}, + {"value": "grid-2", "label": "Grid"} + ], + "info": "Desktop only" + }, + { + "type": "select", + "id": "image_size", + "label": "Image size", + "options": [ + { + "value": "small", + "label": "Small" + }, + { + "value": "normal", + "label": "Normal" + }, + { + "value": "stretch", + "label": "Stretch - No thumbnails" + } + ], + "default": "normal" + }, + { + "type": "header", + "content": "Mobile" + }, + { + "type": "select", + "id": "mobile_image_style", + "label": "Product gallery", + "options": [ + { + "value": "thumbs", + "label": "Thumbnails" + }, + { + "value": "slider", + "label": "Slider" + } + ], + "default": "thumbs" + }, + { + "type": "header", + "content": "Colors" + }, + { + "type": "color_scheme", + "id": "color_scheme", + "default": "scheme_1", + "label": "Color scheme" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_top", + "min": 0, + "max": 100, + "step": 1, + "unit": "px", + "label": "Top", + "default": 90 + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 100, + "step": 1, + "unit": "px", + "label": "Bottom", + "default": 30 + } + ], + "blocks": [ + { + "type": "@app" + }, + { + "type": "title", + "name": "Title", + "limit": 1, + "settings": [ + { + "type": "select", + "id": "subheading_option", + "label": "Navigation", + "default": "none", + "options": [ + {"value": "none", "label": "None"}, + {"value": "breadcrumb", "label": "Breadcrumb"}, + {"value": "collection", "label": "Collection"}, + {"value": "vendor", "label": "Vendor"} + ] + }, + { + "type": "select", + "id": "heading_font_size", + "label": "Heading size", + "default": "heading-medium", + "options": [ + {"value": "heading-mini", "label": "Mini"}, + {"value": "heading-x-small", "label": "Extra small"}, + {"value": "heading-small", "label": "Small"}, + {"value": "heading-medium", "label": "Medium"}, + {"value": "heading-large", "label": "Large"}, + {"value": "heading-x-large", "label": "Extra large"} + ] + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 8 + } + ] + }, + { + "type": "price", + "name": "Price", + "limit": 1, + "settings": [ + { + "type": "select", + "id": "text_font_size", + "label": "Text size", + "info": "Automatically generated by the base size.", + "default": "body-medium", + "options": [ + {"value": "body-x-small", "label": "Extra small"}, + {"value": "body-small", "label": "Small"}, + {"value": "body-medium", "label": "Medium"}, + {"value": "body-large", "label": "Large"}, + {"value": "body-x-large", "label": "Extra large"} + ] + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "variants", + "name": "Variant picker", + "limit": 1, + "settings": [ + { + "type": "header", + "content": "Size chart" + }, + { + "type": "page", + "id": "info_page", + "label": "Page", + "info": "[Learn more](https://broadcast.invisiblethemes.com/products/product-pages/size-charts)" + }, + { + "type": "select", + "id": "size_chart_style", + "label": "Style", + "default": "text", + "options": [ + {"value": "text", "label": "Text"}, + {"value": "ruler", "label": "Ruler"}, + {"value": "question", "label": "Question mark"} + ] + }, + { + "type": "header", + "content": "Subscriptions", + "info": "Learn more about [subscriptions](https://help.shopify.com/en/manual/products/subscriptions)" + }, + { + "type": "checkbox", + "id": "subscriptions_enable_selectors", + "label": "Enable subscription selectors", + "info": "Shown on products with subscription options", + "default": false + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "buttons", + "name": "Buy buttons", + "limit": 1, + "settings": [ + { + "type": "checkbox", + "id": "show_quantity", + "label": "Show quantity selector", + "default": true + }, + { + "type": "header", + "content": "Add to cart button" + }, + { + "type": "select", + "id": "button_type", + "label": "Color", + "default": "btn--primary", + "options": [ + {"value": "btn--black", "label": "Black"}, + {"value": "btn--white", "label": "White"}, + {"value": "btn--primary", "label": "Primary"}, + {"value": "btn--secondary", "label": "Secondary"} + ] + }, + { + "type": "select", + "id": "button_style", + "label": "Style", + "default": "btn--solid", + "options": [ + {"label": "Solid", "value": "btn--solid"}, + {"label": "Outline", "value": "btn--outline"} + ] + }, + { + "type": "header", + "content": "Dynamic checkout button" + }, + { + "type": "checkbox", + "id": "show_payment_button", + "label": "Show dynamic checkout buttons", + "info": "Each customer will see their preferred payment method from those available on your store, such as PayPal or Apple Pay. [Learn more](https://help.shopify.com/en/manual/online-store/os/dynamic-checkout)", + "default": true + }, + { + "type": "select", + "id": "button_type_dynamic", + "label": "Color", + "default": "btn--secondary", + "options": [ + {"value": "btn--black", "label": "Black"}, + {"value": "btn--white", "label": "White"}, + {"value": "btn--primary", "label": "Primary"}, + {"value": "btn--secondary", "label": "Secondary"} + ] + }, + { + "type": "select", + "id": "button_style_dynamic", + "label": "Style", + "default": "btn--solid", + "options": [ + {"label": "Solid", "value": "btn--solid"}, + {"label": "Outline", "value": "btn--outline"} + ] + }, + { + "type": "header", + "content": "Gift card" + }, + { + "type": "checkbox", + "id": "show_gift_card_recipient", + "label": "Show recipient information form for gift card products", + "default": false, + "info": "Gift card products can optionally be sent direct to a recipient along with a personal message." + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 32 + } + ] + }, + { + "type": "siblings", + "name": "Siblings", + "limit": 1, + "settings": [ + { + "type": "paragraph", + "content": "Siblings allow you to split colors into separate products. [Learn more](https://broadcast.invisiblethemes.com/siblings/product-siblings/about-product-siblings)" + }, + { + "type": "text", + "id": "siblings_collection", + "label": "Product siblings collection handle", + "info": "Use a metafield containing a collection handle for color siblings. The collection should contain all color options as unique products." + }, + { + "type": "text", + "id": "sibling_color", + "label": "Product color metafield", + "info": "Use a single line text metafield called 'theme.sibling_color' for product color." + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "description", + "name": "Description", + "limit": 1, + "settings": [ + { + "type": "checkbox", + "id": "show_read_more", + "label": "Show read more button", + "default": true + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 0 + } + ] + }, + { + "type": "tab_richtext", + "name": "Tabs", + "limit": 1, + "settings": [ + { + "type": "checkbox", + "id": "show_description", + "label": "Show description", + "default": true + }, + { + "type": "checkbox", + "id": "show_read_more", + "label": "Show read more button", + "default": false + }, + { + "type": "text", + "id": "title_1", + "label": "Tab heading", + "default": "Tab" + }, + { + "type": "richtext", + "id": "raw_content_1", + "label": "Tab text", + "default": "

This content type will accept rich text to help with adding styles and links to additional pages or content. Use this to add supplementary information to help your buyers.

" + }, + { + "type": "text", + "id": "title_2", + "label": "Tab heading", + "default": "Info" + }, + { + "type": "richtext", + "id": "raw_content_2", + "label": "Tab text", + "default": "

You can use product metafields to assign content to this tab that is unique to an individual product. Use tabs to highlight unique features, sizing information, or other sales information.

" + }, + { + "type": "text", + "id": "title_3", + "label": "Tab heading" + }, + { + "type": "richtext", + "id": "raw_content_3", + "label": "Tab text" + }, + { + "type": "text", + "id": "title_4", + "label": "Tab heading" + }, + { + "type": "richtext", + "id": "raw_content_4", + "label": "Tab text" + }, + { + "type": "text", + "id": "title_5", + "label": "Tab heading" + }, + { + "type": "richtext", + "id": "raw_content_5", + "label": "Tab text" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 0 + } + ] + }, + { + "type": "accordion", + "name": "Accordion", + "settings": [ + { + "type": "checkbox", + "id": "show_description", + "label": "Show description", + "default": false + }, + { + "type": "checkbox", + "id": "show_read_more", + "label": "Show read more button", + "default": true + }, + { + "type": "checkbox", + "id": "default_open", + "label": "Open by default", + "default": false + }, + { + "type": "text", + "id": "heading", + "label": "Heading", + "default": "Accordion" + }, + { + "type": "richtext", + "id": "text", + "label": "Text", + "default": "

This content type will accept rich text to help with adding styles and links to additional pages or content. Use this to add supplementary information to help your buyers.

" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 0 + } + ] + }, + { + "type": "upsell", + "name": "Upsell", + "limit": 1, + "settings": [ + { + "type": "product", + "id": "upsell_product", + "label": "Single product" + }, + { + "type": "product_list", + "id": "upsell_product_list", + "label": "Product list", + "limit": 3, + "info": "Choose up to 3 upsell products" + }, + { + "type": "checkbox", + "id": "show_available_upsell_only", + "label": "Show only items in stock", + "default": false + }, + { + "type": "select", + "id": "layout", + "label": "Layout", + "info": "Enable pagination styles under Layout > Appearance", + "options": [ + {"value": "stacked", "label": "Stacked"}, + {"value": "slider", "label": "Slider"} + ] + }, + { + "type": "header", + "content": "Slider" + }, + { + "type": "checkbox", + "id": "autoplay", + "label": "Auto-rotate slides", + "default": false + }, + { + "type": "range", + "id": "autoplay_speed", + "min": 4, + "max": 15, + "step": 1, + "unit": "sec", + "label": "Change slides every", + "default": 8 + }, + { + "type": "header", + "content": "Cart" + }, + { + "type": "paragraph", + "content": "Use a dynamic source with the metafield 'theme.upsell' for single product or 'theme.upsell_list' for product list to allow product upsells to follow users into the cart. Use any other name to limit this feature to the product page. [Learn more](https://broadcast.invisiblethemes.com/products/upselling)" + }, + { + "type": "header", + "content": "Colors" + }, + { + "type": "paragraph", + "content": "Overrides color scheme. Set to Transparent to revert back to using color schemes." + }, + { + "type": "color", + "id": "bg_color", + "label": "Background" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "inventory_countdown", + "name": "Inventory countdown", + "limit": 1, + "settings": [ + { + "type": "select", + "id": "show_notice", + "label": "Show notice", + "default": "low-inventory", + "options": [ + {"label": "Always", "value": "always"}, + {"label": "Low inventory", "value": "low-inventory"} + ] + }, + { + "type": "range", + "id": "max_inventory", + "label": "Low inventory threshold", + "min": 1, + "max": 50, + "step": 1, + "default": 10 + }, + { + "type": "checkbox", + "id": "hide_inventory_counter", + "label": "Hide inventory counter", + "default": true + }, + { + "type": "range", + "id": "icon_size", + "label": "Icon size", + "unit": "px", + "min": 20, + "max": 80, + "step": 5, + "default": 20 + }, + { + "type": "header", + "content": "Colors" + }, + { + "type": "color", + "id": "in_stock_color", + "label": "In stock", + "default": "#56AD6A" + }, + { + "type": "color", + "id": "low_stock_color", + "label": "Low stock", + "default": "#f79554" + }, + { + "type": "color", + "id": "out_of_stock_color", + "label": "Out of stock", + "default": "#721C24" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "sharing", + "name": "Sharing", + "limit": 1, + "settings": [ + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "pickup", + "name": "Local pickup", + "limit": 1, + "settings": [ + { + "type": "paragraph", + "content": "Show customers where they can pick up the product. [Learn more](https://help.shopify.com/en/manual/shipping/setting-up-and-managing-your-shipping/local-methods/local-pickup#show-pickup-availability-to-your-customers)" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 32 + } + ] + }, + { + "type": "text", + "name": "Text", + "settings": [ + { + "type": "text", + "id": "title", + "label": "Heading", + "default": "Have questions?" + }, + { + "type": "select", + "id": "heading_font_size", + "label": "Heading size", + "info": "Uses body font family and sizes.", + "default": "body-medium", + "options": [ + {"value": "body-x-small", "label": "Extra small"}, + {"value": "body-small", "label": "Small"}, + {"value": "body-medium", "label": "Medium"}, + {"value": "body-large", "label": "Large"}, + {"value": "body-x-large", "label": "Extra large"} + ] + }, + { + "type": "richtext", + "id": "text", + "label": "Text", + "default": "

Get in touch with us at any time.

" + }, + { + "type": "select", + "id": "text_font_size", + "label": "Text size", + "info": "Automatically generated by the base size.", + "default": "body-medium", + "options": [ + {"value": "body-x-small", "label": "Extra small"}, + {"value": "body-small", "label": "Small"}, + {"value": "body-medium", "label": "Medium"}, + {"value": "body-large", "label": "Large"}, + {"value": "body-x-large", "label": "Extra large"} + ] + }, + { + "type": "select", + "id": "text_alignment", + "label": "Text alignment", + "default": "text-left", + "options": [ + {"value": "text-left", "label": "Left"}, + {"value": "text-center", "label": "Centered"} + ] + }, + { + "type": "select", + "id": "layout", + "label": "Layout", + "options": [ + { + "value": "left", + "label": "Left" + }, + { + "value": "inline", + "label": "In-line" + } + ], + "default": "left" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "code", + "name": "Custom code", + "settings": [ + { + "type": "liquid", + "id": "code", + "label": "Custom code", + "info": "Add app snippets or other Liquid code to create advanced customizations." + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "icon", + "name": "Icon", + "settings": [ + { + "type": "select", + "id": "icon_name", + "label": "Icon", + "default": "icon-award", + "options": [ + {"label": "Award", "value": "icon-award"}, + {"label": "Box", "value": "icon-box"}, + {"label": "Chat", "value": "icon-chat"}, + {"label": "Check", "value": "icon-check"}, + {"label": "Check circle", "value": "icon-check-circle"}, + {"label": "Cloud", "value": "icon-cloud"}, + {"label": "Diameter", "value": "icon-diameter"}, + {"label": "Discount", "value": "icon-discount"}, + {"label": "Donation", "value": "icon-donation"}, + {"label": "Droplet", "value": "icon-droplet"}, + {"label": "Info", "value": "icon-info-empty"}, + {"label": "Email", "value": "icon-email"}, + {"label": "Fast shipment", "value": "icon-fast-shipment"}, + {"label": "Flare", "value": "icon-flare"}, + {"label": "Flower", "value": "icon-flower"}, + {"label": "Gift", "value": "icon-gift"}, + {"label": "Green shipment", "value": "icon-green-shipment"}, + {"label": "Heart", "value": "icon-heart"}, + {"label": "Leaf", "value": "icon-leaf"}, + {"label": "Lightning", "value": "icon-lightning"}, + {"label": "Location", "value": "icon-location"}, + {"label": "Mail", "value": "icon-mail"}, + {"label": "Notes", "value": "icon-notes"}, + {"label": "Pants", "value": "icon-pants"}, + {"label": "Peace", "value": "icon-peace"}, + {"label": "Pin", "value": "icon-pin"}, + {"label": "Planet", "value": "icon-planet"}, + {"label": "Phone", "value": "icon-phone"}, + {"label": "Recycle", "value": "icon-recycle"}, + {"label": "Ruler", "value": "icon-ruler"}, + {"label": "Shield", "value": "icon-shield"}, + {"label": "Smile", "value": "icon-smile"}, + {"label": "Star", "value": "icon-star"}, + {"label": "Tree", "value": "icon-tree"}, + {"label": "Trophy", "value": "icon-trophy"}, + {"label": "Truck", "value": "icon-truck"}, + {"label": "Vegan", "value": "icon-vegan"}, + {"label": "Wash", "value": "icon-wash"}, + {"label": "Washing machine", "value": "icon-washing-machine"} + ] + }, + { + "type": "image_picker", + "id": "image", + "label": "Alternative icon/image", + "info": "160 x 160px .svg recommended. [Learn more](https://invisiblethemes.com/link/broadcast/images)" + }, + { + "type": "range", + "id": "icon_size", + "label": "Size", + "unit": "px", + "min": 20, + "max": 80, + "step": 5, + "default": 20 + }, + { + "type": "color", + "id": "icon_color", + "label": "Icon color" + }, + { + "type": "richtext", + "id": "text", + "label": "Text", + "default": "

Title<\/p>" + }, + { + "type": "select", + "id": "text_font_size", + "label": "Text size", + "info": "Automatically generated by the base size. Applies only when content in Text field is set to Paragraph.", + "default": "body-medium", + "options": [ + {"value": "body-x-small", "label": "Extra small"}, + {"value": "body-small", "label": "Small"}, + {"value": "body-medium", "label": "Medium"}, + {"value": "body-large", "label": "Large"}, + {"value": "body-x-large", "label": "Extra large"} + ] + }, + { + "type": "header", + "content": "Layout" + }, + { + "type": "select", + "id": "width", + "label": "Width", + "default": "full", + "options": [ + {"label": "Full width", "value": "full"}, + {"label": "Half", "value": "half"}, + {"label": "One third", "value": "third"}, + {"label": "One quarter", "value": "quarter"} + ] + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "divider", + "name": "Divider", + "settings": [ + { + "type": "checkbox", + "id": "show_line", + "label": "Show line", + "default": true + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 1, + "unit": "px", + "label": "Bottom", + "default": 20 + } + ] + }, + { + "type": "line-item", + "name": "Line item property", + "settings": [ + { + "type": "text", + "id": "label", + "label": "Label", + "default": "Your label" + }, + { + "type": "select", + "id": "type", + "label": "Type", + "default": "text", + "options": [ + {"label": "Text", "value": "text"}, + {"label": "Checkbox", "value": "checkbox"}, + {"label": "Dropdown", "value": "dropdown"} + ] + }, + { + "type": "header", + "content": "Typography", + "info": "For Type set to \"Text\"." + }, + { + "type": "checkbox", + "id": "required", + "label": "Required", + "default": true + }, + { + "type": "header", + "content": "Checkbox", + "info": "For Type set to \"Checkbox\"." + }, + { + "type": "text", + "id": "checked_value", + "label": "Checked value", + "default": "Yes" + }, + { + "type": "text", + "id": "unchecked_value", + "label": "Unchecked value", + "default": "No" + }, + { + "type": "header", + "content": "Dropdown", + "info": "For Type set to \"Dropdown\"." + }, + { + "type": "text", + "id": "option_1", + "label": "Option 1", + "default": "Option 1" + }, + { + "type": "text", + "id": "option_2", + "label": "Option 2", + "default": "Option 2" + }, + { + "type": "text", + "id": "option_3", + "label": "Option 3", + "default": "Option 3" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "features", + "name": "Feature", + "settings": [ + { + "type": "select", + "id": "icon_name", + "label": "Icon", + "default": "icon-award", + "options": [ + {"label": "Award", "value": "icon-award"}, + {"label": "Box", "value": "icon-box"}, + {"label": "Chat", "value": "icon-chat"}, + {"label": "Check", "value": "icon-check"}, + {"label": "Check circle", "value": "icon-check-circle"}, + {"label": "Cloud", "value": "icon-cloud"}, + {"label": "Diameter", "value": "icon-diameter"}, + {"label": "Discount", "value": "icon-discount"}, + {"label": "Donation", "value": "icon-donation"}, + {"label": "Droplet", "value": "icon-droplet"}, + {"label": "Info", "value": "icon-info-empty"}, + {"label": "Email", "value": "icon-email"}, + {"label": "Fast shipment", "value": "icon-fast-shipment"}, + {"label": "Flare", "value": "icon-flare"}, + {"label": "Flower", "value": "icon-flower"}, + {"label": "Gift", "value": "icon-gift"}, + {"label": "Green shipment", "value": "icon-green-shipment"}, + {"label": "Heart", "value": "icon-heart"}, + {"label": "Leaf", "value": "icon-leaf"}, + {"label": "Lightning", "value": "icon-lightning"}, + {"label": "Location", "value": "icon-location"}, + {"label": "Mail", "value": "icon-mail"}, + {"label": "Notes", "value": "icon-notes"}, + {"label": "Pants", "value": "icon-pants"}, + {"label": "Peace", "value": "icon-peace"}, + {"label": "Pin", "value": "icon-pin"}, + {"label": "Planet", "value": "icon-planet"}, + {"label": "Phone", "value": "icon-phone"}, + {"label": "Recycle", "value": "icon-recycle"}, + {"label": "Ruler", "value": "icon-ruler"}, + {"label": "Shield", "value": "icon-shield"}, + {"label": "Smile", "value": "icon-smile"}, + {"label": "Star", "value": "icon-star"}, + {"label": "Tree", "value": "icon-tree"}, + {"label": "Trophy", "value": "icon-trophy"}, + {"label": "Truck", "value": "icon-truck"}, + {"label": "Vegan", "value": "icon-vegan"}, + {"label": "Wash", "value": "icon-wash"}, + {"label": "Washing machine", "value": "icon-washing-machine"} + ] + }, + { + "type": "image_picker", + "id": "icon_alt", + "label": "Alternative icon/image", + "info": "160 x 160px .svg recommended. [Learn more](https://invisiblethemes.com/link/broadcast/images)" + }, + { + "type": "range", + "id": "icon_size", + "label": "Size", + "unit": "px", + "min": 20, + "max": 80, + "step": 5, + "default": 20 + }, + { + "type": "text", + "id": "title", + "label": "Heading", + "default": "Feature" + }, + { + "type": "select", + "id": "text_font_size", + "label": "Text size", + "info": "Automatically generated by the base size. Applies only when content in Text field is set to Paragraph.", + "default": "body-medium", + "options": [ + {"value": "body-x-small", "label": "Extra small"}, + {"value": "body-small", "label": "Small"}, + {"value": "body-medium", "label": "Medium"}, + {"value": "body-large", "label": "Large"}, + {"value": "body-x-large", "label": "Extra large"} + ] + }, + { + "type": "richtext", + "id": "text", + "label": "Text", + "default": "

This content type will accept rich text to help with adding styles and links to additional pages or content. Use this to add supplementary information to help your buyers.

" + }, + { + "type": "header", + "content": "Colors" + }, + { + "type": "paragraph", + "content": "Overrides color scheme. Set to Transparent to revert back to using color schemes." + }, + { + "id": "bg_color", + "type": "color", + "label": "Background" + }, + { + "type": "color", + "id": "color", + "label": "Text" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "complementary-products", + "name": "Complementary products", + "limit": 1, + "settings": [ + { + "type": "paragraph", + "content": "To select complementary products, add the Search & Discovery app. [Learn more](https://help.shopify.com/manual/online-store/search-and-discovery/product-recommendations)" + }, + { + "type": "range", + "id": "complementary_limit", + "min": 1, + "max": 3, + "step": 1, + "label": "Number of products", + "default": 3 + }, + { + "type": "select", + "id": "layout", + "label": "Layout", + "info": "Enable pagination styles under Layout > Appearance", + "options": [ + {"value": "stacked", "label": "Stacked"}, + {"value": "slider", "label": "Slider"} + ] + }, + { + "type": "header", + "content": "Slider" + }, + { + "type": "checkbox", + "id": "autoplay", + "label": "Auto-rotate slides", + "default": false + }, + { + "type": "range", + "id": "autoplay_speed", + "min": 4, + "max": 15, + "step": 1, + "unit": "sec", + "label": "Change slides every", + "default": 8 + }, + { + "type": "header", + "content": "Colors" + }, + { + "type": "paragraph", + "content": "Overrides color scheme. Set to Transparent to revert back to using color schemes." + }, + { + "type": "color", + "id": "bg_color", + "label": "Background" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "popup", + "name": "Popup", + "settings": [ + { + "type": "text", + "id": "title", + "label": "Link text", + "default": "Popup text" + }, + { + "type": "richtext", + "id": "text", + "label": "Text", + "default": "

Additonal information about the product.

" + }, + { + "type": "page", + "id": "page", + "label": "Page" + }, + { + "type": "select", + "id": "icon_name", + "label": "Icon", + "default": "icon-award", + "options": [ + {"label": "Award", "value": "icon-award"}, + {"label": "Box", "value": "icon-box"}, + {"label": "Chat", "value": "icon-chat"}, + {"label": "Check", "value": "icon-check"}, + {"label": "Check circle", "value": "icon-check-circle"}, + {"label": "Cloud", "value": "icon-cloud"}, + {"label": "Diameter", "value": "icon-diameter"}, + {"label": "Discount", "value": "icon-discount"}, + {"label": "Donation", "value": "icon-donation"}, + {"label": "Droplet", "value": "icon-droplet"}, + {"label": "Info", "value": "icon-info-empty"}, + {"label": "Email", "value": "icon-email"}, + {"label": "Fast shipment", "value": "icon-fast-shipment"}, + {"label": "Flare", "value": "icon-flare"}, + {"label": "Flower", "value": "icon-flower"}, + {"label": "Gift", "value": "icon-gift"}, + {"label": "Green shipment", "value": "icon-green-shipment"}, + {"label": "Heart", "value": "icon-heart"}, + {"label": "Leaf", "value": "icon-leaf"}, + {"label": "Lightning", "value": "icon-lightning"}, + {"label": "Location", "value": "icon-location"}, + {"label": "Mail", "value": "icon-mail"}, + {"label": "Notes", "value": "icon-notes"}, + {"label": "Pants", "value": "icon-pants"}, + {"label": "Peace", "value": "icon-peace"}, + {"label": "Pin", "value": "icon-pin"}, + {"label": "Planet", "value": "icon-planet"}, + {"label": "Phone", "value": "icon-phone"}, + {"label": "Recycle", "value": "icon-recycle"}, + {"label": "Ruler", "value": "icon-ruler"}, + {"label": "Shield", "value": "icon-shield"}, + {"label": "Smile", "value": "icon-smile"}, + {"label": "Star", "value": "icon-star"}, + {"label": "Tree", "value": "icon-tree"}, + {"label": "Trophy", "value": "icon-trophy"}, + {"label": "Truck", "value": "icon-truck"}, + {"label": "Vegan", "value": "icon-vegan"}, + {"label": "Wash", "value": "icon-wash"}, + {"label": "Washing machine", "value": "icon-washing-machine"} + ] + }, + { + "type": "image_picker", + "id": "image", + "label": "Alternative icon/image", + "info": "160 x 160px .svg recommended. [Learn more](https://invisiblethemes.com/link/broadcast/images)" + }, + { + "type": "range", + "id": "icon_size", + "label": "Size", + "unit": "px", + "min": 20, + "max": 80, + "step": 5, + "default": 20 + }, + { + "type": "color", + "id": "icon_color", + "label": "Icon color" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "badges", + "name": "Badges", + "settings": [ + { + "type": "checkbox", + "id": "sale_badge", + "label": "Show sale badges", + "default": true + }, + { + "type": "checkbox", + "id": "product_badges", + "label": "Show product badges", + "info": "Add tag '_preorder' or '_badge_with_custom_text' to a product in order to show the badge", + "default": true + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 8 + } + ] + }, + { + "type": "sku", + "name": "SKU", + "limit": 1, + "settings": [ + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + }, + { + "type": "fit-guide", + "name": "Fit guide", + "settings": [ + { + "type": "text", + "id": "heading", + "label": "Heading", + "default": "Fit" + }, + { + "type": "text", + "id": "selected_segment", + "label": "Active segment", + "default": "4", + "info": "Enter a number from 1 - 5 to show active fit. Use a metafield for a custom fit per product." + }, + { + "type": "text", + "id": "left_label", + "label": "Left label", + "default": "Small" + }, + { + "type": "text", + "id": "middle_label", + "label": "Middle label", + "default": "True to size" + }, + { + "type": "text", + "id": "right_label", + "label": "Right label", + "default": "Large" + }, + { + "type": "header", + "content": "Colors" + }, + { + "type": "color", + "id": "fit_color", + "label": "Color" + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 8 + } + ] + }, + { + "type": "countdown", + "name": "Countdown timer", + "settings": [ + { + "type": "text", + "id": "end_date", + "label": "End date", + "placeholder": "2025-12-31", + "default": "2025-12-31", + "info": "Use format \"YYYY-MM-DD\". Expiration date is based on the [store primary timezone](/admin/settings/general)." + }, + { + "type": "text", + "id": "end_time", + "label": "End time", + "default": "11:59", + "placeholder": "11:59", + "info": "Use 12-hour time convention in format \"HH:MM\"" + }, + { + "type": "radio", + "id": "period", + "label": "AM/PM", + "options": [ + {"value": "am", "label": "AM"}, + {"value": "pm", "label": "PM"} + ], + "default": "am" + }, + { + "type": "richtext", + "id": "end_message", + "label": "End of timer message", + "default": "

Offer has expired

" + }, + { + "type": "checkbox", + "id": "hide_on_complete", + "label": "Hide block after end of timer", + "default": true + }, + { + "type": "select", + "id": "digits_font_size", + "label": "Digits size", + "default": "heading-x-large", + "options": [ + {"value": "heading-mini", "label": "Mini"}, + {"value": "heading-x-small", "label": "Extra small"}, + {"value": "heading-small", "label": "Small"}, + {"value": "heading-medium", "label": "Medium"}, + {"value": "heading-large", "label": "Large"}, + {"value": "heading-x-large", "label": "Extra large"} + ] + }, + { + "type": "select", + "id": "text_font_size", + "label": "Date size", + "info": "Automatically generated by the base size. Applies only when content in Text field is set to Paragraph.", + "default": "body-small", + "options": [ + {"value": "body-x-small", "label": "Extra small"}, + {"value": "body-small", "label": "Small"}, + {"value": "body-medium", "label": "Medium"}, + {"value": "body-large", "label": "Large"}, + {"value": "body-x-large", "label": "Extra large"} + ] + }, + { + "type": "richtext", + "id": "text", + "label": "Text", + "default": "

Limited time offer

" + }, + { + "type": "select", + "id": "heading_font_size", + "label": "Heading size", + "default": "heading-x-small", + "options": [ + {"value": "heading-mini", "label": "Mini"}, + {"value": "heading-x-small", "label": "Extra small"}, + {"value": "heading-small", "label": "Small"}, + {"value": "heading-medium", "label": "Medium"}, + {"value": "heading-large", "label": "Large"}, + {"value": "heading-x-large", "label": "Extra large"} + ] + }, + { + "type": "header", + "content": "Colors" + }, + { + "type": "paragraph", + "content": "Overrides color scheme. Set to Transparent to revert back to using color schemes." + }, + { + "type": "color", + "id": "bg_color", + "label": "Background" + }, + { + "type": "color", + "id": "color", + "label": "Text" + }, + { + "type": "header", + "content": "Layout" + }, + { + "type": "select", + "id": "text_align", + "label": "Text alignment", + "default": "text-center", + "options": [ + {"value": "text-left", "label": "Left"}, + {"value": "text-center", "label": "Centered"} + ] + }, + { + "type": "header", + "content": "Padding" + }, + { + "type": "range", + "id": "padding_bottom", + "min": 0, + "max": 50, + "step": 2, + "unit": "px", + "label": "Bottom", + "default": 16 + } + ] + } + ] +} +{% endschema %} diff --git a/snippets/product-grid-price.liquid b/snippets/product-grid-price.liquid new file mode 100644 index 0000000..b22acf5 --- /dev/null +++ b/snippets/product-grid-price.liquid @@ -0,0 +1,74 @@ +{% comment %} + Renders Price on product grid item + + Accepts: + - product: {Object} product (required) + - current_variabt: {Object} Current variant (required) + + Usage: + {% render 'product-grid-price', product: product, current_variant: current_variant %} +{% endcomment %} + +{%- liquid + + assign product_price = product.metafields.app--168074346497.min_auto_discounted_price.value | default: product.price + assign product_price_min = product_price + assign product_compare_at_price = product.compare_at_price + assign product_compare_at_price_min = product.compare_at_price_min + + if product_price < product.price and product_compare_at_price == 0 or product_compare_at_price == blank + assign product_compare_at_price = product.price + endif + + if product_price < product.price and product_compare_at_price_min == 0 or product_compare_at_price_min == blank + assign product_compare_at_price_min = product.price + endif + + assign product_price_raw = product_price + assign product_price_min_raw = product_price_min + assign product_compare_at_price_raw = product_compare_at_price + assign product_compare_at_price_min_raw = product_compare_at_price_min + + if settings.currency_code_enable + assign product_price_min = product_price_min_raw | money_with_currency + assign product_compare_at_price = product_compare_at_price_raw | money_with_currency + else + assign product_price_min = product_price_min_raw | money + assign product_compare_at_price = product_compare_at_price_raw | money + endif +-%} + + + {% if product.available or badge_soldout != '' %} + + {% if product.price_varies %} + {{ 'products.general.from' | t }} + {% endif %} + {%- if product_price_raw == 0 and product.price_varies == false -%} + {{ 'general.money.free' | t }} + {%- else -%} + {{ product_price_min }} + {%- endif -%} + + {% if product_compare_at_price_raw > product_price_raw %} + {{ product_compare_at_price }} + {% endif %} + {% else %} + {{ 'products.product.sold_out' | t }} + {% endif %} + +{% if current_variant.unit_price %} + {% capture unit_price_separator %} + + + {% endcapture %} + {% capture unit_price_base_unit %} + {% if current_variant.unit_price_measurement.reference_value != 1 %} + {{ current_variant.unit_price_measurement.reference_value }} + {% endif %} + {{ current_variant.unit_price_measurement.reference_unit }} + {% endcapture %} +
+ + {% if settings.currency_code_enable %}{{ current_variant.unit_price | money_with_currency }}{% else %}{{ current_variant.unit_price | money }}{% endif %}{{ unit_price_separator }}{{ unit_price_base_unit }} +{% endif %} \ No newline at end of file diff --git a/snippets/product-price.liquid b/snippets/product-price.liquid new file mode 100644 index 0000000..3d3557f --- /dev/null +++ b/snippets/product-price.liquid @@ -0,0 +1,181 @@ +{%- liquid + assign current_variant = product.selected_or_first_available_variant + assign price_font_size = block.settings.text_font_size + + # start - Yagi discounted price calculation + assign current_variant_price = selected_variant.metafields.app--168074346497.auto_discounted_price.value | default: current_variant.price + + if current_variant_price < current_variant.price + assign current_variant_compare_at_price = current_variant.price + endif + + if current_variant.metafields.app--168074346497.discount_type.value != nil and current_variant.metafields.app--168074346497.discount_type.value != "fixed" + assign deducted_percentage = 1.0 | minus: product.metafields.app--168074346497.discount_percentage.value + + if current_variant.metafields.app--168074346497.discount_percentage.value > 0.01 + assign deducted_percentage = 1.0 | minus: selected_variant.metafields.app--168074346497.discount_percentage.value + endif + + assign current_variant_price = current_variant.price | divided_by: 100.0 | times: deducted_percentage | times: 100.0 | ceil + + assign current_variant_compare_at_price = current_variant.price + + if current_variant.compare_at_price > current_variant_compare_at_price + assign current_variant_compare_at_price = current_variant.compare_at_price + endif + endif + + assign product_price = product.price + assign product_compare_at_price_max = product.compare_at_price_max + assign product_compare_at_price = product.compare_at_price + + 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 == 0 or product_compare_at_price == blank + assign product_compare_at_price = product.price + endif + + 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 + # end - Yagi discounted price calculation + + assign units = product.variants | map: 'unit_price' | compact + if units[0] + assign has_units = true + else + assign has_units = false + endif +-%} + +
+
+
+ current_variant_price %} + class="product__price--sale" + {% endif %} + > + {%- if current_variant_price == 0 -%} + {{ 'general.money.free' | t }} + {%- else -%} + {{ current_variant_price | money }} + {%- endif -%} + + + {%- if product_compare_at_price_max > product_price -%} + + + {%- if current_variant_compare_at_price > current_variant_price -%} + {{ current_variant_compare_at_price | money }} + {%- endif -%} + + {%- endif -%} + + {%- if has_units -%} + {%- capture show_units -%} + {%- unless current_variant.unit_price -%}style="display: none;"{%- endunless -%} + {%- endcapture -%} + + {%- capture unit_price_separator -%} + + {%- endcapture -%} + + {%- capture unit_price_base_unit -%} + + {% if current_variant.unit_price_measurement %} + {% if current_variant.unit_price_measurement.reference_value != 1 %} + {{ current_variant.unit_price_measurement.reference_value }} + {%- endif -%} + {{ current_variant.unit_price_measurement.reference_unit }} + {% endif %} + + {%- endcapture -%} + +
+ + + {{ current_variant.unit_price | money }} + {{ unit_price_separator }} + {{ unit_price_base_unit }} + + +
+ {%- endif -%} +
+ + {%- liquid + assign sale_badge = settings.sale_badge + assign final_sale = settings.final_sale | default: product.metafields.theme.final_sale.value + assign final_sale_variant = false + + for variant in product.variants + if variant.metafields.theme.final_sale.value == true + assign final_sale_variant = true + endif + endfor + -%} + + {%- if sale_badge or final_sale or final_sale_variant -%} +
+ {%- if sale_badge -%} + + {%- endif -%} + + {%- if final_sale or final_sale_variant -%} + + {%- endif -%} +
+ {%- endif -%} +
+ + {% comment %} Shop pay split payment terms {% endcomment %} +
+ {%- assign product_form_installment_id = 'product-form-installment-' + | append: unique + | append: '-' + | append: product.id + -%} + {%- form 'product', + product, + id: product_form_installment_id, + class: 'installment', + data-product-form-installment: '' + -%} + + {{ form | payment_terms }} + {%- endform -%} +
+