Shopify中能否在Schema内创建可折叠分组设置？

可以在Shopify的Schema中创建可折叠的手风琴式设置面板，用来归类管理相关设置项，完全匹配你需要的分组效果。

实现方法（基于Online Store 2.0主题） #

在主题区块/section的Schema配置中，使用"type": "accordion"类型定义折叠面板，每个面板包含标题和对应的设置项数组。示例代码如下：

{
  "name": "自定义展示区块",
  "settings": [
    // 第一个可折叠面板：基础样式设置
    {
      "type": "accordion",
      "title": "基础样式设置",
      "settings": [
        {
          "type": "text",
          "id": "section_title",
          "label": "区块标题"
        },
        {
          "type": "color",
          "id": "title_color",
          "label": "标题颜色",
          "default": "#000000"
        },
        {
          "type": "font_picker",
          "id": "title_font",
          "label": "标题字体",
          "default": "helvetica_n4"
        }
      ]
    },
    // 第二个可折叠面板：高级布局设置
    {
      "type": "accordion",
      "title": "高级布局设置",
      "settings": [
        {
          "type": "select",
          "id": "layout_type",
          "label": "布局类型",
          "options": [
            { "value": "grid", "label": "网格布局" },
            { "value": "list", "label": "列表布局" }
          ],
          "default": "grid"
        },
        {
          "type": "range",
          "id": "item_gap",
          "label": "元素间距",
          "min": 10,
          "max": 60,
          "step": 5,
          "unit": "px",
          "default": 20
        }
      ]
    }
  ]
}

关键说明 #

• 每个accordion对象对应一个可折叠面板，title字段定义面板的显示标题，点击即可展开/折叠内部设置项。
• 面板内部的settings数组支持所有Shopify标准设置类型（文本、颜色、选择器、滑块、字体选择器等），按需添加即可。
• 该方案仅支持Shopify Online Store 2.0及以上版本主题，原生支持无需额外JS/CSS，稳定且符合Shopify后台交互规范。

内容的提问来源于stack exchange，提问作者Hiba abdel karim