Add To Cart Schema

Property	Value
name	product-add-to-cart
category	woocommerce_product
tag	div
nestable	false

Open JSON

Controls

Key	Type	Label	CSS
variationsTypography	typography	Typography	font on table.variations label
variationsBackgroundColor	color	Background color	background-color on table.variations tr
variationsBorder	border	Border	border on .cart .variations tr:not(:has(.reset_variations))
variationsMargin	spacing	Margin	margin on .cart table.variations
variationsPadding	spacing	Padding	padding on .cart table.variations td, padding on .cart table.variations th
variationsDescriptionTypography	typography	Description typography	font on .woocommerce-variation-description
variationsPriceTypography	typography	Price typography	font on .woocommerce-variation-price
variationsRegularPriceTypography	typography	Regular price typography	font on .woocommerce-variation-price .price del, .woocommerce-variation-price .price > span
variationsSalePriceTypography	typography	Sale price typography	font on .woocommerce-variation-price .price ins
swatchesWrap	select	Wrap	flex-wrap on .bricks-variation-swatches
swatchesDirection	direction	Direction	flex-direction on .bricks-variation-swatches
swatchesJustifyContent	justify-content	Align main axis	justify-content on .bricks-variation-swatches
swatchesAlignItems	align-items	Align cross axis	align-items on .bricks-variation-swatches
swatchesColumnGap	number	Column gap	column-gap on .bricks-variation-swatches
swatchesRowGap	number	Row gap	row-gap on .bricks-variation-swatches
colorSwatchSize	number	Size	width on .bricks-variation-swatches.bricks-swatch-color li, height on .bricks-variation-swatches.bricks-swatch-color li
colorSwatchBorder	border	Border	border on .bricks-variation-swatches.bricks-swatch-color li
colorSwatchActiveBorder	border	Border	border on .bricks-variation-swatches.bricks-swatch-color li.bricks-swatch-selected
labelSwatchPadding	spacing	Padding	padding on .bricks-variation-swatches.bricks-swatch-label li
labelSwatchTypography	typography	Typography	font on .bricks-variation-swatches.bricks-swatch-label li
labelSwatchActiveTypography	typography	Typography	font on .bricks-variation-swatches.bricks-swatch-label li.bricks-swatch-selected
labelSwatchBackgroundColor	color	Background color	background-color on .bricks-variation-swatches.bricks-swatch-label li
labelSwatchActiveBackgroundColor	color	Background color	background-color on .bricks-variation-swatches.bricks-swatch-label li.bricks-swatch-selected
labelSwatchBorder	border	Border	border on .bricks-variation-swatches.bricks-swatch-label li
labelSwatchActiveBorder	border	Border	border on .bricks-variation-swatches.bricks-swatch-label li.bricks-swatch-selected
imageSwatchWidth	number	Width	width on .bricks-variation-swatches.bricks-swatch-image li img
imageSwatchHeight	number	Height	height on .bricks-variation-swatches.bricks-swatch-image li img
imageSwatchBorder	border	Border	border on .bricks-variation-swatches.bricks-swatch-image li
imageSwatchActiveBorder	border	Border	border on .bricks-variation-swatches.bricks-swatch-image li.bricks-swatch-selected
swatchTooltipPadding	spacing	Padding	padding on .bricks-variation-swatches li[data-balloon]::after
swatchTooltip	typography	Typography	font on .bricks-variation-swatches li[data-balloon]::after
swatchTooltipBackground	color	Background color	background-color on .bricks-variation-swatches li[data-balloon]::after, border-top-color on .bricks-variation-swatches li[data-balloon]::before
swatchTooltipBorder	border	Border	border on .bricks-variation-swatches li[data-balloon]::after
hideStock	checkbox	Hide stock	display on .stock
stockTypography	typography	Typography	font on .stock
inStockTypography	typography	Typography	font on .stock.in-stock
outOfStockTypography	typography	Typography	font on .stock.out-of-stock
formDisplay	select	Display	display on form.cart:not(.variations_form), form.cart.variations_form .woocommerce-variation-add-to-cart
formFlexDirection	direction	Direction	flex-direction on form.cart:not(.variations_form), form.cart.variations_form .woocommerce-variation-add-to-cart
formAlignSelf	align-items	Align self	align-self on form.cart:not(.variations_form), form.cart.variations_form .woocommerce-variation-add-to-cart
formJustifyContent	justify-content	Align main axis	justify-content on form.cart:not(.variations_form), form.cart.variations_form .woocommerce-variation-add-to-cart
formAlignItems	align-items	Align cross axis	align-items on form.cart:not(.variations_form), form.cart.variations_form .woocommerce-variation-add-to-cart
formGap	number	Gap	gap on form.cart:not(.variations_form), form.cart.variations_form .woocommerce-variation-add-to-cart
formFlexGrow	number	Flex grow	flex-grow on form.cart:not(.variations_form), form.cart.variations_form .woocommerce-variation-add-to-cart
formFlexShrink	number	Flex shrink	flex-shrink on form.cart:not(.variations_form), form.cart.variations_form .woocommerce-variation-add-to-cart
formFlexBasis	text	Flex basis	flex-basis on form.cart:not(.variations_form), form.cart.variations_form .woocommerce-variation-add-to-cart
quantityWidth	number	Width	width on .cart .quantity
quantityBackground	color	Background	background-color on .cart .quantity
quantityBorder	border	Border	border on .qty, border on .minus, border on .plus
buttonText	text	Simple product	—
variableText	text	Variable product	—
groupedText	text	Grouped product	—
externalText	text	External product	—
buttonMargin	spacing	Margin	margin on .cart .single_add_to_cart_button, a.button[data-product_id]
buttonPadding	spacing	Padding	padding on .cart .single_add_to_cart_button, a.button[data-product_id]
buttonWidth	number	Width	min-width on .cart .single_add_to_cart_button, a.button[data-product_id]
buttonBackgroundColor	color	Background color	background-color on .cart .single_add_to_cart_button, a.button[data-product_id]
buttonBorder	border	Border	border on .cart .single_add_to_cart_button, a.button[data-product_id]
buttonTypography	typography	Typography	font on .cart .single_add_to_cart_button, a.button[data-product_id]
icon	icon	Icon	—
iconTypography	typography	Icon typography	font on .icon
iconOnly	checkbox	Icon only	—
iconPosition	select	Icon position	—
groupedProductTablePadding	spacing	Table cell	padding on .cart.grouped_form .group_table td
groupedProductQuantityWidth	number	Width	width on .cart.grouped_form .quantity
groupedProductQuantityBackground	color	Background	background-color on .cart.grouped_form .quantity
groupedProductQuantityBorder	border	Border	border on .cart.grouped_form .quantity .minus, border on .cart.grouped_form .quantity .plus, border on .cart.grouped_form .quantity .qty
groupedProductLabelTypography	typography	Typography	font on .cart.grouped_form .woocommerce-grouped-product-list-item__label a
groupedProductStockTypography	typography	Typography	font on .cart.grouped_form .stock
groupedProductInStockTypography	typography	Typography	font on .cart.grouped_form .stock.in-stock
groupedProductOutOfStockTypography	typography	Typography	font on .cart.grouped_form .stock.out-of-stock
groupedProductPriceTypography	typography	Typography	font on .cart.grouped_form .woocommerce-grouped-product-list-item__price .woocommerce-Price-amount
groupedProductSalePriceTypography	typography	Sale price typography	font on .cart.grouped_form .woocommerce-grouped-product-list-item__price ins .woocommerce-Price-amount
groupedProductRegularPriceTypography	typography	Regular price typography	font on .cart.grouped_form .woocommerce-grouped-product-list-item__price del .woocommerce-Price-amount
groupedProductButtonWidth	number	Width	min-width on .cart.grouped_form .group_table .button
groupedProductButtonPadding	spacing	Padding	padding on .cart.grouped_form .group_table .button
groupedProductButtonTypography	typography	Typography	font on .cart.grouped_form .group_table .button
groupedProductButtonBackground	color	Background color	background-color on .cart.grouped_form .group_table .button
addingButtonText	text	Button text	—
addingButtonIcon	icon	Icon	—
addingButtonIconOnly	checkbox	Icon only	—
addingButtonIconPosition	select	Icon position	—
addingButtonIconSpinning	checkbox	Icon spinning	—
addedButtonText	text	Button text	—
resetTextAfter	number	Reset text after .. seconds	—
addedButtonIcon	icon	Icon	—
addedButtonIconOnly	checkbox	Icon only	—
addedButtonIconPosition	select	Icon position	—
showNotice	select	Show notice	—
scrollToNotice	select	Scroll to notice	—
hideViewCart	select	Hide “View cart” button	display on .added_to_cart.wc-forward

