Canvas Docs

Add to Cart

Renders the WooCommerce add-to-cart form for the current product with optional quantity input. It is shown in the block inserter as Canvas Add to Cart and registered as canvas-core/woo-add-to-cart.

Select the block on a page and its own settings open in the sidebar, in the panels below:

The Add to Cart settings in the block editor sidebar

Settings

Each setting is named exactly as the block editor names it, followed by what it does and what it starts as. Where a setting carries a Shown when line, it stays hidden until that condition is met, which is the usual reason a setting looks missing from the sidebar:

Settings

  • Show Quantity InputDefaultOn

    Let the shopper choose how many to add. Turn it off for a product bought one at a time.

  • Hide the Attribute MenusDefaultOff

    For a variable product laid out with a swatch row: takes WooCommerce's own attribute menus out of view so there is one set of controls, not two. The menus stay in the page and still drive the form, and a visitor with no JavaScript, for whom a swatch row cannot work, gets them back.

  • Extra Button ClassesDefaultEmpty

    Space-separated classes added to the add-to-cart button, for product layouts whose button differs (a larger button, a full-width one). WooCommerce's own classes are always kept.

Cart Feedback

  • Add to Cart Without ReloadingDefaultOn

    The product is added in the background and the visitor is told it worked, instead of the whole page reloading with no confirmation. A visitor without JavaScript still gets the ordinary form. Ignored while the store is set to redirect to the cart after an addition.

  • Confirmation StyleDefaultToast

    Whether the confirmation floats over the page and fades, or sits beside the button until the shopper moves on.

    ChoicesToastInline MessageShown when Add to Cart Without Reloading is on

  • Toast PositionDefaultTop Right

    Where on the screen the floating confirmation appears.

    ChoicesTop LeftTop CenterTop RightMiddle LeftMiddle CenterMiddle RightBottom LeftBottom CenterBottom RightShown when Add to Cart Without Reloading is on and Confirmation Style is "Toast"

  • Confirmation MessageDefault%s has been added to your cart.

    %s is the product name, for a variable product, the exact variation that was added. %d is the quantity.

    Shown when Add to Cart Without Reloading is on

  • Link to the Cart in the ConfirmationDefaultOn

    Offer a link straight to the cart in the confirmation, so a shopper who is finished can check out at once.

    Shown when Add to Cart Without Reloading is on

  • Cart Link TextDefaultView Cart

    Wording of that link.

    Shown when Add to Cart Without Reloading is on and Link to the Cart in the Confirmation is on

  • Message: Options Not ChosenDefaultPlease choose the product options before adding this product to your cart.

    Shown when a variable product is added before its options identify one variation.

    Shown when Add to Cart Without Reloading is on

  • Message: Not Enough StockDefaultEmpty

    Shown when the item is out of stock, or the quantity asked for is more than the store has left. Leave empty to use the store's own message, which names the product and its live stock figures.

    Shown when Add to Cart Without Reloading is on

  • Message: Could Not Be AddedDefaultSorry, this product could not be added to your cart. Please try again.

    The fallback for anything else that stops the addition: a rejected product or a server that could not be reached.

    Shown when Add to Cart Without Reloading is on

Every Canvas block also carries the Animation, Scroll Effects and Advanced panels, which are described in Controls every Canvas block has.

Other blocks in WooCommerce: Cart Table, Cart Totals, Checkout Billing, Checkout Order Review, Conference Tickets, Cross-Sells.

Was this page helpful?