title: "Blocks 参考" post_status: publish comment_status: open taxonomy: category: - woocommerce post_tag: - Reference - Block Development - Repos

Blocks 参考

本页面列出了该包中包含的 Woo 组件。 (由于仍有一些组件尚未采用 block.json 定义，因此此列表可能不完整)。

产品平均评分 (Beta) - woocommerce/product-average-rating

显示产品的平均评分。

• Name: woocommerce/product-average-rating
• Category: woocommerce-product-elements
• Ancestor: woocommerce/single-product
• Parent:
• Supports: color (背景, 文本), interactivity (clientNavigation), spacing (间距, padding), typography (fontSize)
• Attributes: textAlign

加入购物车 按钮 - woocommerce/product-button

显示一个行动按钮，该按钮可以将产品添加到购物车，或者链接到产品页面。

• Name: woocommerce/product-button
• Category: woocommerce-product-elements
• Ancestor: woocommerce/all-products, woocommerce/single-product, core/post-template, woocommerce/product-template
• Parent:
• Supports: align (full, wide), color (背景, 文本, ~~链接~~), email, interactivity, spacing (间距, padding), typography (fontSize, lineHeight), ~~html~~
• Attributes: isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, productId, textAlign, width

产品 图像 - woocommerce/product-image

显示主要的产品图像。

• Name: woocommerce/product-image
• Category: woocommerce-product-elements
• Ancestor: woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
• Parent:
• Supports: dimensions (aspectRatio), email, interactivity (clientNavigation), spacing (间距, padding), typography (fontSize), ~~html~~
• Attributes: aspectRatio, height, imageSizing, isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, productId, saleBadgeAlign, scale, showProductLink, showSaleBadge, width

产品价格 - woocommerce/product-price

显示产品的价格。

• Name: woocommerce/product-price
• Category: woocommerce-product-elements
• Ancestor: woocommerce/all-products, woocommerce/featured-product, woocommerce/single-product, woocommerce/product-template, core/post-template
• Parent:
• Supports: color (背景, 文本, ~~链接~~), email, interactivity, spacing (间距, padding), typography (fontSize, lineHeight), ~~html~~
• Attributes: isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign

产品 图像 库 - woocommerce/product-image-gallery

显示产品的图像。

• Name: woocommerce/product-image-gallery
• Category: woocommerce-product-elements
• Ancestor:
• Parent:
• Supports: align, interactivity (clientNavigation), ~~multiple~~
• Attributes:

产品元数据 - woocommerce/product-meta

显示产品的 SKU、分类、标签等信息。

• 名称: woocommerce/product-meta
• 分类: woocommerce-product-elements
• 父级:
• 祖先:
• 支持: 对齐, 交互 (clientNavigation), ~~可复用~~
• 属性:

产品评分 - woocommerce/product-rating

显示产品的平均评分。

• 名称: woocommerce/product-rating
• 分类: woocommerce-product-elements
• 父级: woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
• 祖先:
• 支持: 颜色 (文本, ~~背景~~, ~~链接~~), 交互 (clientNavigation), 间距 (外边距, 内边距), 排版 (字体大小)
• 属性: isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign

产品评分计数器 - woocommerce/product-rating-counter

显示产品的评论数量。

• 名称: woocommerce/product-rating-counter
• 分类: woocommerce-product-elements
• 父级: woocommerce/single-product
• 祖先:
• 支持: 颜色 (链接, ~~背景~~, ~~文本~~), 交互 (clientNavigation), 间距 (外边距, 内边距), 排版 (字体大小), ~~插入器~~
• 属性: isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign

产品评分星级 - woocommerce/product-rating-stars

使用星级显示产品的平均评分。

• 名称: woocommerce/product-rating-stars
• 分类: woocommerce-product-elements
• 父级: woocommerce/single-product
• 祖先:
• 支持: 颜色 (文本, ~~背景~~, ~~链接~~), 交互 (clientNavigation), 间距 (外边距, 内边距), 排版 (字体大小), ~~插入器~~
• 属性: isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign

相关产品 - woocommerce/related-products

显示相关产品。

• 名称: woocommerce/related-products
• 分类: woocommerce
• 父级:
• 祖先:
• 支持: 对齐, 交互 (clientNavigation), ~~插入器~~, ~~可复用~~
• 属性:

促销徽章 - woocommerce/product-sale-badge

如果产品正在促销，则显示促销徽章。

• 名称: woocommerce/product-sale-badge
• 分类: woocommerce-product-elements
• 父级: woocommerce/single-product, woocommerce/product-template, core/post-template, woocommerce/product-gallery
• 祖先:
• 支持: 对齐, 颜色 (背景, 渐变, 文本, ~~链接~~), 邮件, 交互 (clientNavigation), 间距 (外边距), 排版 (字体大小, 行高), ~~HTML~~
• 属性: isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId

产品 SKU - woocommerce/product-sku

显示产品的 SKU。

• 名称: woocommerce/product-sku
• 分类: woocommerce-product-elements
• 父级: woocommerce/product-meta, woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
• 父类:
• 支持: 颜色 (背景, 文本), 交互 (clientNavigation), 间距 (margin, padding), 排版 (fontSize, lineHeight), ~~html~~
• 属性: isDescendantOfAllProducts, prefix, productId, showProductSelector, suffix

产品库存指示器 - woocommerce/product-stock-indicator

告知顾客产品是否缺货或处于延期交货状态。 当产品有库存时，此块将被隐藏。

• 名称: woocommerce/product-stock-indicator
• 分类: woocommerce-product-elements
• 父级: woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
• 父类:
• 支持: 颜色 (背景, 文本), 交互, 间距 (margin, padding), 排版 (fontSize, lineHeight), ~~html~~
• 属性: isDescendantOfAllProducts

产品摘要 - woocommerce/product-summary

显示关于产品的简短描述。

• 名称: woocommerce/product-summary
• 分类: woocommerce-product-elements
• 父级: woocommerce/all-products, woocommerce/featured-product, woocommerce/single-product, woocommerce/product-template, core/post-template
• 父类:
• 支持: 颜色 (背景, 链接, 文本), 交互 (clientNavigation), 间距 (margin, padding), 排版 (fontSize, lineHeight, textAlign)
• 属性: isDescendantOfAllProducts, isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, linkText, productId, showDescriptionIfEmpty, showLink, summaryLength

产品标题 - woocommerce/product-title

显示产品的标题。

• 名称: woocommerce/product-title
• 分类: woocommerce-product-elements
• 父级: woocommerce/all-products
• 父类:
• 支持: 颜色 (背景, 渐变, 文本, ~~链接~~), 交互 (~~clientNavigation~~), 间距 (margin), 排版 (fontSize, lineHeight), ~~html~~
• 属性: align, headingLevel, linkTarget, productId, showProductLink

折叠组 - woocommerce/accordion-group

一组标题和相关的可展开内容。

• 名称: woocommerce/accordion-group
• 分类: woocommerce
• 父级:
• 父类:
• 支持: 对齐 (full, wide), 背景 (backgroundImage, backgroundSize), 颜色 (背景, 渐变, 文本), 交互, 布局, 阴影, 间距 (blockGap, margin, padding), ~~html~~
• 属性: allowedBlocks, autoclose, iconPosition

