Bricks Schema 中文文档：加入购物车

标签TAGS:

2026年8月30日

📄 原始资料（已截断） | 展开查看原始 JSON（product-add-to-cart.json）{ “$schema”: “https://json-schema.org/draft/2020-12/schema”, “$id”: “bricks://elements/product-add-to-cart”, “schemaVersion”: “2.3”, “type”: “object”, “title”: “Add to cart”, “description”: “Schema for Bricks Add to cart element”, “meta…

📄 原始资料（已截断） | 展开查看原始 JSON（product-add-to-cart.json）

{
  "$schema": "https://json-schema.org/draft/2020-12/schema",
  "$id": "bricks://elements/product-add-to-cart",
  "schemaVersion": "2.3",
  "type": "object",
  "title": "Add to cart",
  "description": "Schema for Bricks Add to cart element",
  "metadata": {
    "name": "product-add-to-cart",
    "category": "woocommerce_product",
    "tag": "div",
    "nestable": false
  },
  "settings": {
    "variationsTypography": {
      "label": "Typography",
      "css": [
        {
          "property": "font",
          "selector": "table.variations label"
        }
      ],
      "valueSchema": {
        "type": "object",
        "description": "Typography settings",
        "properties": {
          "font-family": {
            "type": "string"
          },
          "font-size": {
            "type": "string"
          },
          "font-weight": {
            "type": [
              "string",
              "integer"
            ]
          },
          "font-style": {
            "type": "string",
            "enum": [
              "normal",
              "italic",
              "oblique"
            ]
          },
          "line-height": {
            "type": "string"
          },
          "letter-spacing": {
            "type": "string"
          },
          "text-align": {
            "type": "string",
            "enum": [
              "left",
              "center",
              "right",
              "justify"
            ]
          },
          "text-transform": {
            "type": "string",
            "enum": [
              "none",
              "uppercase",
              "lowercase",
              "capitalize"
            ]
          },
          "text-decoration": {
            "type": "string"
          },
          "color": {
            "description": "Color value in various formats",
            "oneOf": [
              {
                "type": "object",
                "properties": {
                  "hex": {
                    "type": "string",
                    "pattern": "^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$"
                  }
                },
                "required": [
                  "hex"
                ]
              },
              {
                "type": "object",
                "properties": {
                  "rgb": {
                    "type": "string",
                    "pattern": "^rgba?\\("
                  }
                },
                "required": [
                  "rgb"
                ]
              },
              {
                "type": "object",
                "properties": {
                  "hsl": {
                    "type": "string",
                    "pattern": "^hsla?\\("
                  }
                },
                "required": [
                  "hsl"
                ]
              },
              {
                "type": "object",
                "properties": {
                  "raw": {
                    "type": "string",
                    "description": "Raw color value or CSS variable",
                    "descriptionZh": "原始颜色值或 CSS 变量。"
                  }
                },
                "required": [
                  "raw"
                ]
              }
            ],
            "descriptionZh": "各种格式的颜色值。"
          }
        },
        "descriptionZh": "排版设置。"
      },
      "controlType": "typography",
      "labelZh": "排版"
    },
    "variationsBackgroundColor": {
      "label": "Background color",
      "css": [
        {
          "property": "background-color",
          "selector": "table.variations tr"
        }
      ],
      "valueSchema": {
        "description": "Color value in various formats",
        "oneOf": [
          {
            "type": "object",
            "properties": {
              "hex": {
                "type": "string",
                "pattern": "^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$"
              }
            },
            "required": [
              "hex"
            ]
          },
          {
            "type": "object",
            "properties": {
              "rgb": {
                "type": "string",
                "pattern": "^rgba?\\("
              }
            },
            "required": [
              "rgb"
            ]
          },
          {
            "type": "object",
            "properties": {
              "hsl": {
                "type": "string",
                "pattern": "^hsla?\\("
              }
            },
            "required": [
              "hsl"
            ]
          },
          {
            "type": "object",
            "properties": {
              "raw": {
                "type": "string",
                "description": "Raw color value or CSS variable",
                "descriptionZh": "原始颜色值或 CSS 变量。"
              }
            },
            "required": [
              "raw"
            ]
          }
        ],
        "descriptionZh": "各种格式的颜色值。"
      },
      "controlType": "color",
      "labelZh": "背景颜色"
    },
    "variationsBorder": {
      "label": "Border",
      "css": [
        {
          "property": "border",
          "selector": ".cart .variations tr:not(:has(.reset_variations))"
        }
      ],
      "valueSchema": {
        "type": "object",
        "description": "Border settings",
        "properties": {
          "width": {
            "type": "object",
            "description": "Spacing value with directional properties",
            "properties": {
              "top": {
                "type": "string",
                "description": "Top spacing value with unit",
                "descriptionZh": "顶部间距值（带单位）。"
              },
              "right": {
                "type": "string",
                "description": "Right spacing value with unit",
                "descriptionZh": "右侧间距值（带单位）。"
              },
              "bottom": {
                "type": "string",
                "description": "Bottom spacing value with unit",
                "descriptionZh": "底部间距值（带单位）。"
              },
              "left": {
                "type": "string",
                "description": "Left spacing value with unit",
                "descriptionZh": "左侧间距值（带单位）。"
              }
            },
            "additionalProperties": false,
            "descriptionZh": "带方向属性的间距值。"
          },
          "style": {
            "type": "string",
            "enum": [
              "none",
              "solid",
              "dashed",
              "dotted",
              "double",
              "groove",
              "ridge",
              "inset",
              "outset"
            ]
          },
          "color": {
            "description": "Color value in various formats",
            "oneOf": [
              {
                "type": "object",
                "properties": {
                  "hex": {
                    "type": "string",
                    "pattern": "^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$"
                  }
                },
                "required": [
                  "hex"
                ]
              },
              {
                "type": "object",
                "properties": {
                  "rgb": {
                    "type": "string",
                    "pattern": "^rgba?\\("
                  }
                },
                "required": [
                  "rgb"
                ]
              },
              {
                "type": "object",
                "properties": {
                  "hsl": {
                    "type": "string",
                    "pattern": "^hsla?\\("
                  }
                },
                "required": [
                  "hsl"
                ]
              },
              {
                "type": "object",
                "properties": {
                  "raw": {
                    "type": "string",
                    "description": "Raw color value or CSS variable",
                    "descriptionZh": "原始颜色值或 CS

... (内容过长已截断，完整 JSON 见原始文件)

前言

Bricks Add to cart 元素的 schema。

基本信息

英文名称：Add to cart
中文名称：加入购物车
Schema ID：bricks://elements/product-add-to-cart
Schema 版本：2.3
类型：object
分类：woocommerce_product
Tag：div
内部名称：product-add-to-cart

设置项

variationsTypography — 排版 (typography)
variationsBackgroundColor — 背景颜色 (color)
variationsBorder — 边框 (border)
variationsMargin — 外边距 (spacing)
variationsPadding — 内边距 (spacing)
variationsDescriptionTypography — 描述排版 (typography)
variationsPriceTypography — 价格排版 (typography)
variationsRegularPriceTypography — 常规价格排版 (typography)
variationsSalePriceTypography — 促销价格排版 (typography)
swatchesWrap — 换行 (select)
swatchesDirection — 方向 (direction)
swatchesJustifyContent — 主轴对齐 (justify-content)
swatchesAlignItems — 交叉轴对齐 (align-items)
swatchesColumnGap — 列间距 (number)
swatchesRowGap — 行间距 (number)
colorSwatchSize — 尺寸 (number)
colorSwatchBorder — 边框 (border)
colorSwatchActiveBorder — 边框 (border)
labelSwatchPadding — 内边距 (spacing)
labelSwatchTypography — 排版 (typography)
labelSwatchActiveTypography — 排版 (typography)
labelSwatchBackgroundColor — 背景颜色 (color)
labelSwatchActiveBackgroundColor — 背景颜色 (color)
labelSwatchBorder — 边框 (border)
labelSwatchActiveBorder — 边框 (border)
imageSwatchWidth — 宽度 (number)
imageSwatchHeight — 高度 (number)
imageSwatchBorder — 边框 (border)
imageSwatchActiveBorder — 边框 (border)
swatchTooltipPadding — 内边距 (spacing)
swatchTooltip — 排版 (typography)
swatchTooltipBackground — 背景颜色 (color)
swatchTooltipBorder — 边框 (border)
hideStock — 隐藏库存 (checkbox)
stockTypography — 排版 (typography)
inStockTypography — 排版 (typography)
outOfStockTypography — 排版 (typography)
formDisplay — 显示 (select)
formFlexDirection — 方向 (direction)
formAlignSelf — 自身对齐 (align-items)
formJustifyContent — 主轴对齐 (justify-content)
formAlignItems — 交叉轴对齐 (align-items)
formGap — 间距 (number)
formFlexGrow — 放大比例 (number)
formFlexShrink — 缩小比例 (number)
formFlexBasis — 伸缩基准 (text)
quantityWidth — 宽度 (number)
quantityBackground — 背景 (color)
quantityBorder — 边框 (border)
buttonText — 简单产品 (text)
variableText — 可变产品 (text)
groupedText — 分组产品 (text)
externalText — 外部产品 (text)
buttonMargin — 外边距 (spacing)
buttonPadding — 内边距 (spacing)
buttonWidth — 宽度 (number)
buttonBackgroundColor — 背景颜色 (color)
buttonBorder — 边框 (border)
buttonTypography — 排版 (typography)
icon — 图标 (icon)
iconTypography — 图标排版 (typography)
iconOnly — 仅图标 (checkbox)
iconPosition — 图标位置 (select)
groupedProductTablePadding — 表格单元格 (spacing)
groupedProductQuantityWidth — 宽度 (number)
groupedProductQuantityBackground — 背景 (color)
groupedProductQuantityBorder — 边框 (border)
groupedProductLabelTypography — 排版 (typography)
groupedProductStockTypography — 排版 (typography)
groupedProductInStockTypography — 排版 (typography)
groupedProductOutOfStockTypography — 排版 (typography)
groupedProductPriceTypography — 排版 (typography)
groupedProductSalePriceTypography — 促销价格排版 (typography)
groupedProductRegularPriceTypography — 常规价格排版 (typography)
groupedProductButtonWidth — 宽度 (number)
groupedProductButtonPadding — 内边距 (spacing)
groupedProductButtonTypography — 排版 (typography)
groupedProductButtonBackground — 背景颜色 (color)
addingButtonText — 按钮文本 (text)
addingButtonIcon — 图标 (icon)
addingButtonIconOnly — 仅图标 (checkbox)
addingButtonIconPosition — 图标位置 (select)
addingButtonIconSpinning — 图标旋转 (checkbox)
addedButtonText — 按钮文本 (text)
resetTextAfter — 秒后重置文本 (number)
addedButtonIcon — 图标 (icon)
addedButtonIconOnly — 仅图标 (checkbox)
addedButtonIconPosition — 图标位置 (select)
showNotice — 显示通知 (select)
scrollToNotice — 滚动到通知 (select)
hideViewCart — 隐藏“查看购物车”按钮 (select)
_content — 内容 (text)
_margin — 外边距 (spacing)
_padding — 内边距 (spacing)
_width — 宽度 (number)
_widthMin — 最小宽度 (number)
_widthMax — 最大宽度 (number)
_height — 高度 (number)
_heightMin — 最小高度 (number)
_heightMax — 最大高度 (number)
_aspectRatio — 宽高比 (text)
_position — 位置 (select)
_top — 顶部 (number)
_right — 右侧 (number)
_bottom — 底部 (number)
_left — 左侧 (number)
_zIndex — Z 索引 (number)
_order — 顺序 (number)
_display — 显示 (select)
_visibility — 可见性 (select)
_overflow — 溢出 (text)
_opacity — 不透明度 (number)
_cursor — 光标 (select)
_isolation — 隔离 (select)
_mixBlendMode — 混合模式 (select)
_pointerEvents — 指针事件 (text)
_perspective — 透视 (number)
_perspectiveOrigin — 透视原点 (text)
_gridItemJustifySelf — 自身水平对齐 (align-items)
_flexDirection — 方向 (direction)
_alignSelf — 自身对齐 (align-items)
_justifyContent — 主轴对齐 (justify-content)
_alignItems — 交叉轴对齐 (align-items)
_gap — 间距 (number)
_flexGrow — 放大比例 (number)
_flexShrink — 缩小比例 (number)
_flexBasis — 伸缩基准 (text)
_useMasonry — %s 布局 (checkbox)
_masonryColumn — 列数 (number)
_masonryGutter — 间距 (number)
_masonryHorizontalOrder — 水平顺序 (checkbox)
_masonryTransitionDuration — 过渡 (number)
_masonryTransitionMode — 显现动画 (select)
_typography — _typography (typography)
_background — _background (background)
_shapeDividers — 自定义形状 (repeater)
_gradient — _gradient (gradient)
_border — 边框 (border)
_boxShadow — 盒子阴影 (box-shadow)
_transform — 变换 (transform)
_transformOrigin — 变换原点 (text)
_motionElementParallax — 元素视差 (checkbox)
_motionElementParallaxSpeedX — 水平速度 (number)
_motionElementParallaxSpeedY — 垂直速度 (number)
_motionBackgroundParallax — 背景视差 (checkbox)
_motionBackgroundParallaxSpeed — 背景速度 (number)
_motionStartVisiblePercent — 视差起点 (number)
_cssCustom — 自定义 CSS (code)
_cssClasses — CSS 类 (text)
_cssId — CSS ID (text)
_cssFilters — CSS 滤镜 (filters)
_cssTransition — 过渡 (text)
_attributes — 姓名 (repeater)
_scrollSnapType — 类型 (select)
_scrollSnapAlign — 对齐 (select)
_scrollSnapStop — 停止 (select)

补充说明

更多细节可参考 Bricks 官方 Academy 文档。