Commit 4a6ab82096a for woocommerce
commit 4a6ab82096a3f57876ab513b8a4d3503f202833b
Author: Albert Juhé Lluveras <contact@albertjuhe.com>
Date: Thu Apr 16 10:58:26 2026 +0200
Fix issues when building docs MDX files (#64129)
* Replace feedback comments with MDX format
* Add changelog
* Convert more comments
* Update theming-woo-blocks.md
* Add additional changelog files
* More fixes
* Revert changes outside of docs
* Revert "Add additional changelog files"
This reverts commit 139e760dbae57fbf433dc4d48c2d538942f92986.
* More fixes (II)
* Update gen block ref script
* Fix heading hashes
* Support more elements
* Remove unnecessary comments
* Remove unnecessary list numbers
* Improve block references
* More improvements
* CodeRabbit suggestions
diff --git a/.ai/skills/woocommerce-markdown/SKILL.md b/.ai/skills/woocommerce-markdown/SKILL.md
index b6dea8bd495..cbe223edd6b 100644
--- a/.ai/skills/woocommerce-markdown/SKILL.md
+++ b/.ai/skills/woocommerce-markdown/SKILL.md
@@ -26,7 +26,7 @@ The project uses markdownlint with these specific rules (from `.markdownlint.jso
- **MD024**: Multiple headings with same content allowed (only check siblings)
- **MD031**: Fenced code blocks must be surrounded by blank lines
- **MD032**: Lists must be surrounded by blank lines
-- **MD033**: HTML allowed for `<video>` elements only
+- **MD033**: HTML allowed for a h1, h2, h3, br, summary, details and video elements
- **MD036**: Emphasis (bold/italic) should not be used as headings - use proper heading tags
- **MD040**: Fenced code blocks should specify language
- **MD047**: Files must end with a single newline
diff --git a/.markdownlint.json b/.markdownlint.json
index 4a2dd1c3ec4..2cfa2d91a28 100644
--- a/.markdownlint.json
+++ b/.markdownlint.json
@@ -4,7 +4,17 @@
"MD007": { "indent": 4 },
"MD013": { "line_length": 9999 },
"MD024": { "siblings_only": true },
- "MD033": { "allowed_elements": [ "video" ] },
+ "MD033": {
+ "allowed_elements": [
+ "h1",
+ "h2",
+ "h3",
+ "br",
+ "summary",
+ "details",
+ "video"
+ ]
+ },
"no-hard-tabs": false,
"whitespace": false
}
diff --git a/docs/block-development/extensible-blocks/cart-and-checkout-blocks/additional-checkout-fields.md b/docs/block-development/extensible-blocks/cart-and-checkout-blocks/additional-checkout-fields.md
index 0b4db0d29af..df738bdb8a1 100644
--- a/docs/block-development/extensible-blocks/cart-and-checkout-blocks/additional-checkout-fields.md
+++ b/docs/block-development/extensible-blocks/cart-and-checkout-blocks/additional-checkout-fields.md
@@ -14,11 +14,11 @@ This document will outline the steps an extension should take to register some a
Additional checkout fields can be registered in three different places:
-| Title | Identifier |
-| ------------------------------------ | ---------- |
-| Contact information | **`contact`** |
-| Addresses (Shipping **and** Billing) | **`address`** |
-| Order information | **`order`** |
+| Title | Identifier |
+| ------------------------------------ | ------------- |
+| Contact information | **`contact`** |
+| Addresses (Shipping **and** Billing) | **`address`** |
+| Order information | **`order`** |
A field can only be shown in one location, it is not possible to render the same field in multiple locations in the same registration.
@@ -209,21 +209,21 @@ The registration function takes an array of options describing your field. Some
These options apply to all field types (except in a few circumstances which are noted inline).
-| Option name | Description | Required? | Example | Default value |
-|---------------------|-------------------------------------------------------------------------------------------------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------|----------------------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| `id` | The field's ID. This should be a unique identifier for your field. It is composed of a namespace and field name separated by a `/`. | Yes | `plugin-namespace/how-did-you-hear` | No default - this must be provided. |
-| `label` | The label shown on your field. This will be the placeholder too. | Yes | `How did you hear about us?` | No default - this must be provided. |
-| `optionalLabel` | The label shown on your field if it is optional. This will be the placeholder too. | No | `How did you hear about us? (Optional)` | The default value will be the value of `label` with `(optional)` appended. |
-| `location` | The location to render your field. | Yes | `contact`, `address`, or `order` | No default - this must be provided. |
-| `type` | The type of field you're rendering. It defaults to `text` and must match one of the supported field types. | No | `text`, `select`, or `checkbox` | `text` |
-| `attributes` | An array of additional attributes to render on the field's input element. This is _not_ supported for `select` fields. | No | `[ 'data-custom-data' => 'my-custom-data' ]` | `[]` |
-| `required` | Can be a boolean or a JSON Schema array. If boolean and `true`, the shopper _must_ provide a value for this field during the checkout process. For checkbox fields, the shopper must check the box to place the order. If a JSON Schema array, the field will be required based on the schema conditions. See [Conditional visibility and validation via JSON Schema](#conditional-visibility-and-validation-via-json-schema). | No | `true` or `["type" => "object", "properties" => [...]]` | `false` |
-| `hidden` | Can be a boolean or a JSON Schema array. Must be `false` when used as a boolean. If a JSON Schema array, the field will be hidden based on the schema conditions. See [Conditional visibility and validation via JSON Schema](#conditional-visibility-and-validation-via-json-schema). | No | `false` or `["type" => "object", "properties" => [...]]` | `false` |
-| `validation` | An array of JSON Schema objects that define validation rules for the field. See [Conditional visibility and validation via JSON Schema](#conditional-visibility-and-validation-via-json-schema). | No | `[{"type": "object", "properties": {...}}]` | `[]` |
-| `sanitize_callback` | A function called to sanitize the customer provided value when posted. | No | See example below | By default the field's value is returned unchanged. |
-| `validate_callback` | A function called to validate the customer provided value when posted. This runs _after_ sanitization. | No | See example below | The default validation function will add an error to the response if the field is required and does not have a value. [See the default validation function.](https://github.com/woocommerce/woocommerce/blob/trunk/plugins/woocommerce/src/Blocks/Domain/Services/CheckoutFields.php#L270-L281) |
-
-##### Example of `sanitize_callback`. This function will remove spaces from the value <!-- omit from toc -->
+| Option name | Description | Required? | Example | Default value |
+| --- | --- | --- | --- | --- |
+| `id` | The field's ID. This should be a unique identifier for your field. It is composed of a namespace and field name separated by a `/`. | Yes | `plugin-namespace/how-did-you-hear` | No default - this must be provided. |
+| `label` | The label shown on your field. This will be the placeholder too. | Yes | `How did you hear about us?` | No default - this must be provided. |
+| `optionalLabel` | The label shown on your field if it is optional. This will be the placeholder too. | No | `How did you hear about us? (Optional)` | The default value will be the value of `label` with `(optional)` appended. |
+| `location` | The location to render your field. | Yes | `contact`, `address`, or `order` | No default - this must be provided. |
+| `type` | The type of field you're rendering. It defaults to `text` and must match one of the supported field types. | No | `text`, `select`, or `checkbox` | `text` |
+| `attributes` | An array of additional attributes to render on the field's input element. This is _not_ supported for `select` fields. | No | `[ 'data-custom-data' => 'my-custom-data' ]` | `[]` |
+| `required` | Can be a boolean or a JSON Schema array. If boolean and `true`, the shopper _must_ provide a value for this field during the checkout process. For checkbox fields, the shopper must check the box to place the order. If a JSON Schema array, the field will be required based on the schema conditions. See [Conditional visibility and validation via JSON Schema](#conditional-visibility-and-validation-via-json-schema). | No | `true` or `["type" => "object", "properties" => [...]]` | `false` |
+| `hidden` | Can be a boolean or a JSON Schema array. Must be `false` when used as a boolean. If a JSON Schema array, the field will be hidden based on the schema conditions. See [Conditional visibility and validation via JSON Schema](#conditional-visibility-and-validation-via-json-schema). | No | `false` or `["type" => "object", "properties" => [...]]` | `false` |
+| `validation` | An array of JSON Schema objects that define validation rules for the field. See [Conditional visibility and validation via JSON Schema](#conditional-visibility-and-validation-via-json-schema). | No | `[{"type": "object", "properties": {...}}]` | `[]` |
+| `sanitize_callback` | A function called to sanitize the customer-provided value when posted. | No | See example below | By default the field's value is returned unchanged. |
+| `validate_callback` | A function called to validate the customer-provided value when posted. This runs _after_ sanitization. | No | See example below | The default validation function will add an error to the response if the field is required and does not have a value. [See the default validation function.](https://github.com/woocommerce/woocommerce/blob/trunk/plugins/woocommerce/src/Blocks/Domain/Services/CheckoutFields.php#L270-L281) |
+
+##### Example of `sanitize_callback`. This function will remove spaces from the value {/* omit in toc */}
```php
'sanitize_callback' => function( $field_value ) {
@@ -231,7 +231,7 @@ These options apply to all field types (except in a few circumstances which are
},
```
-##### Example of `validate_callback`. This function will check if the value is an email <!-- omit from toc -->
+##### Example of `validate_callback`. This function will check if the value is an email {/* omit in toc */}
```php
'validate_callback' => function( $field_value ) {
@@ -253,8 +253,8 @@ Select fields will mount with no value selected by default, if the field is requ
You can set a placeholder to be shown on the select by passing a `placeholder` value when registering the field. This will be the first option in the select and will not be selectable if the field is required.
-| Option name | Description | Required? | Example | Default value |
-|-----|-----|-----|----------------|--------------|
+| Option name | Description | Required? | Example | Default value |
+| --- | --- | --- | --- | --- |
| `options` | An array of options to show in the select input. Each options must be an array containing a `label` and `value` property. Each entry must have a unique `value`. Any duplicate options will be removed. The `value` is what gets submitted to the server during checkout and the `label` is simply a user-friendly representation of this value. It is not transmitted to the server in any way. | Yes | see below | No default - this must be provided. |
| `placeholder` | If this value is set, the shopper will see this option in the select. If the select is required, the shopper cannot select this option. | No | `Select a role` | Select a $label |
@@ -282,9 +282,9 @@ You can set a placeholder to be shown on the select by passing a `placeholder` v
As well as the options above, checkbox field support showing an error message if it's required and not checked.
-| Option name | Description | Required? | Example | Default value |
-|-----------------|------------------------------------------------------------------------------|-----------|--------------------------------------------------------------|---|
-| `error_message` | A custom message to show if the box is unchecked. | No | `You must confirm you are over 18 before placing the order.` | `Please check this box if you want to proceed.` |
+| Option name | Description | Required? | Example | Default value |
+| --- | --- | --- | --- | --- |
+| `error_message` | A custom message to show if the box is unchecked. | No | `You must confirm you are over 18 before placing the order.` | `Please check this box if you want to proceed.` |
### Attributes
@@ -446,10 +446,10 @@ Sanitization is used to ensure the value of a field is in a specific format. An
To run a custom sanitization function for a field you can use the `sanitize_callback` function on registration, or the `woocommerce_sanitize_additional_field` filter.
-| Argument | Type | Description |
-|--------------|-------------------|-------------------------------------------------------------------------|
+| Argument | Type | Description |
+|----------------|-------------------|-------------------------------------------------------------------------|
| `$field_value` | `boolean\|string` | The value of the field. |
-| `$field_key` | `string` | The ID of the field. This is the same ID the field was registered with. |
+| `$field_key` | `string` | The ID of the field. This is the same ID the field was registered with. |
##### Example of sanitization
@@ -482,11 +482,11 @@ When the `woocommerce_validate_additional_field` action is fired the callback r
To add validation errors to the response, use the [`WP_Error::add`](https://developer.wordpress.org/reference/classes/wp_error/add/) method.
-| Argument | Type | Description |
-|--------------|-------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| `$errors` | `WP_Error` | An error object containing errors that were already encountered while processing the request. If no errors were added yet, it will still be a `WP_Error` object but it will be empty. |
-| `$field_key` | `string` | The id of the field. This is the ID the field was registered with. |
-| `$field_value` | `boolean\|string` | The value of the field |
+| Argument | Type | Description |
+| --- | --- | --- |
+| `$errors` | `WP_Error` | An error object containing errors that were already encountered while processing the request. If no errors were added yet, it will still be a `WP_Error` object but it will be empty. |
+| `$field_key` | `string` | The id of the field. This is the ID the field was registered with. |
+| `$field_value` | `boolean\|string` | The value of the field |
###### The `WP_Error` object
@@ -530,11 +530,11 @@ The callback receives the keys and values of the other additional fields in the
It is important to note that any fields rendered in other locations will not be passed to this action, however it might be possible to get those values by accessing the customer or order object, however this is not supported and there are no guarantees regarding backward compatibility in future versions.
-| Argument | Type | Description |
-|----------|-----------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| `$errors` | `WP_Error` | An error object containing errors that were already encountered while processing the request. If no errors were added yet, it will still be a `WP_Error` object but it will be empty. |
-| `$fields` | `array` | The fields rendered in this locations. |
-| `$group` | `'billing'\|'shipping'\|'other'` | If the action is for the address location, the type of address will be set here. If it is for contact or order, this will be 'other'. |
+| Argument | Type | Description |
+| --- | --- | --- |
+| `$errors` | `WP_Error` | An error object containing errors that were already encountered while processing the request. If no errors were added yet, it will still be a `WP_Error` object but it will be empty. |
+| `$fields` | `array` | The fields rendered in this locations. |
+| `$group` | `'billing'\|'shipping'\|'other'` | If the action is for the address location, the type of address will be set here. If it is for contact or order, this will be 'other'. |
There are several places where these hooks are fired.
@@ -602,7 +602,6 @@ When you're writing your rules, you're writing a partial schema for the document
An example of the document object looks like this:
-<!-- markdownlint-disable MD033 -->
<details>
<summary>Document object</summary>
@@ -692,11 +691,9 @@ An example of the document object looks like this:
```
</details>
-<!-- markdownlint-enable MD033 -->
-
It's full schema is this one:
-<!-- markdownlint-disable MD033 -->
+
<details>
<summary>Document schema</summary>
@@ -917,7 +914,6 @@ It's full schema is this one:
```
</details>
-<!-- markdownlint-enable MD033 -->
### Examples
diff --git a/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/cart-line-items.md b/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/cart-line-items.md
index d3a024c2e32..1a099b0e73f 100644
--- a/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/cart-line-items.md
+++ b/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/cart-line-items.md
@@ -6,8 +6,6 @@ sidebar_label: Cart Line Items
# Cart line items
-<!-- markdownlint-disable MD024 -->
-
The following Cart Line Items filters are available:
- `cartItemClass`
@@ -28,11 +26,11 @@ The following screenshot shows which parts the individual filters affect:
## `cartItemClass`
-### Description <!-- omit in toc -->
+### Description {/* omit in toc */}
The `cartItemClass` filter allows to change the cart item class.
-### Parameters <!-- omit in toc -->
+### Parameters {/* omit in toc */}
- _defaultValue_ `object` (default: `''`) - The default cart item class.
- _extensions_ `object` (default: `{}`) - The extensions object.
@@ -41,13 +39,13 @@ The `cartItemClass` filter allows to change the cart item class.
- _cartItem_ `object` - The cart item object from `wc/store/cart`, see Cart Item object.
- _context_ `string` (allowed values: `cart` or `summary`) - The context of the item.
-### Returns <!-- omit in toc -->
+### Returns {/* omit in toc */}
- `string` - The modified cart item class, or an empty string.
-### Code examples <!-- omit in toc -->
+### Code examples {/* omit in toc */}
-#### Basic example <!-- omit in toc -->
+#### Basic example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -67,7 +65,7 @@ registerCheckoutFilters( 'example-extension', {
} );
```
-#### Advanced example <!-- omit in toc -->
+#### Advanced example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -97,20 +95,20 @@ registerCheckoutFilters( 'example-extension', {
> Filters can be also combined. See [Combined filters](/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/) for an example.
-### Screenshots <!-- omit in toc -->
+### Screenshots {/* omit in toc */}
-| Before | After |
-|:---------------------------------------------------------------------:|:---------------------------------------------------------------------:|
-| | |
+| Before | After |
+| --- | --- |
+|  |  |
## `cartItemPrice`
-### Description <!-- omit in toc -->
+### Description {/* omit in toc */}
The `cartItemPrice` filter allows to format the cart item price.
-### Parameters <!-- omit in toc -->
+### Parameters {/* omit in toc */}
- _defaultValue_ `string` (default: `<price/>`) - The default cart item price.
- _extensions_ `object` (default: `{}`) - The extensions object.
@@ -120,13 +118,13 @@ The `cartItemPrice` filter allows to format the cart item price.
- _context_ `string` (allowed values: `cart` or `summary`) - The context of the item.
- _validation_ `boolean` - Checks if the return value contains the substring `<price/>`.
-### Returns <!-- omit in toc -->
+### Returns {/* omit in toc */}
- `string` - The modified format of the cart item price, which must contain the substring `<price/>`, or the original price format.
-### Code examples <!-- omit in toc -->
+### Code examples {/* omit in toc */}
-#### Basic example <!-- omit in toc -->
+#### Basic example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -146,7 +144,7 @@ registerCheckoutFilters( 'example-extension', {
} );
```
-#### Advanced example <!-- omit in toc -->
+#### Advanced example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -176,19 +174,19 @@ registerCheckoutFilters( 'example-extension', {
> Filters can be also combined. See [Combined filters](/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/) for an example.
-### Screenshots <!-- omit in toc -->
+### Screenshots {/* omit in toc */}
-| Before | After |
-|:---------------------------------------------------------------------:|:---------------------------------------------------------------------:|
-| | |
+| Before | After |
+| --- | --- |
+|  |  |
## `itemName`
-### Description <!-- omit in toc -->
+### Description {/* omit in toc */}
The `itemName` filter allows to change the cart item name.
-### Parameters <!-- omit in toc -->
+### Parameters {/* omit in toc */}
- _defaultValue_ `string` - The default cart item name.
- _extensions_ `object` (default: `{}`) - The extensions object.
@@ -197,13 +195,13 @@ The `itemName` filter allows to change the cart item name.
- _cartItem_ `object` - The cart item object from `wc/store/cart`, see Cart Item object.
- _context_ `string` (allowed values: `cart` or `summary`) - The context of the item.
-### Returns <!-- omit in toc -->
+### Returns {/* omit in toc */}
- `string` - The original or modified cart item name.
-### Code examples <!-- omit in toc -->
+### Code examples {/* omit in toc */}
-#### Basic example <!-- omit in toc -->
+#### Basic example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -223,7 +221,7 @@ registerCheckoutFilters( 'example-extension', {
} );
```
-#### Advanced example <!-- omit in toc -->
+#### Advanced example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -253,19 +251,19 @@ registerCheckoutFilters( 'example-extension', {
> Filters can be also combined. See [Combined filters](/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/) for an example.
-### Screenshots <!-- omit in toc -->
+### Screenshots {/* omit in toc */}
-| Before | After |
-|:---------------------------------------------------------------------:|:---------------------------------------------------------------------:|
-| | |
+| Before | After |
+| --- | --- |
+|  |  |
## `saleBadgePriceFormat`
-### Description <!-- omit in toc -->
+### Description {/* omit in toc */}
The `saleBadgePriceFormat` filter allows to format the cart item sale badge price.
-### Parameters <!-- omit in toc -->
+### Parameters {/* omit in toc */}
- _defaultValue_ `string` (default: `<price/>`) - The default cart item sale badge price.
- _extensions_ `object` (default: `{}`) - The extensions object.
@@ -275,11 +273,11 @@ The `saleBadgePriceFormat` filter allows to format the cart item sale badge pric
- _context_ `string` (allowed values: `cart` or `summary`) - The context of the item.
- _validation_ `boolean` - Checks if the return value contains the substring `<price/>`.
-### Returns <!-- omit in toc -->
+### Returns {/* omit in toc */}
- `string` - The modified format of the cart item sale badge price, which must contain the substring `<price/>`, or the original price format.
-### Code examples <!-- omit in toc -->
+### Code examples {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -304,7 +302,7 @@ registerCheckoutFilters( 'example-extension', {
} );
```
-#### Advanced example <!-- omit in toc -->
+#### Advanced example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -339,20 +337,20 @@ registerCheckoutFilters( 'example-extension', {
> Filters can be also combined. See [Combined filters](/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/) for an example.
-### Screenshots <!-- omit in toc -->
+### Screenshots {/* omit in toc */}
-| Before | After |
-|:---------------------------------------------------------------------:|:---------------------------------------------------------------------:|
-| | |
+| Before | After |
+| --- | --- |
+|  |  |
## `showRemoveItemLink`
-### Description <!-- omit in toc -->
+### Description {/* omit in toc */}
The `showRemoveItemLink` is used to show or hide the cart item remove link.
-### Parameters <!-- omit in toc -->
+### Parameters {/* omit in toc */}
- _defaultValue_ (type: `boolean`, default: `true`) - The default value of the remove link.
- _extensions_ `object` (default: `{}`) - The extensions object.
@@ -361,13 +359,13 @@ The `showRemoveItemLink` is used to show or hide the cart item remove link.
- _cartItem_ `object` - The cart item object from `wc/store/cart`, see Cart Item object.
- _context_ `string` (allowed values: `cart` or `summary`) - The context of the item.
-### Returns <!-- omit in toc -->
+### Returns {/* omit in toc */}
- `boolean` - `true` if the cart item remove link should be shown, `false` otherwise.
-### Code examples <!-- omit in toc -->
+### Code examples {/* omit in toc */}
-#### Basic example <!-- omit in toc -->
+#### Basic example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -387,7 +385,7 @@ registerCheckoutFilters( 'example-extension', {
} );
```
-#### Advanced example <!-- omit in toc -->
+#### Advanced example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -417,21 +415,21 @@ registerCheckoutFilters( 'example-extension', {
> Filters can be also combined. See [Combined filters](/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/) for an example.
-### Screenshots <!-- omit in toc -->
+### Screenshots {/* omit in toc */}
-| Before | After |
-|:---------------------------------------------------------------------:|:---------------------------------------------------------------------:|
-| | |
+| Before | After |
+| --- | --- |
+|  |  |
## `subtotalPriceFormat`
-### Description <!-- omit in toc -->
+### Description {/* omit in toc */}
The `subtotalPriceFormat` filter allows to format the cart item subtotal price.
-### Parameters <!-- omit in toc -->
+### Parameters {/* omit in toc */}
- _defaultValue_ `string` (default: `<price/>`) - The default cart item subtotal price.
- _extensions_ `object` (default: `{}`) - The extensions object.
@@ -441,13 +439,13 @@ The `subtotalPriceFormat` filter allows to format the cart item subtotal price.
- _context_ `string` (allowed values: `cart` or `summary`) - The context of the item.
- _validation_ `boolean` - Checks if the return value contains the substring `<price/>`.
-### Returns <!-- omit in toc -->
+### Returns {/* omit in toc */}
- `string` - The modified format of the cart item subtotal price, which must contain the substring `<price/>`, or the original price format.
-### Code examples <!-- omit in toc -->
+### Code examples {/* omit in toc */}
-#### Basic example <!-- omit in toc -->
+#### Basic example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -472,7 +470,7 @@ registerCheckoutFilters( 'example-extension', {
} );
```
-#### Advanced example <!-- omit in toc -->
+#### Advanced example {/* omit in toc */}
```tsx
const { registerCheckoutFilters } = window.wc.blocksCheckout;
@@ -507,11 +505,11 @@ registerCheckoutFilters( 'example-extension', {
> Filters can be also combined. See [Combined filters](/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/) for an example.
-### Screenshots <!-- omit in toc -->
+### Screenshots {/* omit in toc */}
-| Before | After |
-|:---------------------------------------------------------------------:|:---------------------------------------------------------------------:|
-| | |
+| Before | After |
+| --- | --- |
+|  |  |
## Cart object
diff --git a/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/checkout-and-place-order-button.md b/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/checkout-and-place-order-button.md
index 5e21fccb9cb..b9c05349a03 100644
--- a/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/checkout-and-place-order-button.md
+++ b/docs/block-development/extensible-blocks/cart-and-checkout-blocks/filters-in-cart-and-checkout/checkout-and-place-order-button.md
@@ -92,9 +92,9 @@ registerCheckoutFilters( 'example-extension', {
### Screenshots
-| Before | After |
-|:---------------------------------------------------------------------:|:---------------------------------------------------------------------:|
-| | |
+| Before | After |
+| --- | --- |
+|  |  |
## `proceedToCheckoutButtonLink`
@@ -171,9 +171,9 @@ registerCheckoutFilters( 'example-extension', {
### Screenshots
-| Before | After |
-|:---------------------------------------------------------------------:|:---------------------------------------------------------------------:|
-| | |
+| Before | After |
+| --- | --- |
+|  |  |
## `placeOrderButtonLabel`
@@ -208,11 +208,11 @@ registerCheckoutFilters( 'example-extension', {
### Screenshots
-| Before | After |
-|:---------------------------------------------------------------------:|:---------------------------------------------------------------------:|
-| | |
+| Before | After |
+| --- | --- |
+|  |  |
-<!-- FEEDBACK -->
+{/* FEEDBACK */}
## Cart object
diff --git a/docs/block-development/extensible-blocks/product-sale-badge-block/README.md b/docs/block-development/extensible-blocks/product-sale-badge-block/README.md
index 990af690454..dd06bfc8220 100644
--- a/docs/block-development/extensible-blocks/product-sale-badge-block/README.md
+++ b/docs/block-development/extensible-blocks/product-sale-badge-block/README.md
@@ -12,22 +12,22 @@ The On-Sale Badge block displays a "Sale" badge on products that are on sale.
## `woocommerce_sale_badge_text`
-### Description <!-- omit in toc -->
+### Description {/* omit in toc */}
The `woocommerce_sale_badge_text` filter allows customization of the sale badge text based on product context.
-### Parameters <!-- omit in toc -->
+### Parameters {/* omit in toc */}
- _$sale_text_ `string` (default: `'Sale'`) - The sale badge text.
- _$product_ `WC_Product` - The product object.
-### Returns <!-- omit in toc -->
+### Returns {/* omit in toc */}
- `string` - The filtered sale badge text.
-### Code examples <!-- omit in toc -->
+### Code examples {/* omit in toc */}
-#### Basic example <!-- omit in toc -->
+#### Basic example {/* omit in toc */}
```php
add_filter( 'woocommerce_sale_badge_text', 'custom_sale_badge_text', 10, 2 );
@@ -37,7 +37,7 @@ function custom_sale_badge_text( $sale_text, $product ) {
}
```
-#### Product-specific customization <!-- omit in toc -->
+#### Product-specific customization {/* omit in toc */}
```php
add_filter( 'woocommerce_sale_badge_text', 'custom_sale_badge_by_product_type', 10, 2 );
@@ -55,7 +55,7 @@ function custom_sale_badge_by_product_type( $sale_text, $product ) {
}
```
-#### Discount percentage <!-- omit in toc -->
+#### Discount percentage {/* omit in toc */}
```php
add_filter( 'woocommerce_sale_badge_text', 'show_discount_percentage_badge', 10, 2 );
diff --git a/docs/block-development/reference/block-references.md b/docs/block-development/reference/block-references.md
index e1e37f1a9e9..79f7be1e382 100644
--- a/docs/block-development/reference/block-references.md
+++ b/docs/block-development/reference/block-references.md
@@ -7,1876 +7,1622 @@ sidebar_label: Blocks reference
This page lists the Woo blocks included in the package. (Incomplete as there are still blocks that are not using block.json definition).
-<!-- START Autogenerated - DO NOT EDIT -->
+{/* START Autogenerated - DO NOT EDIT */}
## Product Average Rating (Beta) - woocommerce/product-average-rating
Display the average rating of a product
-- **Name:** woocommerce/product-average-rating
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/single-product
-- **Parent:**
-- **Supports:** color (background, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize)
-- **Attributes:** textAlign
+- **Name:** woocommerce/product-average-rating
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/single-product
+- **Supports:** color (background, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize)
+- **Attributes:** textAlign
## Add to Cart Button - woocommerce/product-button
Display a call to action button which either adds the product to the cart, or links to the product page.
-- **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 (background, text, ~~link~~), email, interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, productId, textAlign, width
+- **Name:** woocommerce/product-button
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/all-products, woocommerce/single-product, core/post-template, woocommerce/product-template
+- **Supports:** align (full, wide), color (background, text, ~~link~~), email, interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, productId, textAlign, width
## Product Image - woocommerce/product-image
Display the main 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 (margin, padding), typography (fontSize), ~~html~~
-- **Attributes:** aspectRatio, height, imageSizing, isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, productId, saleBadgeAlign, scale, showProductLink, showSaleBadge, width
+- **Name:** woocommerce/product-image
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
+- **Supports:** dimensions (aspectRatio), email, interactivity (clientNavigation), spacing (margin, padding), typography (fontSize), ~~html~~
+- **Attributes:** aspectRatio, height, imageSizing, isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, productId, saleBadgeAlign, scale, showProductLink, showSaleBadge, width
## Product Price - woocommerce/product-price
Display the price of a product.
-- **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 (background, text, ~~link~~), email, interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign
+- **Name:** woocommerce/product-price
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/all-products, woocommerce/featured-product, woocommerce/single-product, woocommerce/product-template, core/post-template
+- **Supports:** color (background, text, ~~link~~), email, interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign
## Product Image Gallery - woocommerce/product-image-gallery
Display a product's images.
-- **Name:** woocommerce/product-image-gallery
-- **Category:** woocommerce-product-elements
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align, interactivity (clientNavigation), ~~multiple~~
-- **Attributes:**
+- **Name:** woocommerce/product-image-gallery
+- **Category:** woocommerce-product-elements
+- **Supports:** align, interactivity (clientNavigation), ~~multiple~~
## Product Meta - woocommerce/product-meta
Display a product’s SKU, categories, tags, and more.
-- **Name:** woocommerce/product-meta
-- **Category:** woocommerce-product-elements
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align, interactivity (clientNavigation), ~~reusable~~
-- **Attributes:**
+- **Name:** woocommerce/product-meta
+- **Category:** woocommerce-product-elements
+- **Supports:** align, interactivity (clientNavigation), ~~reusable~~
## Product Rating - woocommerce/product-rating
Display the average rating of a product.
-- **Name:** woocommerce/product-rating
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
-- **Parent:**
-- **Supports:** color (text, ~~background~~, ~~link~~), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize)
-- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign
+- **Name:** woocommerce/product-rating
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
+- **Supports:** color (text, ~~background~~, ~~link~~), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize)
+- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign
## Product Rating Counter - woocommerce/product-rating-counter
Display the review count of a product
-- **Name:** woocommerce/product-rating-counter
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/single-product
-- **Parent:**
-- **Supports:** color (link, ~~background~~, ~~text~~), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize), ~~inserter~~
-- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign
+- **Name:** woocommerce/product-rating-counter
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/single-product
+- **Supports:** color (link, ~~background~~, ~~text~~), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize), ~~inserter~~
+- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign
## Product Rating Stars - woocommerce/product-rating-stars
Display the average rating of a product with stars
-- **Name:** woocommerce/product-rating-stars
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/single-product
-- **Parent:**
-- **Supports:** color (text, ~~background~~, ~~link~~), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize), ~~inserter~~
-- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign
+- **Name:** woocommerce/product-rating-stars
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/single-product
+- **Supports:** color (text, ~~background~~, ~~link~~), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize), ~~inserter~~
+- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign
## Related Products - woocommerce/related-products
Display related products.
-- **Name:** woocommerce/related-products
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align, interactivity (clientNavigation), ~~inserter~~, ~~reusable~~
-- **Attributes:**
+- **Name:** woocommerce/related-products
+- **Category:** woocommerce
+- **Supports:** align, interactivity (clientNavigation), ~~inserter~~, ~~reusable~~
## On-Sale Badge - woocommerce/product-sale-badge
Displays an on-sale badge if the product is on-sale.
-- **Name:** woocommerce/product-sale-badge
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/single-product, woocommerce/product-template, core/post-template, woocommerce/product-gallery
-- **Parent:**
-- **Supports:** align, color (background, gradients, text, ~~link~~), email, interactivity (clientNavigation), spacing (margin), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId
+- **Name:** woocommerce/product-sale-badge
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/single-product, woocommerce/product-template, core/post-template, woocommerce/product-gallery
+- **Supports:** align, color (background, gradients, text, ~~link~~), email, interactivity (clientNavigation), spacing (margin), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId
## Product SKU - woocommerce/product-sku
Displays the SKU of a product.
-- **Name:** woocommerce/product-sku
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/product-meta, woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
-- **Parent:**
-- **Supports:** color (background, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** isDescendantOfAllProducts, prefix, productId, showProductSelector, suffix
+- **Name:** woocommerce/product-sku
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/product-meta, woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
+- **Supports:** color (background, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** isDescendantOfAllProducts, prefix, productId, showProductSelector, suffix
## Product Stock Indicator - woocommerce/product-stock-indicator
Let shoppers know when products are out of stock or on backorder. This block is hidden when products are in stock.
-- **Name:** woocommerce/product-stock-indicator
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
-- **Parent:**
-- **Supports:** color (background, text), interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** isDescendantOfAllProducts
+- **Name:** woocommerce/product-stock-indicator
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/all-products, woocommerce/single-product, woocommerce/product-template, core/post-template
+- **Supports:** color (background, text), interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** isDescendantOfAllProducts
## Product Summary - woocommerce/product-summary
Display a short description about a product.
-- **Name:** woocommerce/product-summary
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/all-products, woocommerce/featured-product, woocommerce/single-product, woocommerce/product-template, core/post-template
-- **Parent:**
-- **Supports:** color (background, link, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight, textAlign)
-- **Attributes:** isDescendantOfAllProducts, isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, linkText, productId, showDescriptionIfEmpty, showLink, summaryLength
+- **Name:** woocommerce/product-summary
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/all-products, woocommerce/featured-product, woocommerce/single-product, woocommerce/product-template, core/post-template
+- **Supports:** color (background, link, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight, textAlign)
+- **Attributes:** isDescendantOfAllProducts, isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, linkText, productId, showDescriptionIfEmpty, showLink, summaryLength
## Product Title - woocommerce/product-title
Display the title of a product.
-- **Name:** woocommerce/product-title
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/all-products
-- **Parent:**
-- **Supports:** color (background, gradients, text, ~~link~~), interactivity (~~clientNavigation~~), spacing (margin), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** align, headingLevel, linkTarget, productId, showProductLink
+- **Name:** woocommerce/product-title
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/all-products
+- **Supports:** color (background, gradients, text, ~~link~~), interactivity (~~clientNavigation~~), spacing (margin), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** align, headingLevel, linkTarget, productId, showProductLink
## Accordion Group - woocommerce/accordion-group
A group of headers and associated expandable content.
-- **Name:** woocommerce/accordion-group
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), background (backgroundImage, backgroundSize), color (background, gradient, text), interactivity, layout, shadow, spacing (blockGap, margin, padding), ~~html~~
-- **Attributes:** allowedBlocks, autoclose, iconPosition
+- **Name:** woocommerce/accordion-group
+- **Category:** woocommerce
+- **Supports:** align (full, wide), background (backgroundImage, backgroundSize), color (background, gradient, text), interactivity, layout, shadow, spacing (blockGap, margin, padding), ~~html~~
+- **Attributes:** allowedBlocks, autoclose, iconPosition
## Accordion Header - woocommerce/accordion-header
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
+- **Name:** woocommerce/accordion-header
+- **Category:** woocommerce
+- **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
## Accordion - woocommerce/accordion-item
A single accordion that displays a header and expandable content.
-- **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
+- **Name:** woocommerce/accordion-item
+- **Category:** woocommerce
+- **Parent:** woocommerce/accordion-group
+- **Supports:** align (full, wide), color (background, gradient, text), interactivity, layout, shadow, spacing (blockGap, margin)
+- **Attributes:** openByDefault
## Accordion Panel - woocommerce/accordion-panel
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
+- **Name:** woocommerce/accordion-panel
+- **Category:** woocommerce
+- **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
## Active Filters Controls - woocommerce/active-filters
Display the currently active filters.
-- **Name:** woocommerce/active-filters
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
-- **Attributes:** displayStyle, headingLevel
+- **Name:** woocommerce/active-filters
+- **Category:** woocommerce
+- **Supports:** color (text, ~~background~~), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
+- **Attributes:** displayStyle, headingLevel
+
+## Add to Cart with Options - woocommerce/add-to-cart-form
+
+Display a button that lets customers add a product to their cart. Use the added options to optimize for different product types.
+
+- **Name:** woocommerce/add-to-cart-form
+- **Category:** woocommerce-product-elements
+- **Supports:** interactivity
+- **Attributes:** quantitySelectorStyle
## Add to Cart + Options (Beta) - woocommerce/add-to-cart-with-options
Use blocks to create an "Add to cart" area that's customized for different product types, such as variable and grouped.
-- **Name:** woocommerce/add-to-cart-with-options
-- **Category:** woocommerce-product-elements
-- **Ancestor:**
-- **Parent:**
-- **Supports:** interactivity
-- **Attributes:** isDescendantOfAddToCartWithOptions
+- **Name:** woocommerce/add-to-cart-with-options
+- **Category:** woocommerce-product-elements
+- **Supports:** interactivity
+- **Attributes:** isDescendantOfAddToCartWithOptions
## Grouped Product Selector (Beta) - woocommerce/add-to-cart-with-options-grouped-product-selector
Display a group of products that can be added to the cart.
-- **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:**
+- **Name:** woocommerce/add-to-cart-with-options-grouped-product-selector
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/add-to-cart-with-options
+- **Supports:** interactivity
## Grouped Product: Template (Beta) - woocommerce/add-to-cart-with-options-grouped-product-item
A list item template that represents a child product within the Grouped Product Selector block.
-- **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:**
+- **Name:** woocommerce/add-to-cart-with-options-grouped-product-item
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/add-to-cart-with-options-grouped-product-selector
+- **Supports:** interactivity, ~~inserter~~
## Grouped Product: Item Label (Beta) - woocommerce/add-to-cart-with-options-grouped-product-item-label
Display the product title as a label or paragraph.
-- **Name:** woocommerce/add-to-cart-with-options-grouped-product-item-label
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/add-to-cart-with-options-grouped-product-item
-- **Parent:**
-- **Supports:** color (background, gradients, text), layout (selfStretch), spacing (blockGap, margin, padding), typography (fontSize, lineHeight, textAlign), ~~html~~
-- **Attributes:**
+- **Name:** woocommerce/add-to-cart-with-options-grouped-product-item-label
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/add-to-cart-with-options-grouped-product-item
+- **Supports:** color (background, gradients, text), layout (selfStretch), spacing (blockGap, margin, padding), typography (fontSize, lineHeight, textAlign), ~~html~~
## Grouped Product: Item Selector (Beta) - woocommerce/add-to-cart-with-options-grouped-product-item-selector
Add a way of selecting a child product within the Grouped Product block. Depending on the type of product and its properties, this might be a button, a checkbox, or a link.
-- **Name:** woocommerce/add-to-cart-with-options-grouped-product-item-selector
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/add-to-cart-with-options-grouped-product-item
-- **Parent:**
-- **Supports:** interactivity, ~~inserter~~
-- **Attributes:**
+- **Name:** woocommerce/add-to-cart-with-options-grouped-product-item-selector
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/add-to-cart-with-options-grouped-product-item
+- **Supports:** interactivity, ~~inserter~~
## Product Quantity (Beta) - woocommerce/add-to-cart-with-options-quantity-selector
Display an input field customers can use to select the number of products to add to their cart.
-- **Name:** woocommerce/add-to-cart-with-options-quantity-selector
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/add-to-cart-with-options
-- **Parent:**
-- **Supports:** interactivity
-- **Attributes:**
+- **Name:** woocommerce/add-to-cart-with-options-quantity-selector
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/add-to-cart-with-options
+- **Supports:** interactivity
## Variation Description (Beta) - woocommerce/add-to-cart-with-options-variation-description
Displays the description of the selected variation.
-- **Name:** woocommerce/add-to-cart-with-options-variation-description
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/add-to-cart-with-options
-- **Parent:**
-- **Supports:** color (background, gradients, link, text), dimensions (minHeight), interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:**
+- **Name:** woocommerce/add-to-cart-with-options-variation-description
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/add-to-cart-with-options
+- **Supports:** color (background, gradients, link, text), dimensions (minHeight), interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
## Variation Selector: Template (Beta) - woocommerce/add-to-cart-with-options-variation-selector-attribute
A template for attribute name and options that will be applied to all variable products with attributes.
-- **Name:** woocommerce/add-to-cart-with-options-variation-selector-attribute
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/add-to-cart-with-options-variation-selector
-- **Parent:**
-- **Supports:** interactivity, ~~inserter~~
-- **Attributes:**
+- **Name:** woocommerce/add-to-cart-with-options-variation-selector-attribute
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/add-to-cart-with-options-variation-selector
+- **Supports:** interactivity, ~~inserter~~
## Variation Selector: Attribute Name (Beta) - woocommerce/add-to-cart-with-options-variation-selector-attribute-name
Format the name of an attribute associated with a variable product.
-- **Name:** woocommerce/add-to-cart-with-options-variation-selector-attribute-name
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/add-to-cart-with-options-variation-selector-attribute
-- **Parent:**
-- **Supports:** color (background, gradients, text), interactivity, spacing (padding), typography (fontSize, lineHeight), ~~alignWide~~, ~~align~~, ~~inserter~~
-- **Attributes:**
+- **Name:** woocommerce/add-to-cart-with-options-variation-selector-attribute-name
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/add-to-cart-with-options-variation-selector-attribute
+- **Supports:** color (background, gradients, text), interactivity, spacing (padding), typography (fontSize, lineHeight), ~~alignWide~~, ~~align~~, ~~inserter~~
## Variation Selector: Attribute Options (Beta) - woocommerce/add-to-cart-with-options-variation-selector-attribute-options
Display the attribute options associated with a variable product.
-- **Name:** woocommerce/add-to-cart-with-options-variation-selector-attribute-options
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/add-to-cart-with-options-variation-selector-attribute
-- **Parent:**
-- **Supports:** interactivity, ~~inserter~~
-- **Attributes:** optionStyle
+- **Name:** woocommerce/add-to-cart-with-options-variation-selector-attribute-options
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/add-to-cart-with-options-variation-selector-attribute
+- **Supports:** interactivity, ~~inserter~~
+- **Attributes:** autoselect, disabledAttributesAction, optionStyle
## Variation Selector (Beta) - woocommerce/add-to-cart-with-options-variation-selector
Display any product variations available to select from and add to cart.
-- **Name:** woocommerce/add-to-cart-with-options-variation-selector
-- **Category:** woocommerce-product-elements
-- **Ancestor:** woocommerce/add-to-cart-with-options
-- **Parent:**
-- **Supports:** interactivity
-- **Attributes:**
+- **Name:** woocommerce/add-to-cart-with-options-variation-selector
+- **Category:** woocommerce-product-elements
+- **Ancestor:** woocommerce/add-to-cart-with-options
+- **Supports:** interactivity
## Filter by Attribute Controls - woocommerce/attribute-filter
Enable customers to filter the product grid by selecting one or more attributes, such as color.
-- **Name:** woocommerce/attribute-filter
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (text, ~~background~~), ~~html~~, ~~inserter~~, ~~interactivity~~, ~~lock~~
-- **Attributes:** attributeId, className, displayStyle, headingLevel, isPreview, queryType, selectType, showCounts, showFilterButton
+- **Name:** woocommerce/attribute-filter
+- **Category:** woocommerce
+- **Supports:** color (text, ~~background~~), ~~html~~, ~~inserter~~, ~~interactivity~~, ~~lock~~
+- **Attributes:** attributeId, className, displayStyle, headingLevel, isPreview, queryType, selectType, showCounts, showFilterButton
## Store Breadcrumbs - woocommerce/breadcrumbs
Enable customers to keep track of their location within the store and navigate back to parent pages.
-- **Name:** woocommerce/breadcrumbs
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), color (link, text, ~~background~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** align, contentJustification, fontSize
+- **Name:** woocommerce/breadcrumbs
+- **Category:** woocommerce
+- **Supports:** align (full, wide), color (link, text, ~~background~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** align, contentJustification, fontSize
## Accepted Payment Methods - woocommerce/cart-accepted-payment-methods-block
Display accepted payment methods.
-- **Name:** woocommerce/cart-accepted-payment-methods-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-totals-block
-- **Supports:** inserter, ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
-- **Attributes:**
+- **Name:** woocommerce/cart-accepted-payment-methods-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-totals-block
+- **Supports:** inserter, ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
## Cart Cross-Sells - woocommerce/cart-cross-sells-block
Shows the Cross-Sells block.
-- **Name:** woocommerce/cart-cross-sells-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-items-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~multiple~~, ~~reusable~~
-- **Attributes:**
+- **Name:** woocommerce/cart-cross-sells-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-items-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~multiple~~, ~~reusable~~
## Cart Cross-Sells Products - woocommerce/cart-cross-sells-products-block
Shows the Cross-Sells products.
-- **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
+- **Name:** woocommerce/cart-cross-sells-products-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-cross-sells-block
+- **Supports:** email, ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** columns, lock
## Express Checkout - woocommerce/cart-express-payment-block
Allow customers to breeze through with quick payment options.
-- **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
+- **Name:** woocommerce/cart-express-payment-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** buttonBorderRadius, buttonHeight, lock, showButtonStyles
## Cart Items - woocommerce/cart-items-block
Column containing cart items.
-- **Name:** woocommerce/cart-items-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/filled-cart-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/cart-items-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/filled-cart-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Cart Line Items - woocommerce/cart-line-items-block
Block containing current line items in Cart.
-- **Name:** woocommerce/cart-line-items-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-items-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/cart-line-items-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-items-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Order Summary - woocommerce/cart-order-summary-block
Show customers a summary of their order.
-- **Name:** woocommerce/cart-order-summary-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/cart-order-summary-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Coupon Form - woocommerce/cart-order-summary-coupon-form-block
Shows the apply coupon form.
-- **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
+- **Name:** woocommerce/cart-order-summary-coupon-form-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-order-summary-block
+- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Discount - woocommerce/cart-order-summary-discount-block
Shows the cart discount row.
-- **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
+- **Name:** woocommerce/cart-order-summary-discount-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-order-summary-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Fees - woocommerce/cart-order-summary-fee-block
Shows the cart fee row.
-- **Name:** woocommerce/cart-order-summary-fee-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-order-summary-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/cart-order-summary-fee-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-order-summary-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Heading - woocommerce/cart-order-summary-heading-block
Shows the heading row.
-- **Name:** woocommerce/cart-order-summary-heading-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-order-summary-block
-- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, content, lock
+- **Name:** woocommerce/cart-order-summary-heading-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-order-summary-block
+- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, content, lock
## Shipping - woocommerce/cart-order-summary-shipping-block
Shows the cart shipping row.
-- **Name:** woocommerce/cart-order-summary-shipping-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-order-summary-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/cart-order-summary-shipping-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-order-summary-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Subtotal - woocommerce/cart-order-summary-subtotal-block
Shows the cart subtotal row.
-- **Name:** woocommerce/cart-order-summary-subtotal-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-order-summary-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/cart-order-summary-subtotal-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-order-summary-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Taxes - woocommerce/cart-order-summary-taxes-block
Shows the cart taxes row.
-- **Name:** woocommerce/cart-order-summary-taxes-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-order-summary-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/cart-order-summary-taxes-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-order-summary-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Totals - woocommerce/cart-order-summary-totals-block
Shows the subtotal, fees, discounts, shipping and taxes.
-- **Name:** woocommerce/cart-order-summary-totals-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-order-summary-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/cart-order-summary-totals-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-order-summary-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Cart Totals - woocommerce/cart-totals-block
Column containing the cart totals.
-- **Name:** woocommerce/cart-totals-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/filled-cart-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** checkbox, lock, text
+- **Name:** woocommerce/cart-totals-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/filled-cart-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** checkbox, lock, text
## Empty Cart - woocommerce/empty-cart-block
Contains blocks that are displayed when the cart is empty.
-- **Name:** woocommerce/empty-cart-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart
-- **Supports:** align (wide), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/empty-cart-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart
+- **Supports:** align (wide), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Filled Cart - woocommerce/filled-cart-block
Contains blocks that are displayed when the cart contains products.
-- **Name:** woocommerce/filled-cart-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart
-- **Supports:** align (wide), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/filled-cart-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart
+- **Supports:** align (wide), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Proceed to Checkout - woocommerce/proceed-to-checkout-block
Allow customers proceed to Checkout.
-- **Name:** woocommerce/proceed-to-checkout-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/cart-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/proceed-to-checkout-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/cart-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Cart Link - woocommerce/cart-link
Display a link to the cart.
-- **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
+- **Name:** woocommerce/cart-link
+- **Category:** woocommerce
+- **Supports:** color (background, link, ~~text~~), interactivity (clientNavigation), spacing (padding), typography (fontSize), ~~html~~, ~~multiple~~
+- **Attributes:** cartIcon, content
## Catalog Sorting - woocommerce/catalog-sorting
Enable customers to change the sorting order of the products.
-- **Name:** woocommerce/catalog-sorting
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize)
-- **Attributes:** fontSize, useLabel
+- **Name:** woocommerce/catalog-sorting
+- **Category:** woocommerce
+- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize)
+- **Attributes:** fontSize, useLabel
## Product Category Description - woocommerce/category-description
Displays the current category description.
-- **Name:** woocommerce/category-description
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (background, text), spacing (margin, padding), typography, ~~align~~, ~~html~~
-- **Attributes:** textAlign
+- **Name:** woocommerce/category-description
+- **Category:** woocommerce
+- **Supports:** color (background, text), spacing (margin, padding), typography, ~~align~~, ~~html~~
+- **Attributes:** textAlign
## Product Category Title - woocommerce/category-title
Displays the current category title and lets permitted users edit it.
-- **Name:** woocommerce/category-title
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (background, text), spacing (margin, padding), typography, ~~align~~, ~~html~~
-- **Attributes:** isLink, level, linkTarget, rel, textAlign
+- **Name:** woocommerce/category-title
+- **Category:** woocommerce
+- **Supports:** color (background, text), spacing (margin, padding), typography, ~~align~~, ~~html~~
+- **Attributes:** isLink, level, linkTarget, rel, textAlign
## Checkout - woocommerce/checkout
Display a checkout form so your customers can submit orders.
-- **Name:** woocommerce/checkout
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (wide), ~~html~~, ~~multiple~~
-- **Attributes:** align, isPreview, showFormStepNumbers
+- **Name:** woocommerce/checkout
+- **Category:** woocommerce
+- **Supports:** align (wide), ~~html~~, ~~multiple~~
+- **Attributes:** align, showFormStepNumbers
## Actions - woocommerce/checkout-actions-block
Allow customers to place their order.
-- **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
+- **Name:** woocommerce/checkout-actions-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** cartPageId, className, lock, priceSeparator, showReturnToCart
## Additional information - woocommerce/checkout-additional-information-block
Render additional fields in the 'Additional information' location.
-- **Name:** woocommerce/checkout-additional-information-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/checkout-additional-information-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Billing Address - woocommerce/checkout-billing-address-block
Collect your customer's billing address.
-- **Name:** woocommerce/checkout-billing-address-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/checkout-billing-address-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Contact Information - woocommerce/checkout-contact-information-block
Collect your customer's contact information.
-- **Name:** woocommerce/checkout-contact-information-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/checkout-contact-information-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Express Checkout - woocommerce/checkout-express-payment-block
Allow customers to breeze through with quick payment options.
-- **Name:** woocommerce/checkout-express-payment-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** buttonBorderRadius, buttonHeight, className, lock, showButtonStyles
+- **Name:** woocommerce/checkout-express-payment-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** buttonBorderRadius, buttonHeight, className, lock, showButtonStyles
## Checkout Fields - woocommerce/checkout-fields-block
Column containing checkout address fields.
-- **Name:** woocommerce/checkout-fields-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/checkout-fields-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Order Note - woocommerce/checkout-order-note-block
Allow customers to add a note to their order.
-- **Name:** woocommerce/checkout-order-note-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/checkout-order-note-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Order Summary - woocommerce/checkout-order-summary-block
Show customers a summary of their order.
-- **Name:** woocommerce/checkout-order-summary-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/checkout-order-summary-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Cart Items - woocommerce/checkout-order-summary-cart-items-block
Shows cart items.
-- **Name:** woocommerce/checkout-order-summary-cart-items-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-order-summary-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, disableProductDescriptions, lock
+- **Name:** woocommerce/checkout-order-summary-cart-items-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-order-summary-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, disableProductDescriptions, lock
## Coupon Form - woocommerce/checkout-order-summary-coupon-form-block
Shows the apply coupon form.
-- **Name:** woocommerce/checkout-order-summary-coupon-form-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-order-summary-block
-- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/checkout-order-summary-coupon-form-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-order-summary-block
+- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Discount - woocommerce/checkout-order-summary-discount-block
Shows the cart discount row.
-- **Name:** woocommerce/checkout-order-summary-discount-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-order-summary-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/checkout-order-summary-discount-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-order-summary-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Fees - woocommerce/checkout-order-summary-fee-block
Shows the cart fee row.
-- **Name:** woocommerce/checkout-order-summary-fee-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-order-summary-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/checkout-order-summary-fee-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-order-summary-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Shipping - woocommerce/checkout-order-summary-shipping-block
Shows the cart shipping row.
-- **Name:** woocommerce/checkout-order-summary-shipping-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-order-summary-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/checkout-order-summary-shipping-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-order-summary-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Subtotal - woocommerce/checkout-order-summary-subtotal-block
Shows the cart subtotal row.
-- **Name:** woocommerce/checkout-order-summary-subtotal-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-order-summary-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/checkout-order-summary-subtotal-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-order-summary-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Taxes - woocommerce/checkout-order-summary-taxes-block
Shows the cart taxes row.
-- **Name:** woocommerce/checkout-order-summary-taxes-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-order-summary-totals-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/checkout-order-summary-taxes-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-order-summary-totals-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Totals - woocommerce/checkout-order-summary-totals-block
Shows the subtotal, fees, discounts, shipping and taxes.
-- **Name:** woocommerce/checkout-order-summary-totals-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-order-summary-block
-- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** className, lock
+- **Name:** woocommerce/checkout-order-summary-totals-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-order-summary-block
+- **Supports:** ~~align~~, ~~html~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** className, lock
## Payment Options - woocommerce/checkout-payment-block
Payment options for your store.
-- **Name:** woocommerce/checkout-payment-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/checkout-payment-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Pickup Method - woocommerce/checkout-pickup-options-block
Shows local pickup locations.
-- **Name:** woocommerce/checkout-pickup-options-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/checkout-pickup-options-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Shipping Address - woocommerce/checkout-shipping-address-block
Collect your customer's shipping address.
-- **Name:** woocommerce/checkout-shipping-address-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/checkout-shipping-address-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Delivery - woocommerce/checkout-shipping-method-block
Select between shipping or local pickup.
-- **Name:** woocommerce/checkout-shipping-method-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/checkout-shipping-method-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Shipping Options - woocommerce/checkout-shipping-methods-block
Display shipping options and rates for your store.
-- **Name:** woocommerce/checkout-shipping-methods-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/checkout-shipping-methods-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Terms and Conditions - woocommerce/checkout-terms-block
Ensure that customers agree to your Terms & Conditions and Privacy Policy.
-- **Name:** woocommerce/checkout-terms-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout-fields-block
-- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** checkbox, className, showSeparator, text
+- **Name:** woocommerce/checkout-terms-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout-fields-block
+- **Supports:** ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** checkbox, className, showSeparator, text
## Checkout Totals - woocommerce/checkout-totals-block
Column containing the checkout totals.
-- **Name:** woocommerce/checkout-totals-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/checkout
-- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** checkbox, className, text
+- **Name:** woocommerce/checkout-totals-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/checkout
+- **Supports:** ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** checkbox, className, text
## Classic Shortcode - woocommerce/classic-shortcode
Renders classic WooCommerce shortcodes.
-- **Name:** woocommerce/classic-shortcode
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align, inserter, interactivity (~~clientNavigation~~), ~~html~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** align, shortcode
+- **Name:** woocommerce/classic-shortcode
+- **Category:** woocommerce
+- **Supports:** align, inserter, interactivity (~~clientNavigation~~), ~~html~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** align, shortcode
## Coming Soon - woocommerce/coming-soon
-- **Name:** woocommerce/coming-soon
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (background, text), ~~inserter~~
-- **Attributes:** color, comingSoonPatternId, storeOnly
+- **Name:** woocommerce/coming-soon
+- **Category:** woocommerce
+- **Supports:** color (background, text), ~~inserter~~
+- **Attributes:** color, comingSoonPatternId, storeOnly
+
+## Coupon Code - woocommerce/coupon-code
+
+Include a coupon code to entice customers to make a purchase.
+
+- **Name:** woocommerce/coupon-code
+- **Category:** woocommerce
+- **Supports:** align, color (background, text), email, spacing (margin, padding), typography (fontSize), ~~html~~
+- **Attributes:** couponCode
## Customer account - woocommerce/customer-account
A block that allows your customers to log in and out of their accounts in your store.
-- **Name:** woocommerce/customer-account
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align, color (background, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize)
-- **Attributes:** displayStyle, iconClass, iconStyle
+- **Name:** woocommerce/customer-account
+- **Category:** woocommerce
+- **Supports:** align, color (background, text), interactivity, spacing (margin, padding), typography (fontSize)
+- **Attributes:** displayStyle, hasDropdownNavigation, iconClass, iconStyle
## Email Content - woocommerce/email-content
A placeholder block for email content.
-- **Name:** woocommerce/email-content
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** email, ~~inserter~~
-- **Attributes:** emailType, postId
+- **Name:** woocommerce/email-content
+- **Category:** woocommerce
+- **Supports:** email, ~~inserter~~
+- **Attributes:** emailType, postId
## Featured Category - woocommerce/featured-category
Visually highlight a product category and encourage prompt action.
-- **Name:** woocommerce/featured-category
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), ariaLabel, color (background, text), filter (duotone), interactivity (clientNavigation), spacing (padding), ~~html~~
-- **Attributes:** alt, categoryId, contentAlign, dimRatio, focalPoint, hasParallax, imageFit, isRepeated, linkText, mediaId, mediaSrc, minHeight, overlayColor, overlayGradient, previewCategory
+- **Name:** woocommerce/featured-category
+- **Category:** woocommerce
+- **Supports:** align (full, wide), ariaLabel, color (background, text), filter (duotone), interactivity (clientNavigation), spacing (padding), ~~html~~
+- **Attributes:** alt, categoryId, contentAlign, dimRatio, focalPoint, hasParallax, imageFit, isRepeated, linkText, mediaId, mediaSrc, minHeight, overlayColor, overlayGradient, previewCategory
## Featured Product - woocommerce/featured-product
Highlight a product or variation.
-- **Name:** woocommerce/featured-product
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), ariaLabel, color (background, text), filter (duotone), interactivity (clientNavigation), multiple, spacing (padding), ~~html~~
-- **Attributes:** alt, contentAlign, dimRatio, focalPoint, hasParallax, imageFit, isRepeated, linkText, mediaId, mediaSrc, minHeight, overlayColor, overlayGradient, previewProduct, productId
+- **Name:** woocommerce/featured-product
+- **Category:** woocommerce
+- **Supports:** align (full, wide), ariaLabel, color (background, text), filter (duotone), interactivity (clientNavigation), multiple, spacing (padding), ~~html~~
+- **Attributes:** alt, contentAlign, dimRatio, focalPoint, hasParallax, imageFit, isRepeated, linkText, mediaId, mediaSrc, minHeight, overlayColor, overlayGradient, previewProduct, productId
## Filter Block - woocommerce/filter-wrapper
-- **Name:** woocommerce/filter-wrapper
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** interactivity (~~clientNavigation~~), ~~inserter~~
-- **Attributes:** filterType, heading
+- **Name:** woocommerce/filter-wrapper
+- **Category:** woocommerce
+- **Supports:** interactivity (~~clientNavigation~~), ~~inserter~~
+- **Attributes:** filterType, heading
## Hand-picked Products - woocommerce/handpicked-products
Display a selection of hand-picked products in a grid.
-- **Name:** woocommerce/handpicked-products
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
-- **Attributes:** align, alignButtons, columns, contentVisibility, isPreview, orderby, products
+- **Name:** woocommerce/handpicked-products
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
+- **Attributes:** align, alignButtons, columns, contentVisibility, isPreview, orderby, products
## Mini-Cart - woocommerce/mini-cart
Display a button for shoppers to quickly view their cart.
-- **Name:** woocommerce/mini-cart
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** spacing (margin, padding), typography (fontSize), ~~html~~, ~~multiple~~
-- **Attributes:** addToCartBehaviour, cartAndCheckoutRenderStyle, hasHiddenPrice, iconColor, iconColorValue, isPreview, miniCartIcon, onCartClickBehaviour, priceColor, priceColorValue, productCountColor, productCountColorValue, productCountVisibility
+- **Name:** woocommerce/mini-cart
+- **Category:** woocommerce
+- **Supports:** spacing (margin, padding), typography (fontSize), ~~html~~, ~~multiple~~
+- **Attributes:** addToCartBehaviour, cartAndCheckoutRenderStyle, hasHiddenPrice, iconColor, iconColorValue, miniCartIcon, onCartClickBehaviour, priceColor, priceColorValue, productCountColor, productCountColorValue, productCountVisibility
## Mini-Cart Contents - woocommerce/mini-cart-contents
Display a Mini-Cart widget.
-- **Name:** woocommerce/mini-cart-contents
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (background, link, text), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** isPreview, lock, width
+- **Name:** woocommerce/mini-cart-contents
+- **Category:** woocommerce
+- **Supports:** color (background, link, text), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock, width
## Empty Mini-Cart view - woocommerce/empty-mini-cart-contents-block
Blocks that are displayed when the Mini-Cart is empty.
-- **Name:** woocommerce/empty-mini-cart-contents-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/mini-cart-contents
-- **Supports:** interactivity, ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/empty-mini-cart-contents-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/mini-cart-contents
+- **Supports:** interactivity, ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Filled Mini-Cart view - woocommerce/filled-mini-cart-contents-block
Contains blocks that display the content of the Mini-Cart.
-- **Name:** woocommerce/filled-mini-cart-contents-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/mini-cart-contents
-- **Supports:** interactivity, ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/filled-mini-cart-contents-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/mini-cart-contents
+- **Supports:** interactivity, ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Mini-Cart View Cart Button - woocommerce/mini-cart-cart-button-block
Block that displays the cart button when the Mini-Cart has products.
-- **Name:** woocommerce/mini-cart-cart-button-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/mini-cart-footer-block
-- **Supports:** color (background, text), inserter, interactivity (clientNavigation), ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** cartButtonLabel, lock
+- **Name:** woocommerce/mini-cart-cart-button-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/mini-cart-footer-block
+- **Supports:** color (background, text), inserter, interactivity (clientNavigation), ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** cartButtonLabel, lock
## Mini-Cart Proceed to Checkout Button - woocommerce/mini-cart-checkout-button-block
Block that displays the checkout button when the Mini-Cart has products.
-- **Name:** woocommerce/mini-cart-checkout-button-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/mini-cart-footer-block
-- **Supports:** color (background, text), inserter, interactivity (clientNavigation), ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** checkoutButtonLabel, lock
+- **Name:** woocommerce/mini-cart-checkout-button-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/mini-cart-footer-block
+- **Supports:** color (background, text), inserter, interactivity (clientNavigation), ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** checkoutButtonLabel, lock
## Mini-Cart Footer - woocommerce/mini-cart-footer-block
Block that displays the footer of the Mini-Cart block.
-- **Name:** woocommerce/mini-cart-footer-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/filled-mini-cart-contents-block
-- **Supports:** interactivity, ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/mini-cart-footer-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/filled-mini-cart-contents-block
+- **Supports:** interactivity, ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Mini-Cart Items - woocommerce/mini-cart-items-block
Contains the products table and other custom blocks of filled mini-cart.
-- **Name:** woocommerce/mini-cart-items-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/filled-mini-cart-contents-block
-- **Supports:** interactivity (clientNavigation), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/mini-cart-items-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/filled-mini-cart-contents-block
+- **Supports:** interactivity (clientNavigation), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Mini-Cart Products Table - woocommerce/mini-cart-products-table-block
Block that displays the products table of the Mini-Cart block.
-- **Name:** woocommerce/mini-cart-products-table-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/mini-cart-items-block
-- **Supports:** interactivity, ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/mini-cart-products-table-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/mini-cart-items-block
+- **Supports:** interactivity, ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Mini-Cart Shopping Button - woocommerce/mini-cart-shopping-button-block
Block that displays the shopping button when the Mini-Cart is empty.
-- **Name:** woocommerce/mini-cart-shopping-button-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/empty-mini-cart-contents-block
-- **Supports:** color (background, text), inserter, interactivity (clientNavigation), ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock, startShoppingButtonLabel
+- **Name:** woocommerce/mini-cart-shopping-button-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/empty-mini-cart-contents-block
+- **Supports:** color (background, text), inserter, interactivity (clientNavigation), ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock, startShoppingButtonLabel
## Mini-Cart Title - woocommerce/mini-cart-title-block
Block that displays the title of the Mini-Cart block.
-- **Name:** woocommerce/mini-cart-title-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/filled-mini-cart-contents-block
-- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** lock
+- **Name:** woocommerce/mini-cart-title-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/filled-mini-cart-contents-block
+- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** lock
## Mini-Cart Title Items Counter - woocommerce/mini-cart-title-items-counter-block
Block that displays the items counter part of the Mini-Cart Title block.
-- **Name:** woocommerce/mini-cart-title-items-counter-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/mini-cart-title-block
-- **Supports:** color (background, text), interactivity, spacing (padding), typography (fontSize), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:**
+- **Name:** woocommerce/mini-cart-title-items-counter-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/mini-cart-title-block
+- **Supports:** color (background, text), interactivity, spacing (padding), typography (fontSize), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
## Mini-Cart Title Label - woocommerce/mini-cart-title-label-block
Block that displays the 'Your cart' part of the Mini-Cart Title block.
-- **Name:** woocommerce/mini-cart-title-label-block
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:** woocommerce/mini-cart-title-block
-- **Supports:** color (background, text), interactivity (clientNavigation), spacing (padding), typography (fontSize), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
-- **Attributes:** label
+- **Name:** woocommerce/mini-cart-title-label-block
+- **Category:** woocommerce
+- **Parent:** woocommerce/mini-cart-title-block
+- **Supports:** color (background, text), interactivity (clientNavigation), spacing (padding), typography (fontSize), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
+- **Attributes:** label
## Next/Previous Buttons - woocommerce/product-gallery-large-image-next-previous
Display next and previous buttons.
-- **Name:** woocommerce/product-gallery-large-image-next-previous
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-gallery-large-image, woocommerce/product-collection
-- **Parent:**
-- **Supports:** align, color (background, text), interactivity, layout (allowVerticalAlignment, default, ~~allowJustification~~, ~~allowOrientation~~), shadow, spacing (margin)
-- **Attributes:**
+- **Name:** woocommerce/product-gallery-large-image-next-previous
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-gallery-large-image, woocommerce/product-collection
+- **Supports:** align, color (background, text), interactivity, layout (allowVerticalAlignment, default, ~~allowJustification~~, ~~allowOrientation~~), shadow, spacing (margin)
## Additional Field List - woocommerce/order-confirmation-additional-fields
Display the list of additional field values from the current order.
-- **Name:** woocommerce/order-confirmation-additional-fields
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
-- **Attributes:** align, className
+- **Name:** woocommerce/order-confirmation-additional-fields
+- **Category:** woocommerce
+- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
+- **Attributes:** align, className
## Additional Fields - woocommerce/order-confirmation-additional-fields-wrapper
Display additional checkout fields from the 'contact' and 'order' locations.
-- **Name:** woocommerce/order-confirmation-additional-fields-wrapper
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
-- **Attributes:** heading
+- **Name:** woocommerce/order-confirmation-additional-fields-wrapper
+- **Category:** woocommerce
+- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
+- **Attributes:** heading
## Additional Information - woocommerce/order-confirmation-additional-information
Displays additional information provided by third-party extensions for the current order.
-- **Name:** woocommerce/order-confirmation-additional-information
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
-- **Attributes:** align, className
+- **Name:** woocommerce/order-confirmation-additional-information
+- **Category:** woocommerce
+- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
+- **Attributes:** align, className
## Billing Address - woocommerce/order-confirmation-billing-address
Display the order confirmation billing address.
-- **Name:** woocommerce/order-confirmation-billing-address
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), color (background, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~inserter~~, ~~multiple~~
-- **Attributes:** align
+- **Name:** woocommerce/order-confirmation-billing-address
+- **Category:** woocommerce
+- **Supports:** align (full, wide), color (background, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~inserter~~, ~~multiple~~
+- **Attributes:** align
## Billing Address Section - woocommerce/order-confirmation-billing-wrapper
Display the order confirmation billing section.
-- **Name:** woocommerce/order-confirmation-billing-wrapper
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
-- **Attributes:** heading
+- **Name:** woocommerce/order-confirmation-billing-wrapper
+- **Category:** woocommerce
+- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
+- **Attributes:** heading
## Account Creation - woocommerce/order-confirmation-create-account
Allow customers to create an account after their purchase.
-- **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
+- **Name:** woocommerce/order-confirmation-create-account
+- **Category:** woocommerce
+- **Supports:** align (full, wide), color (background, button, text), spacing (margin, padding), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
+- **Attributes:** align, className, customerEmail, hasDarkControls, lock, nonceToken
## Order Downloads - woocommerce/order-confirmation-downloads
Display links to purchased 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
+- **Name:** woocommerce/order-confirmation-downloads
+- **Category:** woocommerce
+- **Supports:** align (full, wide), color (background, gradients, link, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~multiple~~
+- **Attributes:** align, className
## Downloads Section - woocommerce/order-confirmation-downloads-wrapper
Display the downloadable products section.
-- **Name:** woocommerce/order-confirmation-downloads-wrapper
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
-- **Attributes:** heading
+- **Name:** woocommerce/order-confirmation-downloads-wrapper
+- **Category:** woocommerce
+- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
+- **Attributes:** heading
## Shipping Address - woocommerce/order-confirmation-shipping-address
Display the 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
+- **Name:** woocommerce/order-confirmation-shipping-address
+- **Category:** woocommerce
+- **Supports:** align (full, wide), color (background, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~inserter~~, ~~multiple~~
+- **Attributes:** align
## Shipping Address Section - woocommerce/order-confirmation-shipping-wrapper
Display the order confirmation shipping section.
-- **Name:** woocommerce/order-confirmation-shipping-wrapper
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
-- **Attributes:** heading
+- **Name:** woocommerce/order-confirmation-shipping-wrapper
+- **Category:** woocommerce
+- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
+- **Attributes:** heading
## Order Status - woocommerce/order-confirmation-status
Display a "thank you" message, or a sentence regarding the current order 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
+- **Name:** woocommerce/order-confirmation-status
+- **Category:** woocommerce
+- **Supports:** align (full, wide), color (background, gradients, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~multiple~~
+- **Attributes:** align, className
## Order Summary - woocommerce/order-confirmation-summary
Display the order summary on the order confirmation page.
-- **Name:** woocommerce/order-confirmation-summary
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), color (background, gradients, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~multiple~~
-- **Attributes:** align, className
+- **Name:** woocommerce/order-confirmation-summary
+- **Category:** woocommerce
+- **Supports:** align (full, wide), color (background, gradients, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~multiple~~
+- **Attributes:** align, className
## Order Totals - woocommerce/order-confirmation-totals
Display the items purchased and order totals.
-- **Name:** woocommerce/order-confirmation-totals
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), color (background, gradients, link, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~multiple~~
-- **Attributes:** align, className
+- **Name:** woocommerce/order-confirmation-totals
+- **Category:** woocommerce
+- **Supports:** align (full, wide), color (background, gradients, link, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~multiple~~
+- **Attributes:** align, className
## Order Totals Section - woocommerce/order-confirmation-totals-wrapper
Display the order details section.
-- **Name:** woocommerce/order-confirmation-totals-wrapper
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
-- **Attributes:** heading
+- **Name:** woocommerce/order-confirmation-totals-wrapper
+- **Category:** woocommerce
+- **Supports:** align (full, wide), spacing (margin, padding), ~~html~~, ~~multiple~~
+- **Attributes:** heading
## WooCommerce Page - woocommerce/page-content-wrapper
Displays WooCommerce page content.
-- **Name:** woocommerce/page-content-wrapper
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** ~~html~~, ~~inserter~~, ~~multiple~~
-- **Attributes:** page
+- **Name:** woocommerce/page-content-wrapper
+- **Category:** woocommerce
+- **Supports:** ~~html~~, ~~inserter~~, ~~multiple~~
+- **Attributes:** page
## Payment Method Icons - woocommerce/payment-method-icons
Display icons for available payment methods.
-- **Name:** woocommerce/payment-method-icons
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** spacing (margin, padding)
-- **Attributes:** numberOfIcons
+- **Name:** woocommerce/payment-method-icons
+- **Category:** woocommerce
+- **Supports:** spacing (margin, padding)
+- **Attributes:** numberOfIcons
## Filter by Price Controls - woocommerce/price-filter
Enable customers to filter the product grid by choosing a price range.
-- **Name:** woocommerce/price-filter
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
-- **Attributes:** className, headingLevel, inlineInput, showFilterButton, showInputFields
+- **Name:** woocommerce/price-filter
+- **Category:** woocommerce
+- **Supports:** color (text, ~~background~~), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
+- **Attributes:** className, headingLevel, inlineInput, showFilterButton, showInputFields
## Best Selling Products - woocommerce/product-best-sellers
Display a grid of your all-time best selling products.
-- **Name:** woocommerce/product-best-sellers
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
-- **Attributes:** alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus
+- **Name:** woocommerce/product-best-sellers
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
+- **Attributes:** alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus
## Product Categories List - woocommerce/product-categories
Show all product categories as a list or dropdown.
-- **Name:** woocommerce/product-categories
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), color (link, text, ~~background~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** align, hasCount, hasEmpty, hasImage, isDropdown, isHierarchical, showChildrenOnly
+- **Name:** woocommerce/product-categories
+- **Category:** woocommerce
+- **Supports:** align (full, wide), color (link, text, ~~background~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** align, hasCount, hasEmpty, hasImage, isDropdown, isHierarchical, showChildrenOnly
## Products by Category - woocommerce/product-category
Display a grid of products from your selected categories.
-- **Name:** woocommerce/product-category
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
-- **Attributes:** alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus
+- **Name:** woocommerce/product-category
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
+- **Attributes:** alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus
## Product Collection - woocommerce/product-collection
Display a collection of products from your store.
-- **Name:** woocommerce/product-collection
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), anchor, email, interactivity, ~~html~~
-- **Attributes:** __privatePreviewState, collection, convertedFromProducts, dimensions, displayLayout, forcePageReload, hideControls, query, queryContextIncludes, queryId, tagName
+- **Name:** woocommerce/product-collection
+- **Category:** woocommerce
+- **Supports:** align (full, wide), anchor, email, interactivity, ~~html~~
+- **Attributes:** __privatePreviewState, collection, convertedFromProducts, dimensions, displayLayout, forcePageReload, hideControls, query, queryContextIncludes, queryId, tagName
## No results - woocommerce/product-collection-no-results
The contents of this block will display when there are no products found.
-- **Name:** woocommerce/product-collection-no-results
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-collection
-- **Parent:**
-- **Supports:** align, color (background, gradients, link, text), email, interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
-- **Attributes:**
+- **Name:** woocommerce/product-collection-no-results
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-collection
+- **Supports:** align, color (background, gradients, link, text), email, interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
## Product Description - woocommerce/product-description
Displays the description of the product.
-- **Name:** woocommerce/product-description
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/single-product, woocommerce/product-template, core/post-template
-- **Parent:**
-- **Supports:** 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~~
-- **Attributes:**
+- **Name:** woocommerce/product-description
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/single-product, woocommerce/product-template, core/post-template
+- **Supports:** 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~~
## Product Details - woocommerce/product-details
Display a product's description, attributes, and reviews
-- **Name:** woocommerce/product-details
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), interactivity (clientNavigation)
-- **Attributes:** align, hideTabTitle
-
-## Add to Cart with Options - woocommerce/add-to-cart-form
-
-Display a button that lets customers add a product to their cart. Use the added options to optimize for different product types.
-
-- **Name:** woocommerce/add-to-cart-form
-- **Category:** woocommerce-product-elements
-- **Ancestor:**
-- **Parent:**
-- **Supports:** interactivity
-- **Attributes:** quantitySelectorStyle
+- **Name:** woocommerce/product-details
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (clientNavigation)
+- **Attributes:** align, hideTabTitle
## Product Filters - woocommerce/product-filters
Let shoppers filter products displayed on the page.
-- **Name:** woocommerce/product-filters
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align, color (background, button, heading, text, ~~enableContrastChecker~~), inserter, interactivity, layout (default, ~~allowEditing~~), multiple, spacing (blockGap), typography (fontSize)
-- **Attributes:** isPreview
+- **Name:** woocommerce/product-filters
+- **Category:** woocommerce
+- **Supports:** align, color (background, button, heading, text, ~~enableContrastChecker~~), inserter, interactivity, layout (default, ~~allowEditing~~), multiple, spacing (blockGap), typography (fontSize)
+- **Attributes:** isPreview
## Active Filters - woocommerce/product-filter-active
Display the currently active filters.
-- **Name:** woocommerce/product-filter-active
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filters
-- **Parent:**
-- **Supports:** interactivity, spacing (margin, padding, ~~blockGap~~)
-- **Attributes:**
+- **Name:** woocommerce/product-filter-active
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filters
+- **Supports:** interactivity, spacing (margin, padding, ~~blockGap~~)
## Attribute Filter - woocommerce/product-filter-attribute
Enable customers to filter the product grid by selecting one or more attributes, such as color.
-- **Name:** woocommerce/product-filter-attribute
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filters
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity, spacing (blockGap, margin, padding), typography (fontSize, lineHeight)
-- **Attributes:** attributeId, displayStyle, hideEmpty, isPreview, queryType, selectType, showCounts, sortOrder
+- **Name:** woocommerce/product-filter-attribute
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filters
+- **Supports:** color (text, ~~background~~), interactivity, spacing (blockGap, margin, padding), typography (fontSize, lineHeight)
+- **Attributes:** attributeId, displayStyle, hideEmpty, isPreview, queryType, selectType, showCounts, sortOrder
## List - woocommerce/product-filter-checkbox-list
Display a list of filter options.
-- **Name:** woocommerce/product-filter-checkbox-list
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filter-attribute, woocommerce/product-filter-status, woocommerce/product-filter-taxonomy, woocommerce/product-filter-rating
-- **Parent:**
-- **Supports:** interactivity
-- **Attributes:** customLabelElement, customOptionElement, customOptionElementBorder, customOptionElementSelected, labelElement, optionElement, optionElementBorder, optionElementSelected
+- **Name:** woocommerce/product-filter-checkbox-list
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filter-attribute, woocommerce/product-filter-status, woocommerce/product-filter-taxonomy, woocommerce/product-filter-rating
+- **Supports:** interactivity
+- **Attributes:** customLabelElement, customOptionElement, customOptionElementBorder, customOptionElementSelected, labelElement, optionElement, optionElementBorder, optionElementSelected
## Chips - woocommerce/product-filter-chips
Display filter options as chips.
-- **Name:** woocommerce/product-filter-chips
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filter-attribute, woocommerce/product-filter-taxonomy, woocommerce/product-filter-status
-- **Parent:**
-- **Supports:** interactivity
-- **Attributes:** chipBackground, chipBorder, chipText, customChipBackground, customChipBorder, customChipText, customSelectedChipBackground, customSelectedChipBorder, customSelectedChipText, selectedChipBackground, selectedChipBorder, selectedChipText
+- **Name:** woocommerce/product-filter-chips
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filter-attribute, woocommerce/product-filter-taxonomy, woocommerce/product-filter-status
+- **Supports:** interactivity
+- **Attributes:** chipBackground, chipBorder, chipText, customChipBackground, customChipBorder, customChipText, customSelectedChipBackground, customSelectedChipBorder, customSelectedChipText, selectedChipBackground, selectedChipBorder, selectedChipText
## Clear filters - woocommerce/product-filter-clear-button
Allows shoppers to clear active filters.
-- **Name:** woocommerce/product-filter-clear-button
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filter-active
-- **Parent:**
-- **Supports:** inserter, interactivity
-- **Attributes:**
+- **Name:** woocommerce/product-filter-clear-button
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filter-active
+- **Supports:** inserter, interactivity
## Price Filter - woocommerce/product-filter-price
Let shoppers filter products by choosing a price range.
-- **Name:** woocommerce/product-filter-price
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filters
-- **Parent:**
-- **Supports:** interactivity, ~~html~~
-- **Attributes:**
+- **Name:** woocommerce/product-filter-price
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filters
+- **Supports:** interactivity, ~~html~~
## Price Slider - woocommerce/product-filter-price-slider
A slider helps shopper choose a price range.
-- **Name:** woocommerce/product-filter-price-slider
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filter-price
-- **Parent:**
-- **Supports:** color (~~background~~, ~~enableContrastChecker~~, ~~text~~), interactivity, ~~html~~
-- **Attributes:** customSlider, customSliderHandle, customSliderHandleBorder, inlineInput, showInputFields, slider, sliderHandle, sliderHandleBorder
+- **Name:** woocommerce/product-filter-price-slider
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filter-price
+- **Supports:** color (~~background~~, ~~enableContrastChecker~~, ~~text~~), interactivity, ~~html~~
+- **Attributes:** customSlider, customSliderHandle, customSliderHandleBorder, inlineInput, showInputFields, slider, sliderHandle, sliderHandleBorder
## Rating Filter - woocommerce/product-filter-rating
Enable customers to filter the product collection by rating.
-- **Name:** woocommerce/product-filter-rating
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filters
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity
-- **Attributes:** className, isPreview, minRating, showCounts
+- **Name:** woocommerce/product-filter-rating
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filters
+- **Supports:** color (text, ~~background~~), interactivity
+- **Attributes:** className, isPreview, minRating, showCounts
## Chips - woocommerce/product-filter-removable-chips
Display removable active filters as chips.
-- **Name:** woocommerce/product-filter-removable-chips
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filter-active
-- **Parent:**
-- **Supports:** interactivity, layout (default, ~~allowInheriting~~, ~~allowSwitching~~, ~~allowVerticalAlignment~~)
-- **Attributes:** chipBackground, chipBorder, chipText, customChipBackground, customChipBorder, customChipText
+- **Name:** woocommerce/product-filter-removable-chips
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filter-active
+- **Supports:** interactivity, layout (default, ~~allowInheriting~~, ~~allowSwitching~~, ~~allowVerticalAlignment~~)
+- **Attributes:** chipBackground, chipBorder, chipText, customChipBackground, customChipBorder, customChipText
## Status Filter - woocommerce/product-filter-status
Let shoppers filter products by choosing stock status.
-- **Name:** woocommerce/product-filter-status
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filters
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity, spacing (blockGap, margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** displayStyle, hideEmpty, isPreview, showCounts
+- **Name:** woocommerce/product-filter-status
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filters
+- **Supports:** color (text, ~~background~~), interactivity, spacing (blockGap, margin, padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** displayStyle, hideEmpty, isPreview, showCounts
## Taxonomy Filter - woocommerce/product-filter-taxonomy
Enable customers to filter the product collection by selecting one or more taxonomy terms, such as categories, brands, or tags.
-- **Name:** woocommerce/product-filter-taxonomy
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-filters
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity, spacing (blockGap, margin, padding), typography (fontSize, lineHeight)
-- **Attributes:** displayStyle, hideEmpty, isPreview, showCounts, sortOrder, taxonomy
+- **Name:** woocommerce/product-filter-taxonomy
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-filters
+- **Supports:** color (text, ~~background~~), interactivity, spacing (blockGap, margin, padding), typography (fontSize, lineHeight)
+- **Attributes:** displayStyle, hideEmpty, isPreview, showCounts, sortOrder, taxonomy
## Product Gallery - woocommerce/product-gallery
Showcase your products relevant images and media.
-- **Name:** woocommerce/product-gallery
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/single-product
-- **Parent:**
-- **Supports:** align, email, interactivity, layout (allowEditing, allowOrientation, default, ~~allowJustification~~)
-- **Attributes:** fullScreenOnClick, hoverZoom
+- **Name:** woocommerce/product-gallery
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/single-product
+- **Supports:** align, email, interactivity, layout (allowEditing, allowOrientation, default, ~~allowJustification~~)
+- **Attributes:** fullScreenOnClick, hoverZoom
-## Large Image - woocommerce/product-gallery-large-image
+## Viewer - woocommerce/product-gallery-large-image
-Display the Large Image of a product.
+Container for the current gallery image, navigation buttons, zoom functionality and more.
-- **Name:** woocommerce/product-gallery-large-image
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-gallery
-- **Parent:**
-- **Supports:** interactivity
-- **Attributes:**
+- **Name:** woocommerce/product-gallery-large-image
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-gallery
+- **Supports:** interactivity
## Thumbnails - woocommerce/product-gallery-thumbnails
Display the Thumbnails of a product.
-- **Name:** woocommerce/product-gallery-thumbnails
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-gallery
-- **Parent:**
-- **Supports:** interactivity, spacing (margin)
-- **Attributes:** aspectRatio, thumbnailSize
+- **Name:** woocommerce/product-gallery-thumbnails
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-gallery
+- **Supports:** interactivity, spacing (margin)
+- **Attributes:** activeThumbnailStyle, aspectRatio, thumbnailSize
## Newest Products - woocommerce/product-new
Display a grid of your newest products.
-- **Name:** woocommerce/product-new
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
-- **Attributes:** alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus
+- **Name:** woocommerce/product-new
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
+- **Attributes:** alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus
## On Sale Products - woocommerce/product-on-sale
Display a grid of products currently on sale.
-- **Name:** woocommerce/product-on-sale
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
-- **Attributes:** alignButtons, catOperator, categories, columns, contentVisibility, isPreview, orderby, rows, stockStatus
+- **Name:** woocommerce/product-on-sale
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
+- **Attributes:** alignButtons, catOperator, categories, columns, contentVisibility, isPreview, orderby, rows, stockStatus
## Product Results Count - woocommerce/product-results-count
Display the number of products on the archive page or search result page.
-- **Name:** woocommerce/product-results-count
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize)
-- **Attributes:**
+- **Name:** woocommerce/product-results-count
+- **Category:** woocommerce
+- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize)
## Product Reviews - woocommerce/product-reviews
Display a product's reviews
-- **Name:** woocommerce/product-reviews
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), color (background, gradients, heading, link, text), interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** tagName
+- **Name:** woocommerce/product-reviews
+- **Category:** woocommerce
+- **Supports:** align (full, wide), color (background, gradients, heading, link, text), interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** tagName
## Review Author Name - woocommerce/product-review-author-name
Displays the name of the author of the review.
-- **Name:** woocommerce/product-review-author-name
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-reviews
-- **Parent:**
-- **Supports:** color (background, gradients, link, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** isLink, linkTarget, textAlign
+- **Name:** woocommerce/product-review-author-name
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-reviews
+- **Supports:** color (background, gradients, link, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** isLink, linkTarget, textAlign
## Review Content - woocommerce/product-review-content
Displays the contents of a product review.
-- **Name:** woocommerce/product-review-content
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-reviews
-- **Parent:**
-- **Supports:** color (background, gradients, link, text), spacing (padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** textAlign
+- **Name:** woocommerce/product-review-content
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-reviews
+- **Supports:** color (background, gradients, link, text), spacing (padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** textAlign
## Review Date - woocommerce/product-review-date
Displays the date on which the review was posted.
-- **Name:** woocommerce/product-review-date
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-reviews
-- **Parent:**
-- **Supports:** color (background, gradients, link, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** format, isLink
+- **Name:** woocommerce/product-review-date
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-reviews
+- **Supports:** color (background, gradients, link, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** format, isLink
## Reviews Form - woocommerce/product-review-form
Display a product's reviews form.
-- **Name:** woocommerce/product-review-form
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (background, gradients, heading, link, text), interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** textAlign
+- **Name:** woocommerce/product-review-form
+- **Category:** woocommerce
+- **Supports:** color (background, gradients, heading, link, text), interactivity, spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** textAlign
## Review Rating - woocommerce/product-review-rating
Displays the rating of a product review.
-- **Name:** woocommerce/product-review-rating
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-reviews
-- **Parent:**
-- **Supports:** color (background, gradients, text), interactivity (clientNavigation)
-- **Attributes:** textAlign
+- **Name:** woocommerce/product-review-rating
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-reviews
+- **Supports:** color (background, gradients, text), interactivity (clientNavigation)
+- **Attributes:** textAlign
## Reviews Template - woocommerce/product-review-template
Contains the block elements used to display product reviews, like the title, author, date, rating and more.
-- **Name:** woocommerce/product-review-template
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-reviews
-- **Parent:**
-- **Supports:** align, interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
-- **Attributes:**
+- **Name:** woocommerce/product-review-template
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-reviews
+- **Supports:** align, interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
## Reviews Pagination - woocommerce/product-reviews-pagination
Displays a paginated navigation to next/previous set of product reviews, when applicable.
-- **Name:** woocommerce/product-reviews-pagination
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-reviews
-- **Parent:**
-- **Supports:** align, color (background, gradients, link, text), interactivity (clientNavigation), layout (default, ~~allowInheriting~~, ~~allowSwitching~~), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
-- **Attributes:** paginationArrow
+- **Name:** woocommerce/product-reviews-pagination
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-reviews
+- **Supports:** align, color (background, gradients, link, text), interactivity (clientNavigation), layout (default, ~~allowInheriting~~, ~~allowSwitching~~), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
+- **Attributes:** paginationArrow
## Reviews Next Page - woocommerce/product-reviews-pagination-next
Displays the next product review's page link.
-- **Name:** woocommerce/product-reviews-pagination-next
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-reviews-pagination
-- **Parent:**
-- **Supports:** color (background, gradients, ~~text~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
-- **Attributes:** label
+- **Name:** woocommerce/product-reviews-pagination-next
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-reviews-pagination
+- **Supports:** color (background, gradients, ~~text~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
+- **Attributes:** label
## Reviews Page Numbers - woocommerce/product-reviews-pagination-numbers
Displays a list of page numbers for product reviews pagination.
-- **Name:** woocommerce/product-reviews-pagination-numbers
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-reviews-pagination
-- **Parent:**
-- **Supports:** color (background, gradients, ~~text~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
-- **Attributes:**
+- **Name:** woocommerce/product-reviews-pagination-numbers
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-reviews-pagination
+- **Supports:** color (background, gradients, ~~text~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
## Reviews Previous Page - woocommerce/product-reviews-pagination-previous
Displays the previous product review's page link.
-- **Name:** woocommerce/product-reviews-pagination-previous
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-reviews-pagination
-- **Parent:**
-- **Supports:** color (background, gradients, ~~text~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
-- **Attributes:** label
+- **Name:** woocommerce/product-reviews-pagination-previous
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-reviews-pagination
+- **Supports:** color (background, gradients, ~~text~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
+- **Attributes:** label
## Reviews Title - woocommerce/product-reviews-title
Displays a title with the number of reviews.
-- **Name:** woocommerce/product-reviews-title
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/product-reviews
-- **Parent:**
-- **Supports:** align, color (background, gradients, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~anchor~~, ~~html~~
-- **Attributes:** level, levelOptions, showProductTitle, showReviewsCount, textAlign
+- **Name:** woocommerce/product-reviews-title
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/product-reviews
+- **Supports:** align, color (background, gradients, text), interactivity (clientNavigation), spacing (margin, padding), typography (fontSize, lineHeight), ~~anchor~~, ~~html~~
+- **Attributes:** level, levelOptions, showProductTitle, showReviewsCount, textAlign
## Product Specifications - woocommerce/product-specifications
Display product weight, dimensions, and attributes.
-- **Name:** woocommerce/product-specifications
-- **Category:** woocommerce
-- **Ancestor:** woocommerce/single-product, woocommerce/product-template, core/post-template
-- **Parent:**
-- **Supports:** align (full, wide), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
-- **Attributes:** showAttributes, showDimensions, showWeight
+- **Name:** woocommerce/product-specifications
+- **Category:** woocommerce
+- **Ancestor:** woocommerce/single-product, woocommerce/product-template, core/post-template
+- **Supports:** align (full, wide), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
+- **Attributes:** showAttributes, showDimensions, showWeight
## Products by Tag - woocommerce/product-tag
Display a grid of products with selected tags.
-- **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
+- **Name:** woocommerce/product-tag
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
+- **Attributes:** alignButtons, columns, contentVisibility, isPreview, orderby, rows, stockStatus, tagOperator, tags
## Product Template - woocommerce/product-template
Contains the block elements used to render a product.
-- **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:**
+- **Name:** woocommerce/product-template
+- **Category:** woocommerce
+- **Supports:** align (full, wide), anchor, color (background, gradients, link, text), email, interactivity, layout (~~allowEditing~~, ~~allowInheriting~~, ~~allowSizingOnChildren~~, ~~allowSwitching~~, ~~allowVerticalAlignment~~), typography (fontSize, lineHeight), ~~html~~, ~~inserter~~, ~~reusable~~
## Top Rated Products - woocommerce/product-top-rated
Display a grid of your top rated products.
-- **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
+- **Name:** woocommerce/product-top-rated
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
+- **Attributes:** alignButtons, catOperator, categories, columns, contentVisibility, editMode, isPreview, orderby, rows, stockStatus
## All Products - woocommerce/all-products
Display products from your store in a grid layout.
-- **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
+- **Name:** woocommerce/all-products
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~multiple~~
+- **Attributes:** alignButtons, columns, contentVisibility, isPreview, layoutConfig, orderby, rows
## Products by Attribute - woocommerce/products-by-attribute
Display a grid of products with selected attributes.
-- **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
+- **Name:** woocommerce/products-by-attribute
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~
+- **Attributes:** alignButtons, attrOperator, attributes, columns, contentVisibility, isPreview, orderby, rows, stockStatus
## Filter by Rating Controls - woocommerce/rating-filter
Enable customers to filter the product grid by rating.
-- **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
+- **Name:** woocommerce/rating-filter
+- **Category:** woocommerce
+- **Supports:** color (background, button, text), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
+- **Attributes:** className, displayStyle, isPreview, selectType, showCounts, showFilterButton
## All Reviews - woocommerce/all-reviews
Show a list of all product reviews.
-- **Name:** woocommerce/all-reviews
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize), ~~html~~
-- **Attributes:**
+- **Name:** woocommerce/all-reviews
+- **Category:** woocommerce
+- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize), ~~html~~
## Reviews by Category - woocommerce/reviews-by-category
Show product reviews from specific categories.
-- **Name:** woocommerce/reviews-by-category
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize), ~~html~~
-- **Attributes:**
+- **Name:** woocommerce/reviews-by-category
+- **Category:** woocommerce
+- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize), ~~html~~
## Reviews by Product - woocommerce/reviews-by-product
Display reviews for your products.
-- **Name:** woocommerce/reviews-by-product
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize), ~~html~~
-- **Attributes:**
+- **Name:** woocommerce/reviews-by-product
+- **Category:** woocommerce
+- **Supports:** color (text, ~~background~~), interactivity (clientNavigation), typography (fontSize), ~~html~~
## Product - woocommerce/single-product
Display a single product of your choice with full control over its presentation.
-- **Name:** woocommerce/single-product
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), interactivity
-- **Attributes:** isPreview, productId
+- **Name:** woocommerce/single-product
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity
+- **Attributes:** isPreview, productId
## Filter by Stock Controls - woocommerce/stock-filter
Enable customers to filter the product grid by stock status.
-- **Name:** woocommerce/stock-filter
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** color (background, button, text), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
-- **Attributes:** className, displayStyle, headingLevel, isPreview, selectType, showCounts, showFilterButton
+- **Name:** woocommerce/stock-filter
+- **Category:** woocommerce
+- **Supports:** color (background, button, text), interactivity (~~clientNavigation~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
+- **Attributes:** className, displayStyle, headingLevel, isPreview, selectType, showCounts, showFilterButton
## Store Notices - woocommerce/store-notices
Display shopper-facing notifications generated by WooCommerce or extensions.
-- **Name:** woocommerce/store-notices
-- **Category:** woocommerce
-- **Ancestor:**
-- **Parent:**
-- **Supports:** align (full, wide), interactivity (clientNavigation), ~~multiple~~
-- **Attributes:** align
+- **Name:** woocommerce/store-notices
+- **Category:** woocommerce
+- **Supports:** align (full, wide), interactivity (clientNavigation), ~~multiple~~
+- **Attributes:** align
-<!-- END Autogenerated - DO NOT EDIT -->
+{/* END Autogenerated - DO NOT EDIT */}
diff --git a/docs/block-development/reference/data-store/checkout.md b/docs/block-development/reference/data-store/checkout.md
index bcad6a710f0..d4d5b4ed176 100644
--- a/docs/block-development/reference/data-store/checkout.md
+++ b/docs/block-development/reference/data-store/checkout.md
@@ -34,11 +34,11 @@ const { checkoutStore } = window.wc.wcBlocksData
Returns the WordPress user ID of the customer whose order is currently processed by the Checkout block.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `number`: The WordPress user ID of the customer.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -49,11 +49,11 @@ const customerId = store.getCustomerId();
Returns the WooCommerce order ID of the order that is currently being processed by the Checkout block.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `number`: The WooCommerce order ID.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -64,11 +64,11 @@ const orderId = store.getOrderId();
Returns the order notes.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `string`: The order notes.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -79,11 +79,11 @@ const orderNotes = store.getOrderNotes();
Returns the URL to redirect to after checkout is complete.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `string`: The URL to redirect to.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -94,7 +94,7 @@ const redirectUrl = store.getRedirectUrl();
Returns the extra data registered by extensions.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `object`: The extra data registered by extensions.
@@ -106,7 +106,7 @@ Returns the extra data registered by extensions.
}
```
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -117,11 +117,11 @@ const extensionData = store.getExtensionData();
Returns the current status of the checkout process.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `string`: The current status of the checkout process. Possible values are: `pristine`, `before-processing`, `processing`, `after-processing`, `complete`, `idle`.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -132,11 +132,11 @@ const checkoutStatus = store.getCheckoutStatus();
Returns true if the shopper has opted to create an account with their order.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if the shopper has opted to create an account with their order.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -147,11 +147,11 @@ const shouldCreateAccount = store.getShouldCreateAccount();
Returns true if the shopper has opted to use their shipping address as their billing address.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if the shipping address should be used as the billing address.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -162,11 +162,11 @@ const useShippingAsBilling = store.getUseShippingAsBilling();
Returns true if the billing address is being edited.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if the billing address is being edited.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -177,11 +177,11 @@ const editingBillingAddress = store.getEditingBillingAddress();
Returns true if the shipping address is being edited.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if the shipping address is being edited.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -192,11 +192,11 @@ const editingShippingAddress = store.getEditingShippingAddress();
Returns true if an error occurred, and false otherwise.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if an error occurred.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -207,11 +207,11 @@ const hasError = store.hasError();
Returns true if a draft order had been created, and false otherwise.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if a draft order had been created.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -222,11 +222,11 @@ const hasOrder = store.hasOrder();
When the checkout status is `IDLE` this flag is true. Checkout will be this status after any change to checkout state after the block is loaded. It will also be this status when retrying a purchase is possible after processing happens with an error.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if the checkout has had some activity, but is currently waiting for user input.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -237,11 +237,11 @@ const isIdle = store.isIdle();
When the checkout status is `BEFORE_PROCESSING` this flag is true. Checkout will be this status when the user submits checkout for processing.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if an order is about to be processed.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -252,11 +252,11 @@ const isBeforeProcessing = store.isBeforeProcessing();
When the checkout status is `PROCESSING` this flag is true. Checkout will be this status when all the observers on the event emitted with the `BEFORE_PROCESSING` status are completed without error. It is during this status that the block will be sending a request to the server on the checkout endpoint for processing the order.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if the checkout is processing.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -267,11 +267,11 @@ const isProcessing = store.isProcessing();
When the checkout status is `AFTER_PROCESSING` this flag is true. Checkout will have this status after the block receives the response from the server side processing request.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if an order had just been processed.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -282,11 +282,11 @@ const isAfterProcessing = store.isAfterProcessing();
When the checkout status is `COMPLETE` this flag is true. Checkout will have this status after all observers on the events emitted during the `AFTER_PROCESSING` status are completed successfully. When checkout is at this status, the shopper's browser will be redirected to the value of `redirectUrl` at that point (usually the `order-received` route).
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if the order is complete.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -297,11 +297,11 @@ const isComplete = store.isComplete();
This is true when the total is being re-calculated for the order. There are numerous things that might trigger a recalculation of the total: coupons being added or removed, shipping rates updated, shipping rate selected etc. This flag consolidates all activity that might be occurring (including requests to the server that potentially affect calculation of totals). So instead of having to check each of those individual states you can reliably just check if this boolean is true (calculating) or false (not calculating).
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- `boolean`: True if there is an in-flight request to update any values.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -312,11 +312,11 @@ const isCalculating = store.isCalculating();
Returns true if the customer prefers to collect their order, and false otherwise.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- _prefersCollection_ `boolean`: True if the shopper prefers to collect their order.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -327,11 +327,11 @@ const prefersCollection = store.prefersCollection();
Returns a list of registered address autocomplete provider IDs.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- _addressAutocompleteProviders_ `string[]`: A list of registered address autocomplete provider IDs.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -346,11 +346,11 @@ Returns the active address autocomplete provider for a given address type.
- _type_ `'billing' | 'shipping'`: The address type.
-#### _Returns_ <!-- omit in toc -->
+#### _Returns_ {/* omit in toc */}
- _activeAddressAutocompleteProvider_ `string`: The currently active address autocomplete provider for the passed address type.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = select( checkoutStore );
@@ -364,11 +364,11 @@ const activeBillingProvider = store.getActiveAutocompleteProvider( 'billing' );
Sets the `prefersCollection` flag to true or false.
-#### _Parameters_ <!-- omit in toc -->
+#### _Parameters_ {/* omit in toc */}
- _prefersCollection_ `boolean`: True if the shopper prefers to collect their order.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = dispatch( checkoutStore );
@@ -379,11 +379,11 @@ store.setPrefersCollection( true );
Set the billing address to editing state or collapsed state. Note that if the address has invalid fields, it will not be set to collapsed state.
-#### _Parameters_ <!-- omit in toc -->
+#### _Parameters_ {/* omit in toc */}
- _isEditing_ `boolean`: True to set the billing address to editing state, false to set it to collapsed state.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = dispatch( checkoutStore );
@@ -394,11 +394,11 @@ store.setEditingBillingAddress( true );
Set the shipping address to editing state or collapsed state. Note that if the address has invalid fields, it will not be set to collapsed state.
-#### _Parameters_ <!-- omit in toc -->
+#### _Parameters_ {/* omit in toc */}
- _isEditing_ `boolean`: True to set the shipping address to editing state, false to set it to collapsed state.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = dispatch( checkoutStore );
@@ -409,11 +409,11 @@ store.setEditingShippingAddress( true );
Adds an address autocomplete provider
-#### _Parameters_ <!-- omit in toc -->
+#### _Parameters_ {/* omit in toc */}
- _providerId_ `string`: The provider's name. Note, providers should be registered with `wc.addressAutocomplete.registerAddressAutocompleteProvider`.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = dispatch( checkoutStore );
@@ -424,12 +424,12 @@ store.addAddressAutocompleteProvider( 'my-address-provider' );
Adds an address autocomplete provider
-#### _Parameters_ <!-- omit in toc -->
+#### _Parameters_ {/* omit in toc */}
- _providerId_ `string`: Sets the active autocomplete provider's id. Note, providers should be registered with `wc.addressAutocomplete.registerAddressAutocompleteProvider`.
- _addressType_ `'billing' | 'shipping'`: Which address type this is the active provider for. Since billing and shipping can be in different countries, there may be a different provider for each country.
-#### _Example_ <!-- omit in toc -->
+#### _Example_ {/* omit in toc */}
```js
const store = dispatch( checkoutStore );
diff --git a/docs/block-development/reference/data-store/validation.md b/docs/block-development/reference/data-store/validation.md
index 378bc85dc89..078b452d06d 100644
--- a/docs/block-development/reference/data-store/validation.md
+++ b/docs/block-development/reference/data-store/validation.md
@@ -169,7 +169,7 @@ Clears multiple validation errors at once. If no error IDs are passed, all valid
#### _Example_
-1. This will clear only the validation errors passed in the array.
+This will clear only the validation errors passed in the array:
```js
const store = dispatch( validationStore );
@@ -179,8 +179,8 @@ store.clearValidationErrors( [
'terms-and-conditions',
] );
```
-<!-- markdownlint-disable MD029 -->
-2. This will clear all validation errors.
+
+This will clear all validation errors:
```js
const store = dispatch( validationStore );
diff --git a/docs/contribution/releases/troubleshooting.md b/docs/contribution/releases/troubleshooting.md
index 7dc73996aa9..0a3b10c12db 100644
--- a/docs/contribution/releases/troubleshooting.md
+++ b/docs/contribution/releases/troubleshooting.md
@@ -27,7 +27,7 @@ During the release process, you may encounter CI test failures on release-relate
2. **Backport test fixes**: If possible, [backport](/docs/contribution/releases/backporting) the relevant test fixes from trunk to the release branch, then re-run the CI workflow.
3. **Handle complex cases**: If backporting isn't possible due to dependencies or the cause isn't clear, document what you've found and ask for help in the release Slack channel. The "Heart of Gold - Flux" team can assist with resolving CI issues that block release work.
-### Something looks wrong in the final release ZIP. Can I start over? {#can-i-start-over-id}
+<h3 id="can-i-start-over-id">Something looks wrong in the final release ZIP. Can I start over?</h3>
If, after downloading and unzipping the generated artifact, something seems off (e.g., missing files, incorrect changelog, or version mismatch), this usually means:
@@ -45,8 +45,7 @@ If, after downloading and unzipping the generated artifact, something seems off
**Once you know which step failed,** re-run only that step as described in the [Building & Publishing guide](/docs/contribution/releases/building-and-publishing). Make sure to run skipped workflows in the correct order and double-check all configuration (version number, release type, etc.) before proceeding.
-
-### A serious bug was detected during internal checks / monitoring {#deploy-serious-bug}
+<h3 id="deploy-serious-bug">A serious bug was detected during internal checks / monitoring</h3>
For RC and stable releases, deploying to our staging environment and monitoring for errors is required before the release is made publicly available. If a serious bug is detected during this monitoring period, follow these steps:
@@ -74,7 +73,7 @@ If a severe regression or bug is discovered (e.g., checkout failure or unrecover
- Use the [`Release: Update stable tag`](https://github.com/woocommerce/woocommerce/actions/workflows/release-update-stable-tag.yml) workflow, making sure to check the _Revert_ option to allow downgrading.
- Merge any auto-generated PRs right away.
-### The release needs to be delayed. What should we do? {#release-delay}
+<h3 id="release-delay">The release needs to be delayed. What should we do?</h3>
1. Create an internal Slack thread to communicate with the engineering teams as well as Dev Advocacy. This also provides an opportunity for teams to share any additional context and verify or challenge schedule changes.
2. Ask Dev Advocacy to communicate the delay publicly.
@@ -82,7 +81,7 @@ If a severe regression or bug is discovered (e.g., checkout failure or unrecover
Remember to not plan the patch release [too close to the weekend](#release-delay-weekend-id).
-### The release was delayed. Can we still release after Tuesday? {#release-delay-weekend-id}
+<h3 id="release-delay-weekend-id">The release was delayed. Can we still release after Tuesday?</h3>
In general, avoid releasing after Tuesday, especially close to a weekend.
diff --git a/docs/extensions/core-concepts/wc-get-orders.md b/docs/extensions/core-concepts/wc-get-orders.md
index 4fbc0747af6..c7bdfea9967 100644
--- a/docs/extensions/core-concepts/wc-get-orders.md
+++ b/docs/extensions/core-concepts/wc-get-orders.md
@@ -57,13 +57,13 @@ Note that `wc_get_orders()` is mostly a shortcut to `WC_Order_Query::get_orders(
## API reference
-| Method | Description |
-|-------------------------------------------|------------------------------------------|
-| `wc_get_orders ( $args )` | Retrieve orders matching query `$args`. |
-| `WC_Order_Query::get_query_vars()` | Get an array of all of the current query variables set on the query object. |
-| `WC_Order_Query::get( string $key, mixed $default = '' )` | Get the value of a query variable or the default if the query variable is not set. |
-| `WC_Order_Query::set( string $key, mixed $value )` | Set a query variable. |
-| `WC_Order_Query::get_orders()` | Get all orders matching the current query variables. |
+| Method | Description |
+| --- | --- |
+| `wc_get_orders ( $args )` | Retrieve orders matching query `$args`. |
+| `WC_Order_Query::get_query_vars()` | Get an array of all of the current query variables set on the query object. |
+| `WC_Order_Query::get( string $key, mixed $default = '' )` | Get the value of a query variable or the default if the query variable is not set. |
+| `WC_Order_Query::set( string $key, mixed $value )` | Set a query variable. |
+| `WC_Order_Query::get_orders()` | Get all orders matching the current query variables. |
Query parameters/arguments that can be used with these functions are described below.
@@ -71,18 +71,18 @@ Query parameters/arguments that can be used with these functions are described b
### General
-|Parameter|Description|
-|-|-|
-|**status**|Accepts an array of strings: by default is set to the keys of `wc_get_order_statuses()`.|
-|**type**|Accepts a string: `'shop_order'`, `'shop_order_refund'`, or a custom order type.|
-|**version**|Accepts a string: WooCommerce version number the order was created in.|
-|**created_via**|Accepts a string: 'checkout', 'rest-api', or a custom creation method slug.|
-|**parent**|Accepts an integer: post ID of the order parent.|
-|**parent_exclude**|Accepts an array of integers: Excludes orders with parent ids in the array.|
-|**exclude**|Accepts an array of integers: excludes orders that have the ids.|
-|**order**|Accepts a string: 'DESC' or 'ASC'. Use with 'orderby'. Default: 'DESC'.|
-|**orderby**|Accepts a string: 'none', 'ID', 'name', 'type', 'rand', 'date', 'modified'. Default: 'date'.|
-|**return**|Return type. Accepts a string: 'ids' or 'objects'. Default: 'objects'.|
+| Parameter | Description |
+| --- | --- |
+| **status** | Accepts an array of strings: by default is set to the keys of `wc_get_order_statuses()`. |
+| **type** | Accepts a string: `'shop_order'`, `'shop_order_refund'`, or a custom order type. |
+| **version** | Accepts a string: WooCommerce version number the order was created in. |
+| **created_via** | Accepts a string: 'checkout', 'rest-api', or a custom creation method slug. |
+| **parent** | Accepts an integer: post ID of the order parent. |
+| **parent_exclude** | Accepts an array of integers: Excludes orders with parent ids in the array. |
+| **exclude** | Accepts an array of integers: excludes orders that have the ids. |
+| **order** | Accepts a string: 'DESC' or 'ASC'. Use with 'orderby'. Default: 'DESC'. |
+| **orderby** | Accepts a string: 'none', 'ID', 'name', 'type', 'rand', 'date', 'modified'. Default: 'date'. |
+| **return** | Return type. Accepts a string: 'ids' or 'objects'. Default: 'objects'. |
#### Examples
@@ -142,12 +142,12 @@ $orders = wc_get_orders( $args );
### Pagination
-|Parameter|Description|
-|-|-|
-|**limit**|Accepts an integer: Maximum number of results to retrieve or `-1` for unlimited. Default: Site 'posts_per_page' setting.|
-|**paged**|Accepts an integer: Page of results to retrieve. Does nothing if 'offset' is used.|
-|**offset**|Accepts an integer: Amount to offset order results.|
-|**paginate**|Accepts a boolean: True for pagination, or false for not (default: false). If enabled, modifies the return results to give an object with fields: `orders` (array of found orders), `total` (number of found orders) and `max_num_pages` (total number of pages).|
+| Parameter | Description |
+| --- | --- |
+| **limit** | Accepts an integer: Maximum number of results to retrieve or `-1` for unlimited. Default: Site 'posts_per_page' setting. |
+| **paged** | Accepts an integer: Page of results to retrieve. Does nothing if 'offset' is used. |
+| **offset** | Accepts an integer: Amount to offset order results. |
+| **paginate** | Accepts a boolean: True for pagination, or false for not (default: false). If enabled, modifies the return results to give an object with fields: `orders` (array of found orders), `total` (number of found orders) and `max_num_pages` (total number of pages). |
#### Examples
@@ -324,11 +324,9 @@ $orders = wc_get_orders( $args );
### Metadata
-<!-- markdownlint-disable MD033 -->
-|Parameter|Description|
-|-|-|
-|**meta_query**|One or more arrays with keys `key` (meta key), `value` (optional, string or array) and optionally `type` and `compare`.<br />This parameter is analogous to [WP_Query's `meta_query`](https://developer.wordpress.org/reference/classes/wp_query/#custom-field-post-meta-parameters), supporting various comparison operators and levels of queries joined by AND/OR relations.|
-<!-- markdownlint-enable MD033 -->
+| Parameter | Description |
+| --- | --- |
+| **meta_query** | One or more arrays with keys `key` (meta key), `value` (optional, string or array) and optionally `type` and `compare`.<br />This parameter is analogous to [WP_Query's `meta_query`](https://developer.wordpress.org/reference/classes/wp_query/#custom-field-post-meta-parameters), supporting various comparison operators and levels of queries joined by AND/OR relations. |
For more details and examples, refer to the [HPOS order querying](/docs/features/high-performance-order-storage/wc-order-query-improvements#metadata-queries-meta_query) guide.
@@ -365,11 +363,9 @@ $orders = wc_get_orders(
### Order fields
-<!-- markdownlint-disable MD033 -->
|Parameter|Description|
|-|-|
|**field_query**|One or more arrays with keys `field` (any order property), `value` and optionally `type` and `compare`.<br />This parameter is analogous to those of `meta_query` described in the previous section, supporting various comparison operators and levels of queries joined by AND/OR relations.|
-<!-- markdownlint-enable MD033 -->
For more details and examples, refer to the [HPOS order querying](/docs/features/high-performance-order-storage/wc-order-query-improvements#order-field-queries-field_query) guide.
@@ -405,11 +401,9 @@ $orders = wc_get_orders(
### Advanced date queries
-<!-- markdownlint-disable MD033 -->
-|Parameter|Description|
-|-|-|
-|**date_query**|One or more arrays with keys `column` (an order date: `date_completed`, `date_created`, `date_updated` or `date_paid`, optionally followed by `_gmt` for UTC dates), `value` and optionally `type` and `compare`.<br />This parameter is analogous to [WP_Query's `date_query`](https://developer.wordpress.org/reference/classes/wp_query/#date-parameters), supporting various comparison operators and levels of queries joined by AND/OR relations.|
-<!-- markdownlint-enable MD033 -->
+| Parameter | Description |
+| --- | --- |
+| **date_query** | One or more arrays with keys `column` (an order date: `date_completed`, `date_created`, `date_updated` or `date_paid`, optionally followed by `_gmt` for UTC dates), `value` and optionally `type` and `compare`.<br />This parameter is analogous to [WP_Query's `date_query`](https://developer.wordpress.org/reference/classes/wp_query/#date-parameters), supporting various comparison operators and levels of queries joined by AND/OR relations. |
For more details and examples, refer to the [HPOS order querying](/docs/features/high-performance-order-storage/wc-order-query-improvements#date-queries-date_query) guide.
diff --git a/docs/features/email/email-html-best-practices.md b/docs/features/email/email-html-best-practices.md
index 8bb7c6309c4..d505e98d491 100644
--- a/docs/features/email/email-html-best-practices.md
+++ b/docs/features/email/email-html-best-practices.md
@@ -5,8 +5,6 @@ sidebar_label: HTML best practices
# Email HTML - Best Practices
-<!-- markdownlint-disable MD024 -->
-
## Overview
Email design and development require a different approach than traditional web development. This guide outlines best practices for ensuring your HTML emails render correctly across all major email clients.
diff --git a/docs/features/email/email-preview.md b/docs/features/email/email-preview.md
index a1ff6d02e84..27e6f2b8928 100644
--- a/docs/features/email/email-preview.md
+++ b/docs/features/email/email-preview.md
@@ -5,8 +5,6 @@ sidebar_label: Email preview integration
# Email Preview Integration
-<!-- markdownlint-disable MD024 -->
-
## Overview
WooCommerce's Email Preview feature allows you to preview email templates using dummy data (i.e., it doesn't use the actual data from the database). This means that extensions registering new email types need to integrate with the email preview system to properly showcase their emails.
diff --git a/docs/theming/block-theme-development/theming-woo-blocks.md b/docs/theming/block-theme-development/theming-woo-blocks.md
index 6840fa4b505..03fe7d4384f 100644
--- a/docs/theming/block-theme-development/theming-woo-blocks.md
+++ b/docs/theming/block-theme-development/theming-woo-blocks.md
@@ -80,8 +80,8 @@ For example, let's imagine you are building a theme and would like to customize
}
```
-Before | After
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
-<img src="https://github.com/woocommerce/woocommerce/assets/3616980/fbc11b83-f47b-4b25-bdeb-df798b251cce" width="210" alt="Product Collection block showing the Product Price block with default styles" /> | <img src="https://github.com/woocommerce/woocommerce/assets/3616980/c9730445-b9df-4e96-8204-a10896ac2c5a" width="210" alt="Product Collection block showing the Product Price styled with background and text colors and italic and bold typography" /> <!-- markdownlint-disable-line no-inline-html -->
+| Before | After |
+| --- | --- |
+|  |  |
You can find more [documentation on global styles](https://developer.wordpress.org/themes/global-settings-and-styles/styles/) in developer.wordpress.org. You can also find the [list of WooCommerce blocks and their names in the docs](/docs/block-development/reference/block-references).
diff --git a/plugins/woocommerce/changelog/fix-docs-build b/plugins/woocommerce/changelog/fix-docs-build
new file mode 100644
index 00000000000..d8a1645eb7c
--- /dev/null
+++ b/plugins/woocommerce/changelog/fix-docs-build
@@ -0,0 +1,5 @@
+Significance: patch
+Type: fix
+Comment: Fix issues when building docs MDX files
+
+
diff --git a/plugins/woocommerce/client/blocks/bin/gen-block-list-doc.js b/plugins/woocommerce/client/blocks/bin/gen-block-list-doc.js
index 8427c47571b..86a4a02864d 100644
--- a/plugins/woocommerce/client/blocks/bin/gen-block-list-doc.js
+++ b/plugins/woocommerce/client/blocks/bin/gen-block-list-doc.js
@@ -48,14 +48,25 @@ const BLOCK_LIBRARY_DOCS_FILE = path.resolve(
*
* @type {string}
*/
-const START_TOKEN = '<!-- START Autogenerated - DO NOT EDIT -->';
+const START_TOKEN = '{/* START Autogenerated - DO NOT EDIT */}';
/**
* Start token for matching string in doc file.
*
* @type {string}
*/
-const END_TOKEN = '<!-- END Autogenerated - DO NOT EDIT -->';
+const END_TOKEN = '{/* END Autogenerated - DO NOT EDIT */}';
+
+/**
+ * Escapes a string for use inside `new RegExp( ... )`.
+ * JSX-style comment markers contain `{`, `}`, `*`, etc., which are regex metacharacters.
+ *
+ * @param {string} string Raw marker text.
+ * @return {string} The string with regex metacharacters escaped.
+ */
+function escapeRegExp( string ) {
+ return string.replace( /[.*+?^${}()|[\]\\]/g, '\\$&' );
+}
/**
* Regular expression using tokens for matching in doc file.
@@ -63,7 +74,9 @@ const END_TOKEN = '<!-- END Autogenerated - DO NOT EDIT -->';
*
* @type {RegExp}
*/
-const TOKEN_PATTERN = new RegExp( START_TOKEN + '[^]*' + END_TOKEN );
+const TOKEN_PATTERN = new RegExp(
+ escapeRegExp( START_TOKEN ) + '[^]*' + escapeRegExp( END_TOKEN )
+);
/**
* Returns list of keys, filtering out any experimental
@@ -166,12 +179,28 @@ function readBlockJSON( filename ) {
${ blockjson.description || '' }
-- **Name:** ${ blockjson.name }
-- **Category:** ${ blockjson.category || '' }
-- **Ancestor:** ${ blockjson.ancestor?.join( ', ' ) || '' }
-- **Parent:** ${ blockjson.parent || '' }
-- **Supports:** ${ supportsList && supportsList.sort().join( ', ' ) }
-- **Attributes:** ${ attributes && attributes.sort().join( ', ' ) }
+- **Name:** ${ blockjson.name }
+- **Category:** ${ blockjson.category || '' }${
+ blockjson?.ancestor && blockjson.ancestor.length > 0
+ ? `
+- **Ancestor:** ${ blockjson.ancestor?.join( ', ' ) }`
+ : ''
+ }${
+ blockjson?.parent && blockjson.parent.length > 0
+ ? `
+- **Parent:** ${ blockjson.parent?.join( ', ' ) }`
+ : ''
+ }${
+ supportsList && supportsList.length > 0
+ ? `
+- **Supports:** ${ supportsList.sort().join( ', ' ) }`
+ : ''
+ }${
+ attributes && attributes.length > 0
+ ? `
+- **Attributes:** ${ attributes.sort().join( ', ' ) }`
+ : ''
+ }
`;
}