折叠标题 - woocommerce/accordion-header

折叠标题。

• Name: woocommerce/accordion-header
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/accordion-item
• Supports: anchor, border, color (background, gradient, text), interactivity, layout, shadow, spacing (margin, padding), typography (fontSize, textAlign), ~~align~~
• Attributes: icon, iconPosition, level, levelOptions, openByDefault, textAlignment, title

折叠 - woocommerce/accordion-item

一个单独的折叠组件，用于显示标题和可展开的内容。

• Name: woocommerce/accordion-item
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/accordion-group
• Supports: align (full, wide), color (background, gradient, text), interactivity, layout, shadow, spacing (blockGap, margin)
• Attributes: openByDefault

折叠面板 - woocommerce/accordion-panel

折叠面板

• Name: woocommerce/accordion-panel
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/accordion-item
• Supports: border, color (background, gradient, text), interactivity, layout, shadow, spacing (blockGap, margin, padding), typography (fontSize, lineHeight)
• Attributes: allowedBlocks, isSelected, openByDefault, templateLock

激活过滤器控件 - woocommerce/active-filters

显示当前激活的过滤器。

• Name: woocommerce/active-filters
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: color (text, ~~background~~), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
• Attributes: displayStyle, headingLevel

加入购物车 + 选项 (Beta) - woocommerce/add-to-cart-with-options

使用块来创建“加入购物车”区域，该区域针对不同类型的产品进行定制，例如可变产品和分组产品。

• Name: woocommerce/add-to-cart-with-options
• Category: woocommerce-product-elements
• Ancestor:
• Parent:
• Supports: interactivity
• Attributes: isDescendantOfAddToCartWithOptions

分组产品选择器 (Beta) - woocommerce/add-to-cart-with-options-grouped-product-selector

显示一组可以添加到购物车的的产品。

• Name: woocommerce/add-to-cart-with-options-grouped-product-selector
• Category: woocommerce-product-elements
• Ancestor: woocommerce/add-to-cart-with-options
• Parent:
• Supports: interactivity
• Attributes:

分组产品：模板 (Beta) - woocommerce/add-to-cart-with-options-grouped-product-item

一个列表项目模板，代表分组产品选择器块中的子产品。

• Name: woocommerce/add-to-cart-with-options-grouped-product-item
• Category: woocommerce-product-elements
• Ancestor: woocommerce/add-to-cart-with-options-grouped-product-selector
• Parent:
• Supports: interactivity, ~~inserter~~
• Attributes:

分组产品：项目标签 (Beta) - woocommerce/add-to-cart-with-options-grouped-product-item-label

以标签或段落的形式显示产品标题。

• 名称: woocommerce/add-to-cart-with-options-grouped-product-item-label
• 分类: woocommerce-product-elements
• 父级: woocommerce/add-to-cart-with-options-grouped-product-item
• 父类:
• 支持: color (background, gradients, text), layout (selfStretch), spacing (blockGap, margin, padding), typography (fontSize, lineHeight, textAlign), ~~html~~
• 属性:

分组产品：项目选择器 (Beta) - woocommerce/add-to-cart-with-options-grouped-product-item-selector

添加一种在分组产品块中选择子产品的机制。根据产品的类型及其属性，这可能是一个按钮、复选框或链接。

• 名称: woocommerce/add-to-cart-with-options-grouped-product-item-selector
• 分类: woocommerce-product-elements
• 父级: woocommerce/add-to-cart-with-options-grouped-product-item
• 父类:
• 支持: interactivity, ~~inserter~~
• 属性:

产品数量 (Beta) - woocommerce/add-to-cart-with-options-quantity-selector

显示一个输入字段，客户可以使用该字段选择要添加到购物车的产品的数量。

• 名称: woocommerce/add-to-cart-with-options-quantity-selector
• 分类: woocommerce-product-elements
• 父级: woocommerce/add-to-cart-with-options
• 父类:
• 支持: interactivity
• 属性:

变体描述 (Beta) - woocommerce/add-to-cart-with-options-variation-description

显示所选变体的描述。

• 名称: woocommerce/add-to-cart-with-options-variation-description
• 分类: woocommerce
• 父级: woocommerce/add-to-cart-with-options
• 父类:
• 支持: color (background, gradients, link, text), dimensions (minHeight), interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
• 属性:

变体选择器：模板 (Beta) - woocommerce/add-to-cart-with-options-variation-selector-attribute

一个用于属性名称和选项的模板，该模板将应用于所有具有属性的可变产品。

• 名称: woocommerce/add-to-cart-with-options-variation-selector-attribute
• 分类: woocommerce-product-elements
• 父级: woocommerce/add-to-cart-with-options-variation-selector
• 父类:
• 支持: interactivity, ~~inserter~~
• 属性:

可变产品属性选择器：属性名称 (Beta) - woocommerce/add-to-cart-with-options-variation-selector-attribute-name

格式化与可变产品关联的属性名称。

• 名称: woocommerce/add-to-cart-with-options-variation-selector-attribute-name
• 分类: woocommerce-product-elements
• 父元素: woocommerce/add-to-cart-with-options-variation-selector-attribute
• 父级:
• 支持: color (背景, 渐变, 文本), 交互性, 间距 (内边距), 排版 (fontSize, lineHeight), ~~alignWide~~, ~~align~~, ~~inserter~~
• 属性:

可变产品属性选择器：属性选项 (Beta) - woocommerce/add-to-cart-with-options-variation-selector-attribute-options

显示与可变产品关联的属性选项。

• 名称: woocommerce/add-to-cart-with-options-variation-selector-attribute-options
• 分类: woocommerce-product-elements
• 父元素: woocommerce/add-to-cart-with-options-variation-selector-attribute
• 父级:
• 支持: 交互性, ~~inserter~~
• 属性: optionStyle

可变产品属性选择器 (Beta) - woocommerce/add-to-cart-with-options-variation-selector

显示可供选择的产品变体，并允许用户加入购物车。

• 名称: woocommerce/add-to-cart-with-options-variation-selector
• 分类: woocommerce-product-elements
• 父元素: woocommerce/add-to-cart-with-options
• 父级:
• 支持: 交互性
• 属性:

属性筛选控件 - woocommerce/attribute-filter

允许客户通过选择一个或多个属性（例如颜色）来筛选产品列表。

• 名称: woocommerce/attribute-filter
• 分类: woocommerce
• 父元素:
• 父级:
• 支持: color (文本, ~~背景~~), ~~html~~, ~~inserter~~, ~~interactivity~~, ~~lock~~
• 属性: attributeId, className, displayStyle, headingLevel, isPreview, queryType, selectType, showCounts, showFilterButton

商店面包屑 - woocommerce/breadcrumbs

帮助客户跟踪他们在商店中的位置，并返回到父级网页。

• 名称: woocommerce/breadcrumbs
• 分类: woocommerce
• 父元素:
• 父级:
• 支持: align (full, wide), color (链接, 文本, ~~背景~~), 交互性 (clientNavigation), 排版 (fontSize, lineHeight), ~~html~~
• 属性: align, contentJustification, fontSize

