zz-shopify-components 0.0.27 → 0.0.28-beta.10

package/sections/zz-shopping-card-list.liquid

@@ -1,399 +1,399 @@
-{% assign block_size = section.blocks.size %}
-{% assign bullets_width_half = block_size
-  | minus: 1
-  | times: 14
-  | plus: 6
-  | divided_by: 2.0
-  | ceil
-%}
-{% assign btn_offset = bullets_width_half | plus: 14 | plus: 36 %}
-{% assign bullets_width_half_pc = block_size
-  | minus: 1
-  | times: 18
-  | plus: 6
-  | divided_by: 2.0
-  | ceil
-%}
-{% assign btn_offset_pc = bullets_width_half | plus: 18 | plus: 48 %}
-
-<style>
-  #shopify-section-{{section.id}} .zz-shopping-cart-list-slides {
-    padding: 96px 0;
-    width: 100%;
-    height: fit-content;
-    background: {{ section.settings.bg_color }};
-    letter-spacing: 0;
-  }
-  #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper {
-    padding: 0 2.3438vw;
-  }
-  @media screen and (min-width: 1280px) {
-    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper {
-      padding: 0 calc((100vw - 1220px) / 2);
-    }
-  }
-
-  #shopify-section-{{section.id}} .banner-item {
-    height: 424px;
-    width: 300px;
-  }
-
-  /* Mobile styles - Keep swiper functionality */
-  @media screen and (max-width: 1023px) {
-    #shopify-section-{{section.id}} .zz-shopping-cart-list-slides {
-      padding: 47px 0;
-    }
-    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper {
-      padding: 0 20px;
-    }
-    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-slide {
-      width: fit-content;
-      height: fit-content;
-    }
-    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-slide .banner-item {
-      background: {{ section.settings.banner_bg_color }};
-    }
-    #shopify-section-{{section.id}} .swiper-button-next,
-    #shopify-section-{{section.id}} .swiper-button-prev {
-      z-index: 99;
-      top: unset;
-      bottom: 0;
-      width: 36px;
-      height: 36px;
-    }
-    #shopify-section-{{section.id}} .swiper-button-prev {
-      left: 50%;
-      transform: translate(-{{ btn_offset }}px, 0px);
-    }
-    #shopify-section-{{section.id}} .swiper-button-next {
-      right: 50%;
-      transform: translate({{ btn_offset }}px, 0px);
-    }
-    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-pagination-bullets {
-      bottom: 9px;
-    }
-    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-pagination-bullets .swiper-pagination-bullet {
-      margin: 0 4px;
-      width: 6px;
-      height: 6px;
-      background-color: {{ section.settings.pagination_color }};
-      opacity: 0.5;
-    }
-  }
-
-  /* PC styles - Grid layout instead of swiper */
-  @media screen and (min-width: 1024px) {
-    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-wrapper {
-      display: grid !important;
-      grid-template-columns: repeat(3, 1fr);
-      gap: 24px;
-      transform: none !important;
-      max-width: 1200px;
-      margin: 0 auto;
-    }
-    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-slide {
-      width: auto !important;
-      margin: 0 !important;
-      height: fit-content;
-    }
-    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-slide .banner-item {
-      position: relative;
-      height: 480px;
-      width: 380px;
-      background: {{ section.settings.banner_bg_color }};
-    }
-
-    /* Hide navigation elements on PC */
-    #shopify-section-{{section.id}} .swiper-button-next,
-    #shopify-section-{{section.id}} .swiper-button-prev,
-    #shopify-section-{{section.id}} .swiper-pagination {
-      display: none !important;
-    }
-
-    #shopify-section-{{section.id}} .content-title-h3 {
-      margin: 0 auto;
-      font-size: 60px;
-    }
-  }
-
-  /* Common styles for navigation elements */
-  #shopify-section-{{section.id}} .swiper-button-next:after,
-  #shopify-section-{{section.id}} .swiper-button-prev:after {
-    display: none;
-  }
-  #shopify-section-{{section.id}} .swiper-button-next.swiper-button-disabled,
-  #shopify-section-{{section.id}} .swiper-button-prev.swiper-button-disabled {
-    opacity: 0.5;
-  }
-  #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-pagination-bullets .swiper-pagination-bullet-active {
-    opacity: 1;
-  }
-</style>
-
-<div class='zz-shopping-cart-list-slides slow-reveal'>
-  {% if section.settings.title != blank %}
-    <div class='tw-px-[20px] tw-mb-[32px]'>
-      {% render 'zz-content-h3',
-        title_color: section.settings.title_color,
-        title: section.settings.title,
-        class_name: 'content-title-h3 lg:tw-text-center'
-      %}
-    </div>
-  {% endif %}
-  <div class='swiper zz-shopping-cart-list-swiper'>
-    <div class='swiper-wrapper'>
-      {% for block in section.blocks %}
-        <div class='swiper-slide {% if block_size > 1 %} max-lg:tw-pb-[60px]  {% endif %}'>
-          <div class='banner-item tw-rounded-[10px] lg:tw-rounded-[16px] tw-flex tw-flex-col tw-justify-between'>
-            <div class='tw-h-[168px] lg:tw-h-[214px] tw-overflow-hidden tw-rounded-t-[10px] lg:tw-rounded-t-[16px] tw-flex-shrink-0'>
-              {%- if block.settings.image != blank -%}
-                {{
-                  block.settings.image
-                  | image_url: width: 915
-                  | image_tag:
-                    alt: block.settings.slide_title,
-                    class: 'lg:tw-hidden tw-w-full tw-h-auto tw-object-contain'
-                }}
-              {% endif %}
-              {%- if block.settings.image_pc != blank -%}
-                {{
-                  block.settings.image_pc
-                  | image_url: width: 640
-                  | image_tag:
-                    alt: block.settings.slide_title,
-                    class: 'max-lg:tw-hidden tw-w-full tw-h-auto tw-object-contain'
-                }}
-              {% endif %}
-            </div>
-            <div class='tw-flex tw-flex-col tw-justify-between tw-px-[16px] lg:tw-px-[20px] tw-pt-[20px] lg:tw-pt-[30px] tw-pb-[20px] lg:tw-pb-[32px] tw-grow'>
-              <div class='tw-flex tw-flex-col tw-gap-[8px]'>
-                <p class='slide-content tw-text-[10px] lg:tw-text-[12px] tw-leading-[1.5] tw-text-left tw-text-black'>
-                  {{ block.settings.title_prefix }}
-                </p>
-                <p class='slide-title  tw-text-[16px]  lg:tw-text-[18px] tw-leading-[1.2] tw-text-left tw-font-bold tw-text-black'>
-                  {{ block.settings.slide_title }}
-                </p>
-                {% if block.settings.slide_content != blank %}
-                  <div class='slide-content tw-h-[45px] lg:tw-h-[72px]  tw-text-[12px] lg:tw-text-[14px] tw-leading-[1.5] tw-text-left tw-text-black'>
-                    {{ block.settings.slide_content }}
-                  </div>
-                {% endif %}
-              </div>
-
-              <div class='tw-flex tw-justify-between tw-flex-col tw-items-start max-lg:tw-gap-[12px] lg:tw-flex-row'>
-                {% assign product = all_products[block.settings.product] %}
-                {% assign variant_id = block.settings.variant_id | times: 1 %}
-                {% assign variant = product.variants
-                  | where: 'id', variant_id
-                  | first
-                %}
-                {% render 'zz-price-tag',
-                  price: variant.price,
-                  compare_at_price: variant.compare_at_price
-                %}
-                {% assign product_url = shop.url
-                  | append: product.url
-                  | append: '?variant='
-                  | append: variant.id
-                %}
-                {% render 'zz-button',
-                  text: block.settings.btn_text,
-                  href: product_url,
-                  type: 'primary-round',
-                  color: 'black',
-                  size: 'medium',
-                  class_name: 'tw-box-border tw-w-full lg:tw-w-auto'
-                %}
-              </div>
-            </div>
-          </div>
-        </div>
-      {% endfor %}
-    </div>
-    <!-- Navigation buttons - only show on mobile -->
-    <div class='swiper-button-prev {% if block_size <= 1 %} tw-hidden {% endif %}'>
-      {% if section.settings.prev_icon != blank %}
-        {{
-          section.settings.prev_icon
-          | image_url: width: 48
-          | image_tag:
-            alt: 'prev',
-            class: 'tw-w-full tw-h-full tw-object-contain'
-        }}
-      {% else %}
-        {% render 'zz-icon-prev' %}
-      {% endif %}
-    </div>
-    <div class='swiper-button-next {% if block_size <= 1 %} tw-hidden {% endif %}'>
-      {% if section.settings.next_icon != blank %}
-        {{
-          section.settings.next_icon
-          | image_url: width: 48
-          | image_tag:
-            alt: 'next',
-            class: 'tw-w-full tw-h-full tw-object-contain'
-        }}
-      {% else %}
-        {% render 'zz-icon-next' %}
-      {% endif %}
-    </div>
-
-    <!-- Pagination indicator - only show on mobile -->
-    <div class='swiper-pagination'></div>
-  </div>
-</div>
-
-<script>
-  document.addEventListener('DOMContentLoaded', function () {
-    const mobileMediaQuery = window.matchMedia('(max-width: 1023px)');
-    let swiperInstance = null;
-
-    function handleResponsiveSwiper(mediaQuery) {
-      if (mediaQuery.matches) {
-        // Mobile: Initialize Swiper
-        if (!swiperInstance) {
-          const spaceBetween = 8;
-          swiperInstance = new Swiper(
-            '#shopify-section-{{section.id}} .zz-shopping-cart-list-swiper',
-            {
-              initialSlide: 0,
-              slidesPerView: 'auto',
-              centeredSlides: true,
-              spaceBetween: spaceBetween,
-              navigation: {
-                nextEl: '#shopify-section-{{section.id}} .swiper-button-next',
-                prevEl: '#shopify-section-{{section.id}} .swiper-button-prev',
-              },
-              pagination: {
-                el: '#shopify-section-{{section.id}} .swiper-pagination',
-                clickable: true,
-              },
-              effect: 'slide',
-            }
-          );
-        }
-      } else {
-        // PC: Destroy Swiper completely
-        if (swiperInstance) {
-          swiperInstance.destroy(true, true);
-          swiperInstance = null;
-        }
-      }
-    }
-
-    // Initial check
-    handleResponsiveSwiper(mobileMediaQuery);
-
-    // Listen for window size changes
-    mobileMediaQuery.addEventListener('change', handleResponsiveSwiper);
-  });
-</script>
-
-{% schema %}
-{
-  "name": "Shopping Card List",
-  "settings": [
-    {
-      "type": "color",
-      "id": "bg_color",
-      "default": "#001630",
-      "label": "背景色"
-    },
-    {
-      "type": "image_picker",
-      "id": "top_flag",
-      "label": "顶部图标"
-    },
-    {
-      "type": "richtext",
-      "id": "title",
-      "label": "标题"
-    },
-    {
-      "type": "color",
-      "id": "title_color",
-      "default": "#FFFFFF",
-      "label": "标题颜色"
-    },
-    {
-      "type": "color",
-      "id": "banner_bg_color",
-      "default": "#0A1F38",
-      "label": "轮播卡片背景色"
-    },
-    {
-      "type": "color",
-      "id": "pagination_color",
-      "default": "#ffffff",
-      "label": "轮播导航圆圈颜色"
-    },
-    {
-      "type": "image_picker",
-      "id": "prev_icon",
-      "label": "轮播上一张图标"
-    },
-    {
-      "type": "image_picker",
-      "id": "next_icon",
-      "label": "轮播下一张图标"
-    }
-  ],
-  "blocks": [
-    {
-      "name": "Shopping Card",
-      "type": "zz-shopping-card-item",
-      "settings": [
-        {
-          "type": "image_picker",
-          "id": "image_pc",
-          "label": "Image"
-        },
-        {
-          "type": "image_picker",
-          "id": "image",
-          "label": "Image(mobile)"
-        },
-        {
-          "type": "text",
-          "id": "title_prefix",
-          "label": "标题前缀"
-        },
-        {
-          "type": "text",
-          "id": "slide_title",
-          "label": "标题"
-        },
-        {
-          "type": "richtext",
-          "id": "slide_content",
-          "label": "内容"
-        },
-        {
-          "type": "text",
-          "id": "btn_text",
-          "label": "按钮文字",
-          "default": "Buy Now"
-        },
-        {
-          "type": "product",
-          "id": "product",
-          "label": "Product",
-          "info": "选择产品"
-        },
-        {
-          "type": "text",
-          "id": "variant_id",
-          "label": "Variant ID",
-          "placeholder": "变体ID",
-          "info": "输入变体ID，变体ID可以在产品编辑页面查看"
-        }
-      ]
-    }
-  ],
-  "presets": [
-    {
-      "name": "Shopping Card List"
-    }
-  ]
-}
-{% endschema %}
+{% assign block_size = section.blocks.size %}
+{% assign bullets_width_half = block_size
+  | minus: 1
+  | times: 14
+  | plus: 6
+  | divided_by: 2.0
+  | ceil
+%}
+{% assign btn_offset = bullets_width_half | plus: 14 | plus: 36 %}
+{% assign bullets_width_half_pc = block_size
+  | minus: 1
+  | times: 18
+  | plus: 6
+  | divided_by: 2.0
+  | ceil
+%}
+{% assign btn_offset_pc = bullets_width_half | plus: 18 | plus: 48 %}
+
+<style>
+  #shopify-section-{{section.id}} .zz-shopping-cart-list-slides {
+    padding: 96px 0;
+    width: 100%;
+    height: fit-content;
+    background: {{ section.settings.bg_color }};
+    letter-spacing: 0;
+  }
+  #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper {
+    padding: 0 2.3438vw;
+  }
+  @media screen and (min-width: 1280px) {
+    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper {
+      padding: 0 calc((100vw - 1220px) / 2);
+    }
+  }
+
+  #shopify-section-{{section.id}} .banner-item {
+    height: 424px;
+    width: 300px;
+  }
+
+  /* Mobile styles - Keep swiper functionality */
+  @media screen and (max-width: 1023px) {
+    #shopify-section-{{section.id}} .zz-shopping-cart-list-slides {
+      padding: 47px 0;
+    }
+    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper {
+      padding: 0 20px;
+    }
+    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-slide {
+      width: fit-content;
+      height: fit-content;
+    }
+    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-slide .banner-item {
+      background: {{ section.settings.banner_bg_color }};
+    }
+    #shopify-section-{{section.id}} .swiper-button-next,
+    #shopify-section-{{section.id}} .swiper-button-prev {
+      z-index: 99;
+      top: unset;
+      bottom: 0;
+      width: 36px;
+      height: 36px;
+    }
+    #shopify-section-{{section.id}} .swiper-button-prev {
+      left: 50%;
+      transform: translate(-{{ btn_offset }}px, 0px);
+    }
+    #shopify-section-{{section.id}} .swiper-button-next {
+      right: 50%;
+      transform: translate({{ btn_offset }}px, 0px);
+    }
+    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-pagination-bullets {
+      bottom: 9px;
+    }
+    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-pagination-bullets .swiper-pagination-bullet {
+      margin: 0 4px;
+      width: 6px;
+      height: 6px;
+      background-color: {{ section.settings.pagination_color }};
+      opacity: 0.5;
+    }
+  }
+
+  /* PC styles - Grid layout instead of swiper */
+  @media screen and (min-width: 1024px) {
+    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-wrapper {
+      display: grid !important;
+      grid-template-columns: repeat(3, 1fr);
+      gap: 24px;
+      transform: none !important;
+      max-width: 1200px;
+      margin: 0 auto;
+    }
+    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-slide {
+      width: auto !important;
+      margin: 0 !important;
+      height: fit-content;
+    }
+    #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-slide .banner-item {
+      position: relative;
+      height: 480px;
+      width: 380px;
+      background: {{ section.settings.banner_bg_color }};
+    }
+
+    /* Hide navigation elements on PC */
+    #shopify-section-{{section.id}} .swiper-button-next,
+    #shopify-section-{{section.id}} .swiper-button-prev,
+    #shopify-section-{{section.id}} .swiper-pagination {
+      display: none !important;
+    }
+
+    #shopify-section-{{section.id}} .content-title-h3 {
+      margin: 0 auto;
+      font-size: 60px;
+    }
+  }
+
+  /* Common styles for navigation elements */
+  #shopify-section-{{section.id}} .swiper-button-next:after,
+  #shopify-section-{{section.id}} .swiper-button-prev:after {
+    display: none;
+  }
+  #shopify-section-{{section.id}} .swiper-button-next.swiper-button-disabled,
+  #shopify-section-{{section.id}} .swiper-button-prev.swiper-button-disabled {
+    opacity: 0.5;
+  }
+  #shopify-section-{{section.id}} .zz-shopping-cart-list-swiper .swiper-pagination-bullets .swiper-pagination-bullet-active {
+    opacity: 1;
+  }
+</style>
+
+<div class='zz-shopping-cart-list-slides slow-reveal'>
+  {% if section.settings.title != blank %}
+    <div class='tw-px-[20px] tw-mb-[32px]'>
+      {% render 'zz-content-h3',
+        title_color: section.settings.title_color,
+        title: section.settings.title,
+        class_name: 'content-title-h3 lg:tw-text-center'
+      %}
+    </div>
+  {% endif %}
+  <div class='swiper zz-shopping-cart-list-swiper'>
+    <div class='swiper-wrapper'>
+      {% for block in section.blocks %}
+        <div class='swiper-slide {% if block_size > 1 %} max-lg:tw-pb-[60px]  {% endif %}'>
+          <div class='banner-item tw-rounded-[10px] lg:tw-rounded-[16px] tw-flex tw-flex-col tw-justify-between'>
+            <div class='tw-h-[168px] lg:tw-h-[214px] tw-overflow-hidden tw-rounded-t-[10px] lg:tw-rounded-t-[16px] tw-flex-shrink-0'>
+              {%- if block.settings.image != blank -%}
+                {{
+                  block.settings.image
+                  | image_url: width: 915
+                  | image_tag:
+                    alt: block.settings.slide_title,
+                    class: 'lg:tw-hidden tw-w-full tw-h-auto tw-object-contain'
+                }}
+              {% endif %}
+              {%- if block.settings.image_pc != blank -%}
+                {{
+                  block.settings.image_pc
+                  | image_url: width: 640
+                  | image_tag:
+                    alt: block.settings.slide_title,
+                    class: 'max-lg:tw-hidden tw-w-full tw-h-auto tw-object-contain'
+                }}
+              {% endif %}
+            </div>
+            <div class='tw-flex tw-flex-col tw-justify-between tw-px-[16px] lg:tw-px-[20px] tw-pt-[20px] lg:tw-pt-[30px] tw-pb-[20px] lg:tw-pb-[32px] tw-grow'>
+              <div class='tw-flex tw-flex-col tw-gap-[8px]'>
+                <p class='slide-content tw-text-[10px] lg:tw-text-[12px] tw-leading-[1.5] tw-text-left tw-text-black'>
+                  {{ block.settings.title_prefix }}
+                </p>
+                <p class='slide-title  tw-text-[16px]  lg:tw-text-[18px] tw-leading-[1.2] tw-text-left tw-font-bold tw-text-black'>
+                  {{ block.settings.slide_title }}
+                </p>
+                {% if block.settings.slide_content != blank %}
+                  <div class='slide-content tw-h-[45px] lg:tw-h-[72px]  tw-text-[12px] lg:tw-text-[14px] tw-leading-[1.5] tw-text-left tw-text-black'>
+                    {{ block.settings.slide_content }}
+                  </div>
+                {% endif %}
+              </div>
+
+              <div class='tw-flex tw-justify-between tw-flex-col tw-items-start max-lg:tw-gap-[12px] lg:tw-flex-row'>
+                {% assign product = all_products[block.settings.product] %}
+                {% assign variant_id = block.settings.variant_id | times: 1 %}
+                {% assign variant = product.variants
+                  | where: 'id', variant_id
+                  | first
+                %}
+                {% render 'zz-price-tag',
+                  price: variant.price,
+                  compare_at_price: variant.compare_at_price
+                %}
+                {% assign product_url = shop.url
+                  | append: product.url
+                  | append: '?variant='
+                  | append: variant.id
+                %}
+                {% render 'zz-button',
+                  text: block.settings.btn_text,
+                  href: product_url,
+                  type: 'primary-round',
+                  color: 'black',
+                  size: 'medium',
+                  class_name: 'tw-box-border tw-w-full lg:tw-w-auto'
+                %}
+              </div>
+            </div>
+          </div>
+        </div>
+      {% endfor %}
+    </div>
+    <!-- Navigation buttons - only show on mobile -->
+    <div class='swiper-button-prev {% if block_size <= 1 %} tw-hidden {% endif %}'>
+      {% if section.settings.prev_icon != blank %}
+        {{
+          section.settings.prev_icon
+          | image_url: width: 48
+          | image_tag:
+            alt: 'prev',
+            class: 'tw-w-full tw-h-full tw-object-contain'
+        }}
+      {% else %}
+        {% render 'zz-icon-prev' %}
+      {% endif %}
+    </div>
+    <div class='swiper-button-next {% if block_size <= 1 %} tw-hidden {% endif %}'>
+      {% if section.settings.next_icon != blank %}
+        {{
+          section.settings.next_icon
+          | image_url: width: 48
+          | image_tag:
+            alt: 'next',
+            class: 'tw-w-full tw-h-full tw-object-contain'
+        }}
+      {% else %}
+        {% render 'zz-icon-next' %}
+      {% endif %}
+    </div>
+
+    <!-- Pagination indicator - only show on mobile -->
+    <div class='swiper-pagination'></div>
+  </div>
+</div>
+
+<script>
+  document.addEventListener('DOMContentLoaded', function () {
+    const mobileMediaQuery = window.matchMedia('(max-width: 1023px)');
+    let swiperInstance = null;
+
+    function handleResponsiveSwiper(mediaQuery) {
+      if (mediaQuery.matches) {
+        // Mobile: Initialize Swiper
+        if (!swiperInstance) {
+          const spaceBetween = 8;
+          swiperInstance = new Swiper(
+            '#shopify-section-{{section.id}} .zz-shopping-cart-list-swiper',
+            {
+              initialSlide: 0,
+              slidesPerView: 'auto',
+              centeredSlides: true,
+              spaceBetween: spaceBetween,
+              navigation: {
+                nextEl: '#shopify-section-{{section.id}} .swiper-button-next',
+                prevEl: '#shopify-section-{{section.id}} .swiper-button-prev',
+              },
+              pagination: {
+                el: '#shopify-section-{{section.id}} .swiper-pagination',
+                clickable: true,
+              },
+              effect: 'slide',
+            }
+          );
+        }
+      } else {
+        // PC: Destroy Swiper completely
+        if (swiperInstance) {
+          swiperInstance.destroy(true, true);
+          swiperInstance = null;
+        }
+      }
+    }
+
+    // Initial check
+    handleResponsiveSwiper(mobileMediaQuery);
+
+    // Listen for window size changes
+    mobileMediaQuery.addEventListener('change', handleResponsiveSwiper);
+  });
+</script>
+
+{% schema %}
+{
+  "name": "Shopping Card List",
+  "settings": [
+    {
+      "type": "color",
+      "id": "bg_color",
+      "default": "#001630",
+      "label": "背景色"
+    },
+    {
+      "type": "image_picker",
+      "id": "top_flag",
+      "label": "顶部图标"
+    },
+    {
+      "type": "richtext",
+      "id": "title",
+      "label": "标题"
+    },
+    {
+      "type": "color",
+      "id": "title_color",
+      "default": "#FFFFFF",
+      "label": "标题颜色"
+    },
+    {
+      "type": "color",
+      "id": "banner_bg_color",
+      "default": "#0A1F38",
+      "label": "轮播卡片背景色"
+    },
+    {
+      "type": "color",
+      "id": "pagination_color",
+      "default": "#ffffff",
+      "label": "轮播导航圆圈颜色"
+    },
+    {
+      "type": "image_picker",
+      "id": "prev_icon",
+      "label": "轮播上一张图标"
+    },
+    {
+      "type": "image_picker",
+      "id": "next_icon",
+      "label": "轮播下一张图标"
+    }
+  ],
+  "blocks": [
+    {
+      "name": "Shopping Card",
+      "type": "zz-shopping-card-item",
+      "settings": [
+        {
+          "type": "image_picker",
+          "id": "image_pc",
+          "label": "Image"
+        },
+        {
+          "type": "image_picker",
+          "id": "image",
+          "label": "Image(mobile)"
+        },
+        {
+          "type": "text",
+          "id": "title_prefix",
+          "label": "标题前缀"
+        },
+        {
+          "type": "text",
+          "id": "slide_title",
+          "label": "标题"
+        },
+        {
+          "type": "richtext",
+          "id": "slide_content",
+          "label": "内容"
+        },
+        {
+          "type": "text",
+          "id": "btn_text",
+          "label": "按钮文字",
+          "default": "Buy Now"
+        },
+        {
+          "type": "product",
+          "id": "product",
+          "label": "Product",
+          "info": "选择产品"
+        },
+        {
+          "type": "text",
+          "id": "variant_id",
+          "label": "Variant ID",
+          "placeholder": "变体ID",
+          "info": "输入变体ID，变体ID可以在产品编辑页面查看"
+        }
+      ]
+    }
+  ],
+  "presets": [
+    {
+      "name": "Shopping Card List"
+    }
+  ]
+}
+{% endschema %}