woocommerce/docs/building-a-woo-store/block-references.md

1443 lines
49 KiB
Markdown
Raw Permalink Normal View History

---
post_title: Blocks reference
menu_title: Blocks Reference
---
# Woo 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 -->
## 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:**
- **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 (link, text, ~~background~~), interactivity, 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:**
- **Parent:**
- **Supports:**
- **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/single-product,woocommerce/product-template,core/post-template
- **Parent:**
- **Supports:** ~~html~~
- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign
## Product Details - woocommerce/product-details
Display a product's description, attributes, and reviews.
- **Name:** woocommerce/product-details
- **Category:** woocommerce-product-elements
- **Ancestor:**
- **Parent:**
- **Supports:** align, spacing (margin)
- **Attributes:** hideTabTitle
## 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, ~~multiple~~
- **Attributes:**
## Product Meta - woocommerce/product-meta
Display a products SKU, categories, tags, and more.
- **Name:** woocommerce/product-meta
- **Category:** woocommerce-product-elements
- **Ancestor:**
- **Parent:**
- **Supports:** align, ~~reusable~~
- **Attributes:**
## Product Reviews - woocommerce/product-reviews
A block that shows the reviews for a product.
- **Name:** woocommerce/product-reviews
- **Category:** woocommerce-product-elements
- **Ancestor:**
- **Parent:**
- **Supports:**
- **Attributes:**
## Product Rating - woocommerce/product-rating
Display the average rating of a product.
- **Name:** woocommerce/product-rating
- **Category:**
- **Ancestor:**
- **Parent:**
- **Supports:** align
- **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:** align
- **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:** align
- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductBlock, isDescendentOfSingleProductTemplate, productId, textAlign
## Related Products - woocommerce/related-products
Display related products.
- **Name:** woocommerce/related-products
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:** align, ~~inserter~~, ~~reusable~~
- **Attributes:**
## 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:**
- **Parent:**
- **Supports:**
- **Attributes:** isDescendentOfQueryLoop, isDescendentOfSingleProductTemplate, productId
## Active Filters Controls - woocommerce/active-filters
Display the currently active filters.
- **Name:** woocommerce/active-filters
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:** color (text, ~~background~~), ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
- **Attributes:** displayStyle, headingLevel
## 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~~, ~~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~~), 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:**
## 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:** inserter, ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
- **Attributes:**
## 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:** ~~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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## Cart Link - woocommerce/cart-link
Display a link to the cart.
- **Name:** woocommerce/cart-link
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:** color (background, link, ~~text~~), spacing (padding), typography (fontSize), ~~html~~, ~~multiple~~
- **Attributes:** cartIcon, content, isPreview
## 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~~), typography (fontSize)
- **Attributes:** fontSize
## 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, requireApartmentField, requireCompanyField, requirePhoneField, showApartmentField, showCompanyField, showFormStepNumbers, showPhoneField
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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, 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## Classic Shortcode - woocommerce/classic-shortcode
Renders classic WooCommerce shortcodes.
- **Name:** woocommerce/classic-shortcode
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:** align, inserter, ~~html~~, ~~multiple~~, ~~reusable~~
- **Attributes:** align, shortcode
## Coming Soon - woocommerce/coming-soon
- **Name:** woocommerce/coming-soon
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:** color (text, ~~background~~), ~~inserter~~
- **Attributes:** color, storeOnly
## 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), spacing (margin, padding), typography (fontSize)
- **Attributes:** displayStyle, iconClass, iconStyle
## 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), color (background, text), spacing (padding), ~~html~~
- **Attributes:** alt, categoryId, contentAlign, dimRatio, editMode, focalPoint, hasParallax, imageFit, isRepeated, linkText, mediaId, mediaSrc, minHeight, overlayColor, overlayGradient, previewCategory, showDesc
## Featured Product - woocommerce/featured-product
Highlight a product or variation.
- **Name:** woocommerce/featured-product
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:** align (full, wide), color (background, text), multiple, spacing (padding), ~~html~~
- **Attributes:** alt, contentAlign, dimRatio, editMode, focalPoint, hasParallax, imageFit, isRepeated, linkText, mediaId, mediaSrc, minHeight, overlayColor, overlayGradient, previewProduct, productId, showDesc, showPrice
## Filter Block - woocommerce/filter-wrapper
- **Name:** woocommerce/filter-wrapper
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:**
- **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), ~~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:** typography (fontSize), ~~html~~, ~~multiple~~
- **Attributes:** addToCartBehaviour, cartAndCheckoutRenderStyle, hasHiddenPrice, iconColor, iconColorValue, isPreview, miniCartIcon, onCartClickBehaviour, priceColor, priceColorValue, productCountColor, productCountColorValue, productCountVisibility
## 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:** ~~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:** ~~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, ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
- **Attributes:** 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, ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
- **Attributes:** 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:** ~~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:** ~~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:** ~~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, ~~align~~, ~~html~~, ~~multiple~~, ~~reusable~~
- **Attributes:** lock
## 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~~), 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), spacing (padding), typography (fontSize), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
- **Attributes:**
## 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), spacing (padding), typography (fontSize), ~~align~~, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~, ~~reusable~~
- **Attributes:** label
## 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
## 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
## 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
## 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
## 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
## Account Creation - woocommerce/order-confirmation-create-account
Allow customers to create an account after their purchase. Configure this feature in your store settings.
- **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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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
## 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~~), ~~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), ~~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~~), 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), ~~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, 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), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~
- **Attributes:**
## Add to Cart with Options - woocommerce/add-to-cart-form
Display a button so the customer can add a product to their cart. Options will also be displayed depending on product type. e.g. quantity, variation.
- **Name:** woocommerce/add-to-cart-form
- **Category:** woocommerce-product-elements
- **Ancestor:**
- **Parent:**
- **Supports:** interactivity
- **Attributes:** isDescendentOfSingleProductBlock, quantitySelectorStyle
## Product Filters (Experimental) - 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, multiple, typography (fontSize)
- **Attributes:** overlayButtonType, overlayIcon, overlayIconSize
## Active (Experimental) - woocommerce/product-filter-active
Display the currently active filters.
- **Name:** woocommerce/product-filter-active
- **Category:** woocommerce
- **Ancestor:** woocommerce/product-filters
- **Parent:**
- **Supports:** color (text, ~~background~~), interactivity
- **Attributes:** displayStyle
## Attribute (Experimental) - 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, clearButton, 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
- **Parent:**
- **Supports:** color (background, text, ~~enableContrastChecker~~)
- **Attributes:** customOptionElement, customOptionElementBorder, customOptionElementSelected, 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-status
- **Parent:**
- **Supports:**
- **Attributes:** chipBackground, chipBorder, chipText, customChipBackground, customChipBorder, customChipText, customSelectedChipBackground, customSelectedChipBorder, customSelectedChipText, selectedChipBackground, selectedChipBorder, selectedChipText
## Clear (Experimental) - woocommerce/product-filter-clear-button
Allows shoppers to reset this filter.
- **Name:** woocommerce/product-filter-clear-button
- **Category:** woocommerce
- **Ancestor:** woocommerce/product-filter
- **Parent:**
- **Supports:** interactivity, ~~inserter~~
- **Attributes:**
## Product Filters Overlay (Experimental) - woocommerce/product-filters-overlay
Display product filters in an overlay on top of a page.
- **Name:** woocommerce/product-filters-overlay
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:** align, color (background, text), dimensions (), layout (allowCustomContentAndWideSize), spacing (blockGap, padding), typography (), ~~inserter~~, ~~multiple~~
- **Attributes:** overlayPosition, overlayStyle, style
## Overlay Navigation (Experimental) - woocommerce/product-filters-overlay-navigation
Display overlay navigation controls.
- **Name:** woocommerce/product-filters-overlay-navigation
- **Category:** woocommerce
- **Ancestor:** woocommerce/product-filters-overlay,woocommerce/product-filters
- **Parent:**
- **Supports:** align (center, left, right), color (background, text), inserter, interactivity, layout (default, ~~allowEditing~~), position (sticky), spacing (blockGap, margin, padding), typography (fontSize, lineHeight)
- **Attributes:** align, buttonStyle, iconSize, navigationStyle, overlayIcon, overlayMode, style, triggerType
## Price (Experimental) - 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:**
## 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:** ~~html~~
- **Attributes:** inlineInput, showInputFields
## Rating (Experimental) - 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
## Status (Experimental) - 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:** clearButton, displayStyle, hideEmpty, isPreview, showCounts
## Product Gallery (Beta) - woocommerce/product-gallery
Showcase your products relevant images and media.
- **Name:** woocommerce/product-gallery
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:** align, interactivity, ~~multiple~~
- **Attributes:** cropImages, fullScreenOnClick, hoverZoom, mode, nextPreviousButtonsPosition, pagerDisplayMode, productGalleryClientId, thumbnailsNumberOfThumbnails, thumbnailsPosition
## Large Image - woocommerce/product-gallery-large-image
Display the Large Image of a product.
- **Name:** woocommerce/product-gallery-large-image
- **Category:** woocommerce
- **Ancestor:** woocommerce/product-gallery
- **Parent:**
- **Supports:** interactivity
- **Attributes:**
## 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
- **Parent:**
- **Supports:** layout (allowVerticalAlignment, default, ~~allowInheriting~~, ~~allowJustification~~, ~~allowOrientation~~)
- **Attributes:**
## Pager - woocommerce/product-gallery-pager
Display the gallery pager.
- **Name:** woocommerce/product-gallery-pager
- **Category:** woocommerce
- **Ancestor:** woocommerce/product-gallery
- **Parent:**
- **Supports:**
- **Attributes:**
## Thumbnails - woocommerce/product-gallery-thumbnails
Display the Thumbnails of a product.
- **Name:** woocommerce/product-gallery-thumbnails
- **Category:** woocommerce
- **Ancestor:** woocommerce/product-gallery
- **Parent:**
- **Supports:** spacing (margin)
- **Attributes:**
## Newest Products - woocommerce/product-new
Display a grid of your newest products.
- **Name:** woocommerce/product-new
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:** align (full, wide), ~~html~~, ~~inserter~~
- **Attributes:** alignButtons, catOperator, categories, columns, contentVisibility, editMode, 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~~), typography (fontSize)
- **Attributes:**
## 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), ~~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), typography (fontSize, lineHeight), ~~html~~, ~~inserter~~, ~~reusable~~
- **Attributes:**
## 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), ~~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), ~~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), ~~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, ~~html~~, ~~inserter~~, ~~lock~~, ~~multiple~~
- **Attributes:** className, displayStyle, isPreview, selectType, showCounts, showFilterButton
## Single Product - woocommerce/single-product
Display a single product.
- **Name:** woocommerce/single-product
- **Category:** woocommerce
- **Ancestor:**
- **Parent:**
- **Supports:** align (full, wide)
- **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, ~~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), ~~multiple~~
- **Attributes:** align
<!-- END Autogenerated - DO NOT EDIT -->