已接受的付款方式 - woocommerce/cart-accepted-payment-methods-block

显示已接受的付款方式。

• 名称: woocommerce/cart-accepted-payment-methods-block
• 分类: woocommerce
• 父元素:
• 父级: woocommerce/cart-totals-block
• 支持: inserter, ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
• 属性:

购物车交叉销售 - woocommerce/cart-cross-sells-block

显示交叉销售模块。

• Name: woocommerce/cart-cross-sells-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/cart-items-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~multiple~~, ~~reusable~~
• Attributes:

购物车交叉销售产品 - woocommerce/cart-cross-sells-products-block

显示交叉销售产品。

• Name: woocommerce/cart-cross-sells-products-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/cart-cross-sells-block
• Supports: email, ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: columns, lock

快速结账 - woocommerce/cart-express-payment-block

允许客户通过快速支付选项轻松完成购物。

• Name: woocommerce/cart-express-payment-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/cart-totals-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: buttonBorderRadius, buttonHeight, lock, showButtonStyles

购物车商品 - woocommerce/cart-items-block

包含购物车商品的列。

• Name: woocommerce/cart-items-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/filled-cart-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: lock

购物车商品明细 - woocommerce/cart-line-items-block

包含购物车当前商品明细的模块。

• Name: woocommerce/cart-line-items-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/cart-items-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: lock

订单摘要 - woocommerce/cart-order-summary-block

向客户显示其订单的摘要。

• Name: woocommerce/cart-order-summary-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/cart-totals-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: lock

优惠券表单 - woocommerce/cart-order-summary-coupon-form-block

显示应用优惠券的表单。

• Name: woocommerce/cart-order-summary-coupon-form-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/cart-order-summary-block
• Supports: ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
• Attributes: className, lock

折扣 - woocommerce/cart-order-summary-discount-block

显示购物车折扣行。

• Name: woocommerce/cart-order-summary-discount-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/cart-order-summary-totals-block
• Supports: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: className, lock

Fees - woocommerce/cart-order-summary-fee-block

显示购物车费用行。

• Name: woocommerce/cart-order-summary-fee-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/cart-order-summary-totals-block
• Supports: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

Heading - woocommerce/cart-order-summary-heading-block

显示标题行。

• Name: woocommerce/cart-order-summary-heading-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/cart-order-summary-block
• Supports: ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
• 属性: className, content, lock

Shipping - woocommerce/cart-order-summary-shipping-block

显示购物车配送行。

• Name: woocommerce/cart-order-summary-shipping-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/cart-order-summary-totals-block
• Supports: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: lock

Subtotal - woocommerce/cart-order-summary-subtotal-block

显示购物车小计行。

• Name: woocommerce/cart-order-summary-subtotal-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/cart-order-summary-totals-block
• Supports: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

Taxes - woocommerce/cart-order-summary-taxes-block

显示购物车税费行。

• Name: woocommerce/cart-order-summary-taxes-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/cart-order-summary-totals-block
• Supports: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

Totals - woocommerce/cart-order-summary-totals-block

显示小计、费用、折扣、配送和税费。

• Name: woocommerce/cart-order-summary-totals-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/cart-order-summary-block
• Supports: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

Cart Totals - woocommerce/cart-totals-block

包含购物车总计的列。

• Name: woocommerce/cart-totals-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/filled-cart-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: checkbox, lock, text

Empty Cart - woocommerce/empty-cart-block

包含在购物车为空时显示的块。

• Name: woocommerce/empty-cart-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/cart
• Supports: align (wide), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: lock

购物车内容 - woocommerce/filled-cart-block

包含在购物车包含产品时显示的模块。

• Name: woocommerce/filled-cart-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/cart
• Supports: align (wide), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: lock

继续结账 - woocommerce/proceed-to-checkout-block

允许客户继续结账。

• Name: woocommerce/proceed-to-checkout-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/cart-totals-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: lock

购物车链接 - woocommerce/cart-link

显示链接至购物车的链接。

• Name: woocommerce/cart-link
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: color (background, link, ~~text~~), interactivity (clientNavigation), spacing (padding), typography (fontSize), ~~html~~, ~~multiple~~
• Attributes: cartIcon, content, isPreview

产品分类排序 - woocommerce/catalog-sorting

允许客户更改产品的排序顺序。

• Name: woocommerce/catalog-sorting
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize)
• Attributes: fontSize, useLabel

产品分类描述 - woocommerce/category-description

显示当前的分类描述。

• Name: woocommerce/category-description
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: color (background, text), spacing (margin, padding), typography, ~~align~~, ~~html~~
• Attributes: textAlign

产品分类标题 - woocommerce/category-title

显示当前的分类标题，并允许授权用户编辑它。

• Name: woocommerce/category-title
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: color (background, text), spacing (margin, padding), typography, ~~align~~, ~~html~~
• Attributes: isLink, level, linkTarget, rel, textAlign

结账 - woocommerce/checkout

显示结账表单，以便您的客户可以提交订单。

• Name: woocommerce/checkout
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (wide), ~~html~~, ~~multiple~~
• Attributes: align, isPreview, showFormStepNumbers

操作 - woocommerce/checkout-actions-block

允许客户提交他们的订单。

• Name: woocommerce/checkout-actions-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: cartPageId, className, lock, priceSeparator, showReturnToCart

其他信息 - woocommerce/checkout-additional-information-block

在 '其他信息' 的位置渲染附加字段。

• Name: woocommerce/checkout-additional-information-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

账单地址 - woocommerce/checkout-billing-address-block

收集客户的账单地址。

• Name: woocommerce/checkout-billing-address-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: lock

联系信息 - woocommerce/checkout-contact-information-block

收集客户的联系信息。

• Name: woocommerce/checkout-contact-information-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: lock

快捷结账 - woocommerce/checkout-express-payment-block

允许客户通过快速支付选项简化结账流程。

• Name: woocommerce/checkout-express-payment-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: buttonBorderRadius, buttonHeight, className, lock, showButtonStyles

结账字段 - woocommerce/checkout-fields-block

包含结账地址字段的列。

• Name: woocommerce/checkout-fields-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/checkout
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

订单备注 - woocommerce/checkout-order-note-block

允许客户向他们的订单添加备注。

• Name: woocommerce/checkout-order-note-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

订单摘要 - woocommerce/checkout-order-summary-block

向客户展示他们订单的摘要。

• Name: woocommerce/checkout-order-summary-block
• 分类: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-totals-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: lock

购物车项目 - woocommerce/checkout-order-summary-cart-items-block

显示购物车项目。

• 名称: woocommerce/checkout-order-summary-cart-items-block
• 分类: woocommerce
• 父级:
• 父类: woocommerce/checkout-order-summary-block
• 支持: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, disableProductDescriptions, lock

优惠券表单 - woocommerce/checkout-order-summary-coupon-form-block

显示应用优惠券的表单。

• 名称: woocommerce/checkout-order-summary-coupon-form-block
• 分类: woocommerce
• 父级:
• 父类: woocommerce/checkout-order-summary-block
• 支持: ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

