Add to cart from product cards
Add a chosen product variant to the shopper's own Shopify or BigCommerce basket from a product card.
What it is
Add to cart lets a visitor add a chosen product to their store basket from a chat product card. The addition uses the shopper's existing storefront session. It does not place an order or complete checkout.
Who uses it and why
- Visitors choose the product options and confirm an addition without leaving chat.
- Developers connect the storefront experience and refresh basket indicators after successful additions.
Where to find it
Visitors use Add to cart on supported product cards. Its visible text can follow the card's action labels and language.
Users with the Settings role select quantity presentation in Settings › Commerce › Product Cards. Users with the Settings or Developer role configure the store connection in Settings › Commerce › Commerce Providers.
How it works
- Open the card on the matching store's website.
- Choose the required variant options and quantity, when offered.
- Confirm Add to cart. Choosing the last option alone does not submit the addition.
- Wait for confirmation from the store before treating the addition as successful.
Shopify adds the variant using the store's localised shopping context. BigCommerce adds to the existing basket or creates one when none exists. If BigCommerce returns several baskets, INSIDE stops rather than choosing one.
Developers can listen for inside:commerce-cart-updated on the host page to refresh a basket count or drawer. The event is sent after a confirmed addition and includes the provider, product, variant and quantity. INSIDE does not assume that the storefront has a particular basket drawer.
Configure it
Use a provider that supplies a supported basket action and valid product and variant information. Embed chat on the corresponding storefront so the addition uses that shopper's session.
Ask a colleague with the Settings role to choose whether Quantity is hidden, in the options popup or on the card. Hidden quantity normally adds one, subject to the product's quantity restrictions. Check the storefront's basket refresh behaviour after a successful addition.
Limits and good to know
- Quantity must be a whole number from 1 to 99 and satisfy any stricter product minimum, maximum or increment.
- The action needs a valid variant and matching storefront. Shopify also recognises its configured shop domain on the current storefront.
- A second addition cannot start while one is in progress. Failed additions are not retried automatically.
- Products requiring unsupported modifiers or selling plans may offer a product link instead of integrated addition.
- Basket tracking is separate. Receiving a tracked basket update does not prove that an addition succeeded.
Depends on and works with
View all connections as a list
This feature uses
- Shopify commerce connectionEnhances
Shopify supports additions in the shopper's storefront session.
- BigCommerce store connectionEnhances
BigCommerce supports finding or creating the shopper's basket and adding a line.
- Product options and variant selectionEnhances
Option selection lets shoppers add products that need a specific size, colour or other variant.
- Product card configuration and shopping actionsRequires
Product cards provide the choices and explicit shopping action.
- Visitor chat paneRequires
The embedded chat communicates with the current storefront page.
- Product cards in visitor chatRequires
The visitor's product controls dispatch the confirmed action.
Used by
- Product cards in visitor chatEnhances
Supported storefront integrations provide basket actions.
- Shopify commerce connectionEnhances
Eligible product variants can use the shopper's storefront basket.
- BigCommerce store connectionEnhances
Eligible products can be added to the shopper's own storefront basket.
- Product options and variant selectionEnhances
A supported storefront action adds the selected available variant to the shopper's basket.
- Store product selection for chatEnhances
Supported visitor basket actions are retained when cards are prepared for sending.
- Product card configuration and shopping actionsEnhances
Supported storefront actions add the selected variant to the visitor's basket.
- Product recommendation and purchase reportsEnhances
Visitor basket actions supply Add to Cart click measures.
FAQ and troubleshooting
Why am I asked to open the store's website?
The addition must run in the matching storefront session. Open the product link and continue on that store.
Why is the action unavailable after I choose options?
The chosen variant may be unavailable, incomplete or require purchase options the integrated action does not support. Continue through the product page.
Why did my basket counter not change?
Check the store basket itself. Developers may need to refresh the counter or drawer when the cart-updated event arrives.
Can the action check out for me?
No. Continue to the store's basket and checkout after adding the product.