Skip to main content

Products

A grid or carousel of products, from a query you build — the shop's main display element.

The block renders through the wc_products element — the same PHP that runs in the page builder, so the front end is identical either way.

caution
Needs the WooCommerce extension and the WooCommerce plugin

This element ships with the WooCommerce extension, which is inactive by default, and it needs the WooCommerce plugin installed and active.

With either missing the block does not register at all — so it appears in the inserter exactly when it can actually work, rather than as an entry that renders nothing.

What the sidebar exposes

OptionWhat it does
sourceWhere products come from
categoryRestrict to categories
tagsRestrict to tags
attributeRestrict by attribute
attribute_termsWhich terms of it
product_idsSpecific products
posts_per_pageHow many to show
orderbySort field
orderAscending or descending
layoutGrid or carousel
columnsHow many per row
gapSpace between cards
alignmentAlignment
paginationPaginate the grid
carousel_arrowsShow carousel arrows
card_rowsWhich rows a card shows, and in what order
box_styleCard box preset
image_ratioThumbnail crop ratio
image_sizeWhich registered image size
rating_symbolStar, heart or another mark
rating_fill_colorFilled symbol colour
rating_empty_colorEmpty symbol colour
rating_sizeSymbol size
show_ribbonShow the corner ribbon
show_sale_badgeShow a sale badge
badge_styleBadge design
show_featured_badgeBadge featured products
show_new_badgeBadge recent products
new_daysHow recent counts as new
add_to_cart_textButton text

Anything not listed stays available in the page builder, and round-trips untouched.

The query runs for real in the editor

The canvas shows this shop's actual products, so you can see whether the query returns what you meant.

Add-to-cart is inert. Live, a click would add a product to the editor's session cart — a real cart belonging to whoever is logged in.

Two ways to be empty, and the block says which

No published products at all is a different problem from a query that excluded everything, and the fix differs. The block names the one you have.