折扣 - woocommerce/checkout-order-summary-discount-block

显示购物车折扣行。

• 名称: woocommerce/checkout-order-summary-discount-block
• 分类: woocommerce
• 父级:
• 父类: woocommerce/checkout-order-summary-totals-block
• 支持: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

费用 - woocommerce/checkout-order-summary-fee-block

显示购物车费用行。

• 名称: woocommerce/checkout-order-summary-fee-block
• 分类: woocommerce
• 父级:
• 父类: woocommerce/checkout-order-summary-totals-block
• 支持: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

配送 - woocommerce/checkout-order-summary-shipping-block

显示购物车配送行。

• 名称: woocommerce/checkout-order-summary-shipping-block
• 分类: woocommerce
• 父级:
• 父类: woocommerce/checkout-order-summary-totals-block
• 支持: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: lock

小计 - woocommerce/checkout-order-summary-subtotal-block

显示购物车小计行。

• 名称: woocommerce/checkout-order-summary-subtotal-block
• 分类: woocommerce
• 父级:
• 父类: woocommerce/checkout-order-summary-totals-block
• 支持: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

税费 - woocommerce/checkout-order-summary-taxes-block

显示购物车税费行。

• 名称: woocommerce/checkout-order-summary-taxes-block
• 分类: woocommerce
• 父级:
• 父类: woocommerce/checkout-order-summary-totals-block
• 支持: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

总计 - woocommerce/checkout-order-summary-totals-block

显示小计、费用、折扣、配送和税费。

• 名称: woocommerce/checkout-order-summary-totals-block
• 分类: woocommerce
• 父级:
• 父类: woocommerce/checkout-order-summary-block
• 支持: ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: className, lock

支付方式 - woocommerce/checkout-payment-block

您商店的支付方式。

• Name: woocommerce/checkout-payment-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: lock

取货方式 - woocommerce/checkout-pickup-options-block

显示本地自提的位置。

• Name: woocommerce/checkout-pickup-options-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: lock

收货地址 - woocommerce/checkout-shipping-address-block

收集客户的收货地址。

• Name: woocommerce/checkout-shipping-address-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: lock

配送方式 - woocommerce/checkout-shipping-method-block

选择配送或本地自提。

• Name: woocommerce/checkout-shipping-method-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: lock

配送选项 - woocommerce/checkout-shipping-methods-block

显示您商店的配送选项和运费。

• Name: woocommerce/checkout-shipping-methods-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: lock

条款和条件 - woocommerce/checkout-terms-block

确保客户同意您的条款和条件以及隐私政策。

• Name: woocommerce/checkout-terms-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/checkout-fields-block
• Supports: ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
• Attributes: checkbox, className, showSeparator, text

订单总计 - woocommerce/checkout-totals-block

包含订单总计的列。

• Name: woocommerce/checkout-totals-block
• Category: woocommerce
• Ancestor:
• Parent: woocommerce/checkout
• Supports: ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• Attributes: checkbox, className, text

经典短代码 - woocommerce/classic-shortcode

渲染经典 WooCommerce 短代码。

• Name: woocommerce/classic-shortcode
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align, inserter, interactivity (~~clientNavigation~~), ~~html~~, ~~multiple~~, ~~reusable~~
• Attributes: align, shortcode

即将推出 - woocommerce/coming-soon

• Name: woocommerce/coming-soon
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: color (背景, 文本), ~~插入器~~
• Attributes: color, comingSoonPatternId, storeOnly

客户账户 - woocommerce/customer-account

一个允许您的客户登录和退出您商店账户的块。

• Name: woocommerce/customer-account
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align, color (背景, 文本), interactivity (客户端导航), spacing (边距, 内边距), typography (字体大小)
• Attributes: displayStyle, iconClass, iconStyle

邮件内容 - woocommerce/email-content

一个用于邮件内容的占位符块。

• Name: woocommerce/email-content
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: email, ~~插入器~~
• Attributes: emailType, postId

推荐分类 - woocommerce/featured-category

视觉上突出显示一个产品分类，并鼓励用户立即采取行动。

• Name: woocommerce/featured-category
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (全屏, 宽屏), ariaLabel, color (背景, 文本), filter (双色), interactivity (客户端导航), spacing (内边距), ~~HTML~~
• Attributes: alt, categoryId, contentAlign, dimRatio, focalPoint, hasParallax, imageFit, isRepeated, linkText, mediaId, mediaSrc, minHeight, overlayColor, overlayGradient, previewCategory

推荐产品 - woocommerce/featured-product

突出显示一个产品或变体。

• Name: woocommerce/featured-product
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (全屏, 宽屏), ariaLabel, color (背景, 文本), filter (双色), interactivity (客户端导航), multiple, spacing (内边距), ~~HTML~~
• Attributes: alt, contentAlign, dimRatio, focalPoint, hasParallax, imageFit, isRepeated, linkText, mediaId, mediaSrc, minHeight, overlayColor, overlayGradient, previewProduct, productId

筛选块 - woocommerce/filter-wrapper

• Name: woocommerce/filter-wrapper
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: interactivity (客户端导航), ~~插入器~~
• Attributes: filterType, heading

精选产品 - woocommerce/handpicked-products

以网格形式显示精选产品。

• Name: woocommerce/handpicked-products
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (全屏, 宽屏), interactivity (客户端导航), ~~HTML~~, ~~插入器~~
• Attributes: align, alignButtons, columns, contentVisibility, isPreview, orderby, products

Mini-Cart - woocommerce/mini-cart

显示一个按钮，方便购物者快速查看购物车。

• 名称: woocommerce/mini-cart
• 分类: woocommerce
• 父级:
• 祖父级:
• 支持: 间距 (margin, padding), 字体 (fontSize), ~~HTML~~, ~~多选~~
• 属性: addToCartBehaviour, cartAndCheckoutRenderStyle, hasHiddenPrice, iconColor, iconColorValue, isPreview, miniCartIcon, onCartClickBehaviour, priceColor, priceColorValue, productCountColor, productCountColorValue, productCountVisibility

Mini-Cart 内容 - woocommerce/mini-cart-contents

显示一个迷你购物车组件。

• 名称: woocommerce/mini-cart-contents
• 分类: woocommerce
• 父级:
• 祖父级:
• 支持: 颜色 (背景, 链接, 文本), ~~对齐~~, ~~HTML~~, ~~插入器~~, ~~锁定~~, ~~多选~~, ~~可重用~~
• 属性: isPreview, lock, 宽度

迷你购物车为空时的视图 - woocommerce/empty-mini-cart-contents-block

当迷你购物车为空时显示的块。

• 名称: woocommerce/empty-mini-cart-contents-block
• 分类: woocommerce
• 父级:
• 祖父级: woocommerce/mini-cart-contents
• 支持: 交互性, ~~对齐~~, ~~HTML~~, ~~插入器~~, ~~锁定~~, ~~多选~~, ~~可重用~~
• 属性: lock

迷你购物车已填充时的视图 - woocommerce/filled-mini-cart-contents-block

包含显示迷你购物车内容的块。

