📢 Don't fork this project. Use, contribute, or open issues through Store Discussion.

Add To Cart Button

AddToCartButton is a button responsible for handling events of adding products in the minicart.

image

Configuration

  1. Import the vtex.add-to-cart-button's app to your theme's dependencies in the manifest.json, for example:
"dependencies": {
  "vtex.add-to-cart-button": "0.x"
}
  1. Add the add-to-cart-button block to any block bellow store.product. For example:
  "store.product": {
    "children": [
      "flex-layout.row#product",
    ]
  },
  "flex-layout.row#product": {
    "children": [
      "add-to-cart-button"
    ]
  }
Prop nameTypeDescriptionDefault value
isOneClickBuyBooleanShould redirect to the checkout page or notfalse
customToastURLStringSet the link associated with the Toast created when adding an item to your cart./checkout/#/cart
customOneClickBuyLinkStringSet the link to redirect the user when the isOneClickBuy prop is set to true.'/checkout/#/cart'

Customization

In order to apply CSS customizations in this and other blocks, follow the instructions given in the recipe on Using CSS Handles for store customization.

CSS Handles
buttonText
buttonDataContainer