Inherited CSS controls

Shared CSS controls available on all elements. Keys are prefixed with _ and support responsive/pseudo-class variants via colon syntax (e.g. _typography:tablet_portrait:hover).

Key	Type	Label	CSS
_content	text	Content	content
_margin	spacing	Margin	margin
_padding	spacing	Padding	padding
_width	number	Width	width
_widthMin	number	Min. width	min-width
_widthMax	number	Max. width	max-width
_height	number	Height	height
_heightMin	number	Min. height	min-height
_heightMax	number	Max. height	max-height
_aspectRatio	text	Aspect ratio	aspect-ratio
_position	select	Position	position
_top	number	Top	top
_right	number	Right	right
_bottom	number	Bottom	bottom
_left	number	Left	left
_zIndex	number	Z-index	z-index
_order	number	Order	order
_display	select	Display	display, align-items
_visibility	select	Visibility	visibility
_overflow	text	Overflow	overflow
_opacity	number	Opacity	opacity
_cursor	select	Cursor	cursor
_isolation	select	Isolation	isolation
_mixBlendMode	select	Mix blend mode	mix-blend-mode
_pointerEvents	text	Pointer events	pointer-events
_perspective	number	Perspective	perspective
_perspectiveOrigin	text	Perspective origin	perspective-origin
_gridItemJustifySelf	align-items	Justify self	justify-self
_flexDirection	direction	Direction	flex-direction
_alignSelf	align-items	Align self	align-self
_justifyContent	justify-content	Align main axis	justify-content
_alignItems	align-items	Align cross axis	align-items
_gap	number	Gap	gap
_flexGrow	number	Flex grow	flex-grow
_flexShrink	number	Flex shrink	flex-shrink
_flexBasis	text	Flex basis	flex-basis
_useMasonry	checkbox	%s layout	—
_masonryColumn	number	Columns	--columns
_masonryGutter	number	Spacing	--gutter
_masonryHorizontalOrder	checkbox	Horizontal order	—
_masonryTransitionDuration	number	Transition	—
_masonryTransitionMode	select	Reveal animation	—
_typography	typography	_typography	font
_background	background	_background	background
_shapeDividers	repeater	Custom shape	—
_gradient	gradient	_gradient	background-image
_border	border	Border	border
_boxShadow	box-shadow	Box shadow	box-shadow
_transform	transform	Transform	transform
_transformOrigin	text	Transform origin	transform-origin
_motionElementParallax	checkbox	Element parallax	—
_motionElementParallaxSpeedX	number	Horizontal speed	--brx-motion-parallax-speed-x
_motionElementParallaxSpeedY	number	Vertical speed	--brx-motion-parallax-speed-y
_motionBackgroundParallax	checkbox	Background parallax	—
_motionBackgroundParallaxSpeed	number	Background speed	--brx-motion-background-speed
_motionStartVisiblePercent	number	Parallax start point	—
_cssCustom	code	Custom CSS	—
_cssClasses	text	CSS classes	—
_cssId	text	CSS ID	—
_cssFilters	filters	CSS Filters	filter
_cssTransition	text	Transition	transition
_attributes	repeater	Name	—
_scrollSnapType	select	Type	scroll-snap-type on html, scroll-snap-align on .brxe-section
_scrollSnapAlign	select	Align	scroll-snap-align on .brxe-section
_scrollSnapStop	select	Stop	scroll-snap-stop on .brxe-section