• 名称: woocommerce/filled-mini-cart-contents-block
• 分类: woocommerce
• 父级:
• 祖父级: woocommerce/mini-cart-contents
• 支持: 交互性, ~~对齐~~, ~~HTML~~, ~~插入器~~, ~~锁定~~, ~~多选~~, ~~可重用~~
• 属性: lock

迷你购物车“查看购物车”按钮 - woocommerce/mini-cart-cart-button-block

当迷你购物车包含产品时，显示购物车按钮的块。

• 名称: woocommerce/mini-cart-cart-button-block
• 分类: woocommerce
• 父级:
• 祖父级: woocommerce/mini-cart-footer-block
• 支持: 颜色 (背景, 文本), 插入器, 交互性 (clientNavigation), ~~对齐~~, ~~HTML~~, ~~多选~~, ~~可重用~~
• 属性: cartButtonLabel, lock

迷你购物车“继续结账”按钮 - woocommerce/mini-cart-checkout-button-block

当迷你购物车包含产品时，显示结账按钮的块。

• 名称: woocommerce/mini-cart-checkout-button-block
• 分类: woocommerce
• 父级:
• 祖父级: woocommerce/mini-cart-footer-block
• 支持: 颜色 (背景, 文本), 插入器, 交互性 (clientNavigation), ~~对齐~~, ~~HTML~~, ~~多选~~, ~~可重用~~
• 属性: checkoutButtonLabel, lock

Mini-Cart 底部 - woocommerce/mini-cart-footer-block

显示 Mini-Cart 块的底部的块。

• 名称: woocommerce/mini-cart-footer-block
• 分类: woocommerce
• 父级:
• 父块: woocommerce/filled-mini-cart-contents-block
• 支持: 交互性, ~~对齐~~, ~~HTML~~, ~~插入器~~, ~~锁定~~, ~~多选~~, ~~可复用~~
• 属性: 锁定

Mini-Cart 项目 - woocommerce/mini-cart-items-block

包含填充 Mini-Cart 的产品表格和其他自定义块。

• 名称: woocommerce/mini-cart-items-block
• 分类: woocommerce
• 父级:
• 父块: woocommerce/filled-mini-cart-contents-block
• 支持: 交互性 (clientNavigation), ~~对齐~~, ~~HTML~~, ~~插入器~~, ~~锁定~~, ~~多选~~, ~~可复用~~
• 属性: 锁定

Mini-Cart 产品表格 - woocommerce/mini-cart-products-table-block

显示 Mini-Cart 块的产品表格的块。

• 名称: woocommerce/mini-cart-products-table-block
• 分类: woocommerce
• 父级:
• 父块: woocommerce/mini-cart-items-block
• 支持: 交互性, ~~对齐~~, ~~HTML~~, ~~插入器~~, ~~锁定~~, ~~多选~~, ~~可复用~~
• 属性: 锁定

Mini-Cart 购物按钮 - woocommerce/mini-cart-shopping-button-block

当 Mini-Cart 为空时，显示购物按钮的块。

• 名称: woocommerce/mini-cart-shopping-button-block
• 分类: woocommerce
• 父级:
• 父块: woocommerce/empty-mini-cart-contents-block
• 支持: 颜色 (背景, 文本), 插入器, 交互性 (clientNavigation), ~~对齐~~, ~~HTML~~, ~~多选~~, ~~可复用~~
• 属性: 锁定, startShoppingButtonLabel

Mini-Cart 标题 - woocommerce/mini-cart-title-block

显示 Mini-Cart 块的标题的块。

• 名称: woocommerce/mini-cart-title-block
• 分类: woocommerce
• 父级:
• 父块: woocommerce/filled-mini-cart-contents-block
• 支持: 颜色 (文本, ~~背景~~), 交互性 (clientNavigation), 排版 (字体大小), ~~对齐~~, ~~HTML~~, ~~插入器~~, ~~锁定~~, ~~多选~~, ~~可复用~~
• 属性: 锁定

Mini-Cart 标题 项目计数器 - woocommerce/mini-cart-title-items-counter-block

显示 Mini-Cart 标题部分的项目计数器的块。

• 名称: woocommerce/mini-cart-title-items-counter-block
• 分类: woocommerce
• 父级:
• 父块: woocommerce/mini-cart-title-block
• 支持: 颜色 (背景, 文本), 交互性, 间距 (内边距), 排版 (字体大小), ~~对齐~~, ~~HTML~~, ~~插入器~~, ~~锁定~~, ~~多选~~, ~~可复用~~
• 属性:

Mini-Cart Title Label - woocommerce/mini-cart-title-label-block

用于显示迷你购物车标题部分的模块。

• 名称: woocommerce/mini-cart-title-label-block
• 分类: woocommerce
• 父模块:
• 父级: woocommerce/mini-cart-title-block
• 支持: color (背景, 文本), interactivity (客户端导航), spacing (内边距), typography (字体大小), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
• 属性: label

Next/Previous Buttons - woocommerce/product-gallery-large-image-next-previous

显示“下一张”和“上一张”按钮。

• 名称: woocommerce/product-gallery-large-image-next-previous
• 分类: woocommerce
• 父模块: woocommerce/product-gallery-large-image, woocommerce/product-collection
• 父级:
• 支持: align, color (背景, 文本), interactivity, layout (允许垂直对齐, 默认, ~~允许对齐~~, ~~允许方向~~), shadow, spacing (外边距)
• 属性:

Additional Field List - woocommerce/order-confirmation-additional-fields

显示当前订单的附加字段值列表。

• 名称: woocommerce/order-confirmation-additional-fields
• 分类: woocommerce
• 父模块:
• 父级:
• 支持: align (全屏, 宽屏), spacing (外边距, 内边距), ~~html~~, ~~multiple~~
• 属性: align, className

Additional Fields - woocommerce/order-confirmation-additional-fields-wrapper

显示来自“联系方式”和“订单”位置的附加结账字段。

• 名称: woocommerce/order-confirmation-additional-fields-wrapper
• 分类: woocommerce
• 父模块:
• 父级:
• 支持: align (全屏, 宽屏), spacing (外边距, 内边距), ~~html~~, ~~multiple~~
• 属性: heading

Additional Information - woocommerce/order-confirmation-additional-information

显示由第三方扩展提供的当前订单的附加信息。

• 名称: woocommerce/order-confirmation-additional-information
• 分类: woocommerce
• 父模块:
• 父级:
• 支持: align (全屏, 宽屏), spacing (外边距, 内边距), ~~html~~, ~~multiple~~
• 属性: align, className

Billing Address - woocommerce/order-confirmation-billing-address

显示订单确认的账单地址。

• 名称: woocommerce/order-confirmation-billing-address
• 分类: woocommerce
• 父模块:
• 父级:
• 支持: align (全屏, 宽屏), color (背景, 文本), spacing (外边距, 内边距), typography (字体大小, 行高), ~~html~~, ~~inserter~~, ~~multiple~~
• 属性: align

账单地址 - woocommerce/order-confirmation-billing-wrapper

显示订单确认页面的账单地址部分。

• Name: woocommerce/order-confirmation-billing-wrapper
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
• Attributes: heading

