Quick add lets a customer add a product to their cart directly from a product card, without opening the full product page. You enable it per section in the theme editor, and shoppers on that section's cards get an inline add-to-cart control or a Quick add panel for choosing options and quantities.
Quick add
Updated 3 weeks ago
Available since Cama version 2.
Quick add lets a customer add a product to their cart directly from a product card, without opening the full product page. You enable it per section in the theme editor, and shoppers on that section's cards get an inline add-to-cart control or a Quick add panel for choosing options and quantities.
Enable Quick add
Quick add is a per-section setting, so you turn it on independently for each place your store shows product cards.
In the Shopify theme editor, open the section that displays product cards.
Turn on the Enable quick add button setting.
The setting is available in the Header, Featured collection, Main collection grid, Product recommendations, Search, and Featured product card sections.
How Quick add appears on product cards
Once enabled, a product card uses one of two controls depending on the product. For a product with a single variant and no quantity rules, the card shows a direct Add to cart button that adds the item immediately. For a product with more than one variant, or with a quantity rule (a minimum above 1, a maximum, or an increment above 1), the card shows an Add to cart button that opens the Quick add panel.
Choose options and quantities in the Quick add panel
The Quick add panel is where shoppers pick variants and confirm the add for products that need options. It can show the featured media, the product title, the selected variant's price, the variant picker, and the buy buttons, with an optional View more details link to the full product page.
When a shopper selects a variant, the price updates to that variant. If the selected option has no available variant, that option shows as unavailable, and if the current variant is sold out the Add to cart button is disabled and shows Sold out. A product set up as a pre-order shows Pre-order instead.
After a successful add, the panel closes and the cart updates. You can close the panel with its close control, by clicking the overlay, or by pressing the Escape key.
Settings and blocks
Edit the content shown in the Quick add panel from the product.quick-add template.
Setting | Description |
|---|---|
Show the featured media | Displays the product's featured media in the panel. |
Show the view more link | Adds a "view more" link at the bottom of the panel. |
Blocks
Available blocks:
Variant picker (same as the main product section)
Buy buttons (same as the main product section)
Test Quick add on desktop and mobile
Preview your store before publishing to confirm both card controls work. Test with a product that has one variant and a product with multiple options or a quantity rule.
In the theme editor, open a collection or featured-collection page with Quick add enabled.
On a single-variant product, click the inline Add to cart button and confirm the item appears in the cart.
On a multi-variant or quantity-rule product, click Add to cart, choose an option in the panel, and add the item.
Switch to the mobile preview and repeat the same two steps to confirm both controls behave the same on a touch screen.
Quick add FAQ
What is Quick add in the Cama theme?
How do I enable Quick add in the Cama theme?
Open the section that displays product cards in the Shopify theme editor and turn on the Enable quick add button setting. It's available in the Header, Featured collection, Main collection grid, Product recommendations, Search, and Featured product card sections.
Why does my product card show a direct Add to cart button instead of the Quick add panel?
A product with a single variant and no quantity rules shows a direct Add to cart button that adds the item immediately. A product with more than one variant, or with a quantity rule (a minimum above 1, a maximum, or an increment above 1), shows an Add to cart button that opens the Quick add panel instead.
How do shoppers choose options and quantities in the Quick add panel?
In the panel, shoppers pick a variant and confirm the add. The panel can show the featured media, the product title, the selected variant's price, the variant picker, and the buy buttons, with an optional View more details link to the full product page. When a shopper selects a variant, the price updates to that variant.
How do I test Quick add in the Cama theme before publishing?
Preview your store on desktop and mobile and test with a product that has one variant and a product with multiple options or a quantity rule. On a single-variant product, click the inline Add to cart button and confirm the item appears in the cart. On a multi-variant or quantity-rule product, click Add to cart, choose an option in the panel, and add the item. Repeat both steps in the mobile preview.
How do I customize the Quick add panel in the Cama theme?
Edit the content shown in the Quick add panel from the product.quick-add template. The Show the featured media setting displays the product's featured media, and Show the view more link adds a link at the bottom of the panel. The Variant picker and Buy buttons blocks work the same as in the main product section.
Was this helpful?
Was this helpful?