账户创建 - woocommerce/order-confirmation-create-account

允许客户在购买后创建账户。

• Name: woocommerce/order-confirmation-create-account
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), color (background, button, text), spacing (margin, padding), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
• Attributes: align, className, customerEmail, hasDarkControls, lock, nonceToken

订单下载 - woocommerce/order-confirmation-downloads

显示已购买的下载链接。

• Name: woocommerce/order-confirmation-downloads
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), color (background, gradients, link, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~multiple~~
• Attributes: align, className

下载部分 - woocommerce/order-confirmation-downloads-wrapper

显示可下载产品部分。

• Name: woocommerce/order-confirmation-downloads-wrapper
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
• Attributes: heading

配送地址 - woocommerce/order-confirmation-shipping-address

显示订单确认页面的配送地址。

• Name: woocommerce/order-confirmation-shipping-address
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), color (background, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~inserter~~, ~~multiple~~
• Attributes: align

配送地址部分 - woocommerce/order-confirmation-shipping-wrapper

显示订单确认页面的配送部分。

• Name: woocommerce/order-confirmation-shipping-wrapper
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
• Attributes: heading

订单状态 - woocommerce/order-confirmation-status

显示“谢谢”消息，或关于当前订单状态的句子。

• Name: woocommerce/order-confirmation-status
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), color (background, gradients, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~multiple~~
• Attributes: align, className

订单摘要 - woocommerce/order-confirmation-summary

在订单确认页面显示订单摘要。

• 名称: woocommerce/order-confirmation-summary
• 分类: woocommerce
• 父级:
• 祖父级:
• 支持: align (full, wide), color (background, gradients, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~multiple~~
• 属性: align, className

订单总计 - woocommerce/order-confirmation-totals

显示已购买的商品和订单总计。

• 名称: woocommerce/order-confirmation-totals
• 分类: woocommerce
• 父级:
• 祖父级:
• 支持: align (full, wide), color (background, gradients, link, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~multiple~~
• 属性: align, className

订单总计部分 - woocommerce/order-confirmation-totals-wrapper

显示订单详情部分。

• 名称: woocommerce/order-confirmation-totals-wrapper
• 分类: woocommerce
• 父级:
• 祖父级:
• 支持: align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
• 属性: heading

WooCommerce 网页 - woocommerce/page-content-wrapper

显示 WooCommerce 网页内容。

• 名称: woocommerce/page-content-wrapper
• 分类: woocommerce
• 父级:
• 祖父级:
• 支持: ~~html~~, ~~inserter~~, ~~multiple~~
• 属性: page

付款方式图标 - woocommerce/payment-method-icons

显示可用付款方式的图标。

• 名称: woocommerce/payment-method-icons
• 分类: woocommerce
• 父级:
• 祖父级:
• 支持: spacing (margin, padding)
• 属性: numberOfIcons

按价格筛选控件 - woocommerce/price-filter

允许客户通过选择价格范围来筛选商品列表。

• 名称: woocommerce/price-filter
• 分类: woocommerce
• 父级:
• 祖父级:
• 支持: color (text, ~~background~~), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
• 属性: className, headingLevel, inlineInput, showFilterButton, showInputFields

最畅销商品 - woocommerce/product-best-sellers

显示您所有时期的最畅销商品列表。

• 名称: woocommerce/product-best-sellers
• 分类: woocommerce
• 父级:
• 祖父级:
• 支持: align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
• 属性: alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus

产品分类列表 - woocommerce/product-categories

以列表或下拉形式显示所有产品分类。

• 名称: woocommerce/product-categories
• 分类: woocommerce
• 父分类:
• 父级:
• 支持: align (full, wide), color (link, text, ~~background~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~
• 属性: align, hasCount, hasEmpty, hasImage, isDropdown, isHierarchical, showChildrenOnly

按分类的产品 - woocommerce/product-category

显示来自您所选分类的产品网格。

• 名称: woocommerce/product-category
• 分类: woocommerce
• 父分类:
• 父级:
• 支持: align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
• 属性: alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus

产品集合 - woocommerce/product-collection

显示您商店中的产品集合。

• 名称: woocommerce/product-collection
• 分类: woocommerce
• 父分类:
• 父级:
• 支持: align (full, wide), anchor, email, interactivity, ~~html~~
• 属性: __privatePreviewState, collection, convertedFromProducts, dimensions, displayLayout, forcePageReload, hideControls, query, queryContextIncludes, queryId, tagName

无结果 - woocommerce/product-collection-no-results

当未找到任何产品时，此块的内容将显示。

• 名称: woocommerce/product-collection-no-results
• 分类: woocommerce
• 父分类: woocommerce/product-collection
• 父级:
• 支持: align, color (background, gradients, link, text), email, interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
• 属性:

产品描述 - woocommerce/product-description

显示产品的描述。

• 名称: woocommerce/product-description
• 分类: woocommerce
• 父分类: woocommerce/single-product, woocommerce/product-template, core/post-template
• 父级:
• 支持: align (full, wide), background (backgroundImage, backgroundSize), color (background, gradients, heading, link, text), dimensions (minHeight), interactivity (clientNavigation), layout, spacing (blockGap, margin, padding), typography (fontSize, lineHeight), ~~html~~
• 属性:

产品详情 - woocommerce/product-details

显示产品的描述、属性和评论。

• 名称: woocommerce/product-details
• 分类: woocommerce
• 父分类:
• 父级:
• 支持: align (full, wide), interactivity (clientNavigation)
• 属性: align, hideTabTitle

加入购物车 - woocommerce/add-to-cart-form

显示一个按钮，允许客户将产品添加到购物车。使用添加的选项来优化不同类型的产品。

• 名称: woocommerce/add-to-cart-form
• 分类: woocommerce-product-elements
• 父级:
• 祖先:
• 支持: 交互性
• 属性: quantitySelectorStyle

产品筛选器 - woocommerce/product-filters

允许购物者筛选网页上显示的商品。

• 名称: woocommerce/product-filters
• 分类: woocommerce
• 父级:
• 祖先:
• 支持: 对齐, 颜色 (背景, 按钮, 标题, 文本, ~~启用对比检查器~~), 插入器, 交互性, 布局 (默认, ~~允许编辑~~), 多选, 间距 (块间距), 排版 (字体大小)
• 属性: isPreview

激活的筛选器 - woocommerce/product-filter-active

显示当前激活的筛选器。

• 名称: woocommerce/product-filter-active
• 分类: woocommerce
• 父级: woocommerce/product-filters
• 祖先:
• 支持: 交互性, 间距 (边距, 内边距, ~~块间距~~)
• 属性:

属性筛选器 - woocommerce/product-filter-attribute

允许客户通过选择一个或多个属性（例如颜色）来筛选产品列表。

• 名称: woocommerce/product-filter-attribute
• 分类: woocommerce
• 父级: woocommerce/product-filters
• 祖先:
• 支持: 颜色 (文本, ~~背景~~), 交互性, 间距 (块间距, 边距, 内边距), 排版 (字体大小, 行高)
• 属性: attributeId, displayStyle, hideEmpty, isPreview, queryType, selectType, showCounts, sortOrder

列表 - woocommerce/product-filter-checkbox-list

显示一个筛选选项列表。

• 名称: woocommerce/product-filter-checkbox-list
• 分类: woocommerce
• 父级: woocommerce/product-filter-attribute, woocommerce/product-filter-status, woocommerce/product-filter-taxonomy, woocommerce/product-filter-rating
• 祖先:
• 支持: 交互性
• 属性: customLabelElement, customOptionElement, customOptionElementBorder, customOptionElementSelected, labelElement, optionElement, optionElementBorder, optionElementSelected

标签 - woocommerce/product-filter-chips

以标签的形式显示筛选选项。

• 名称: woocommerce/product-filter-chips
• 分类: woocommerce
• 父级: woocommerce/product-filter-attribute, woocommerce/product-filter-taxonomy, woocommerce/product-filter-status
• 祖先:
• 支持: 交互性
• 属性: chipBackground, chipBorder, chipText, customChipBackground, customChipBorder, customChipText, customSelectedChipBackground, customSelectedChipBorder, customSelectedChipText, selectedChipBackground, selectedChipBorder, selectedChipText

清除过滤器 - woocommerce/product-filter-clear-button

允许购物者清除已应用的过滤器。

• 名称: woocommerce/product-filter-clear-button
• 分类: woocommerce
• 父级: woocommerce/product-filter-active
• 父分类:
• 支持: inserter, interactivity
• 属性:

价格过滤器 - woocommerce/product-filter-price

允许购物者通过选择价格范围来过滤产品。

• 名称: woocommerce/product-filter-price
• 分类: woocommerce
• 父级: woocommerce/product-filters
• 父分类:
• 支持: interactivity, ~~html~~
• 属性:

价格滑块 - woocommerce/product-filter-price-slider

滑块帮助购物者选择价格范围。

• 名称: woocommerce/product-filter-price-slider
• 分类: woocommerce
• 父级: woocommerce/product-filter-price
• 父分类:
• 支持: color (~~背景~~, ~~enableContrastChecker~~, ~~文本~~), interactivity, ~~html~~
• 属性: customSlider, customSliderHandle, customSliderHandleBorder, inlineInput, showInputFields, slider, sliderHandle, sliderHandleBorder

评分过滤器 - woocommerce/product-filter-rating

允许客户根据评分来过滤产品集合。

• 名称: woocommerce/product-filter-rating
• 分类: woocommerce
• 父级: woocommerce/product-filters
• 父分类:
• 支持: color (文本, ~~背景~~), interactivity
• 属性: className, isPreview, minRating, showCounts

标签 - woocommerce/product-filter-removable-chips

以标签的形式显示可移除的已应用过滤器。

• 名称: woocommerce/product-filter-removable-chips
• 分类: woocommerce
• 父级: woocommerce/product-filter-active
• 父分类:
• 支持: interactivity, layout (默认, ~~allowInheriting~~, ~~allowSwitching~~, ~~allowVerticalAlignment~~)
• 属性: chipBackground, chipBorder, chipText, customChipBackground, customChipBorder, customChipText

状态过滤器 - woocommerce/product-filter-status

允许购物者通过选择库存状态来过滤产品。

• 名称: woocommerce/product-filter-status
• 分类: woocommerce
• 父级: woocommerce/product-filters
• 父分类:
• 支持: color (文本, ~~背景~~), interactivity, spacing (blockGap, margin, padding), typography (fontSize, lineHeight), ~~html~~
• 属性: displayStyle, hideEmpty, isPreview, showCounts

分类法过滤器 - woocommerce/product-filter-taxonomy

允许客户通过选择一个或多个分类法项来过滤产品集合，例如分类、品牌或标签。

• 名称: woocommerce/product-filter-taxonomy
• 分类: woocommerce
• 父级: woocommerce/product-filters
• 父分类:
• 支持: color (文本, ~~背景~~), interactivity, spacing (blockGap, margin, padding), typography (fontSize, lineHeight)
• 属性: displayStyle, hideEmpty, isPreview, showCounts, sortOrder, taxonomy

产品画廊 - woocommerce/product-gallery

展示您的产品相关的图片和媒体。

• 名称: woocommerce/product-gallery
• 分类: woocommerce
• 父级: woocommerce/single-product
• 父分类:
• 支持: align, email, interactivity, layout (allowEditing, allowOrientation, default, ~~allowJustification~~)
• 属性: fullScreenOnClick, hoverZoom

缩略图 - woocommerce/product-gallery-large-image

显示产品的缩略图。

• 名称: woocommerce/product-gallery-large-image
• 分类: woocommerce
• 父级: woocommerce/product-gallery
• 父分类:
• 支持: interactivity
• 属性:

缩略图 - woocommerce/product-gallery-thumbnails

显示产品的缩略图。

• 名称: woocommerce/product-gallery-thumbnails
• 分类: woocommerce
• 父级: woocommerce/product-gallery
• 父分类:
• 支持: interactivity, spacing (margin)
• 属性: aspectRatio, thumbnailSize

最新产品 - woocommerce/product-new

显示您的最新产品网格。

• 名称: woocommerce/product-new
• 分类: woocommerce
• 父级:
• 父分类:
• 支持: align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
• 属性: alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus

促销产品 - woocommerce/product-on-sale

显示当前正在促销的产品网格。

• 名称: woocommerce/product-on-sale
• 分类: woocommerce
• 父级:
• 父分类:
• 支持: align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
• 属性: alignButtons, catOperator, categories, columns, contentVisibility, isPreview, orderby, rows, stockStatus

产品结果数量 - woocommerce/product-results-count

显示存档页面或搜索结果页面上的产品数量。

• 名称: woocommerce/product-results-count
• 分类: woocommerce
• 父级:
• 父分类:
• 支持: color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize)
• 属性:

产品评论 - woocommerce/product-reviews

显示产品的评论。

• 名称: woocommerce/product-reviews
• 分类: woocommerce
• 父级:
• 父分类:
• 支持: align (full, wide), color (background, gradients, heading, link, text), interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
• 属性: tagName

评论作者姓名 - woocommerce/product-review-author-name

显示评论的作者姓名。

• 名称: woocommerce/product-review-author-name
• 分类: woocommerce
• 父级: woocommerce/product-reviews
• 父类:
• 支持: 颜色 (背景, 渐变, 链接, 文本), 交互 (客户端导航), 间距 (边距, 内边距), 排版 (字体大小, 行高), ~~HTML~~
• 属性: isLink, linkTarget, textAlign

评论内容 - woocommerce/product-review-content

显示产品评论的内容。

• 名称: woocommerce/product-review-content
• 分类: woocommerce
• 父级: woocommerce/product-reviews
• 父类:
• 支持: 颜色 (背景, 渐变, 链接, 文本), 间距 (内边距), 排版 (字体大小, 行高), ~~HTML~~
• 属性: textAlign

评论日期 - woocommerce/product-review-date

显示评论发布的日期。

• 名称: woocommerce/product-review-date
• 分类: woocommerce
• 父级: woocommerce/product-reviews
• 父类:
• 支持: 颜色 (背景, 渐变, 链接, 文本), 交互 (客户端导航), 间距 (边距, 内边距), 排版 (字体大小, 行高), ~~HTML~~
• 属性: format, isLink

评论表单 - woocommerce/product-review-form

显示产品的评论表单。

• 名称: woocommerce/product-review-form
• 分类: woocommerce
• 父级:
• 父类:
• 支持: 颜色 (背景, 渐变, 标题, 链接, 文本), 交互, 间距 (边距, 内边距), 排版 (字体大小, 行高), ~~HTML~~
• 属性: textAlign

评论评分 - woocommerce/product-review-rating

显示产品评论的评分。

• 名称: woocommerce/product-review-rating
• 分类: woocommerce
• 父级: woocommerce/product-reviews
• 父类:
• 支持: 颜色 (背景, 渐变, 文本), 交互 (客户端导航)
• 属性: textAlign

评论模板 - woocommerce/product-review-template

包含用于显示产品评论的块元素，例如标题、作者、日期、评分等。

• 名称: woocommerce/product-review-template
• 分类: woocommerce
• 父级: woocommerce/product-reviews
• 父类:
• 支持: 对齐, 交互 (客户端导航), 间距 (边距, 内边距), 排版 (字体大小, 行高), ~~HTML~~, ~~可复用~~
• 属性:

评论分页 - woocommerce/product-reviews-pagination

显示分页导航，用于显示下一组或上一组产品评论，如果适用。

• 名称: woocommerce/product-reviews-pagination
• 分类: woocommerce
• 父级: woocommerce/product-reviews
• 父分类:
• 支持: align, color (background, gradients, link, text), interactivity (clientNavigation), layout (default, ~~allowInheriting~~, ~~allowSwitching~~), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
• 属性: paginationArrow

评论下一页 - woocommerce/product-reviews-pagination-next

显示下一篇产品评论的页面链接。

• 名称: woocommerce/product-reviews-pagination-next
• 分类: woocommerce
• 父级: woocommerce/product-reviews-pagination
• 父分类:
• 支持: color (background, gradients, ~~text~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
• 属性: label

评论页码 - woocommerce/product-reviews-pagination-numbers

显示产品评论分页的页码列表。

• 名称: woocommerce/product-reviews-pagination-numbers
• 分类: woocommerce
• 父级: woocommerce/product-reviews-pagination
• 父分类:
• 支持: color (background, gradients, ~~text~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
• 属性:

评论上一页 - woocommerce/product-reviews-pagination-previous

显示上一篇产品评论的页面链接。

• 名称: woocommerce/product-reviews-pagination-previous
• 分类: woocommerce
• 父级: woocommerce/product-reviews-pagination
• 父分类:
• 支持: color (background, gradients, ~~text~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
• 属性: label

评论标题 - woocommerce/product-reviews-title

显示包含评论数量的标题。

• 名称: woocommerce/product-reviews-title
• 分类: woocommerce
• 父级: woocommerce/product-reviews
• 父分类:
• 支持: align, color (background, gradients, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~anchor~~, ~~html~~
• 属性: level, levelOptions, showProductTitle, showReviewsCount, textAlign

产品规格 - woocommerce/product-specifications

显示产品的重量、尺寸和属性。

• 名称: woocommerce/product-specifications
• 分类: woocommerce
• 父级: woocommerce/single-product, woocommerce/product-template, core/post-template
• 父分类:
• 支持: align (full, wide), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
• 属性: showAttributes, showDimensions, showWeight

按照标签的产品 - woocommerce/product-tag

显示带有所选标签的产品网格。

• Name: woocommerce/product-tag
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
• Attributes: alignButtons, columns, contentVisibility, isPreview, orderby, rows, stockStatus, tagOperator, tags

产品模板 - woocommerce/product-template

包含用于渲染产品的块元素。

• Name: woocommerce/product-template
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), anchor, color (background, gradients, link, text), email, interactivity, layout (~~allowEditing~~, ~~allowInheriting~~, ~~allowSizingOnChildren~~, ~~allowSwitching~~, ~~allowVerticalAlignment~~), typography (fontSize, lineHeight), ~~html~~, ~~inserter~~, ~~reusable~~
• Attributes:

顶级产品 - woocommerce/product-top-rated

显示您评价最高的产品的网格。

• Name: woocommerce/product-top-rated
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
• Attributes: alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus

所有产品 - woocommerce/all-products

以网格布局显示您商店中的产品。

• Name: woocommerce/all-products
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~multiple~~
• Attributes: alignButtons, columns, contentVisibility, isPreview, layoutConfig, orderby, rows

按照属性的产品 - woocommerce/products-by-attribute

显示带有所选属性的产品网格。

• Name: woocommerce/products-by-attribute
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
• Attributes: alignButtons, attrOperator, attributes, columns, contentVisibility, isPreview, orderby, rows, stockStatus

评分筛选控件 - woocommerce/rating-filter

允许客户根据评分筛选产品网格。

• Name: woocommerce/rating-filter
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: color (background, button, text), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
• Attributes: className, displayStyle, isPreview, selectType, showCounts, showFilterButton

所有评论 - woocommerce/all-reviews

显示所有产品的评论列表。

• Name: woocommerce/all-reviews
• Category: woocommerce
• Ancestor:
• Parent:
• Supports: color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize), ~~html~~
• Attributes:

按分类显示评论 - woocommerce/reviews-by-category

显示来自特定分类的商品评论。

• Name: woocommerce/reviews-by-category
• 分类: woocommerce
• Ancestor:
• Parent:
• Supports: 颜色 (文本, ~~背景~~), 交互性 (clientNavigation), 排版 (fontSize), ~~html~~
• 属性:

按产品显示评论 - woocommerce/reviews-by-product

显示您产品的评论。

• Name: woocommerce/reviews-by-product
• 分类: woocommerce
• Ancestor:
• Parent:
• Supports: 颜色 (文本, ~~背景~~), 交互性 (clientNavigation), 排版 (fontSize), ~~html~~
• 属性:

单个产品 - woocommerce/single-product

显示您选择的单个产品，并完全控制其显示方式。

• Name: woocommerce/single-product
• 分类: woocommerce
• Ancestor:
• Parent:
• Supports: 对齐 (full, wide), 交互性
• 属性: isPreview, productId

库存状态筛选控件 - woocommerce/stock-filter

允许客户根据库存状态筛选商品列表。

• Name: woocommerce/stock-filter
• 分类: woocommerce
• Ancestor:
• Parent:
• Supports: 颜色 (背景, 按钮, 文本), 交互性 (~~clientNavigation~~), ~~html~~, ~~插入器~~, ~~锁定~~, ~~多选~~
• 属性: className, displayStyle, headingLevel, isPreview, selectType, showCounts, showFilterButton

商店通知 - woocommerce/store-notices

显示由 WooCommerce 或扩展程序生成的面向购物者的通知。

• Name: woocommerce/store-notices
• 分类: woocommerce
• Ancestor:
• Parent:
• Supports: 对齐 (full, wide), 交互性 (clientNavigation), ~~多选~~
• 属性: align