Product Sections

Quick Shop

Last updated: February 5, 2026

Quick Shop

Quick Shop allows customers to add products to cart without leaving the current page.

How Quick Shop Works

  1. Customer clicks "Add" or "Quick Add" on a product card
  2. If product has variants, a modal opens
  3. Customer selects options (size, color, etc.)
  4. Clicks "Add to Cart"
  5. Product is added, customer stays on page

Enabling Quick Shop

Quick Shop is controlled in theme settings:

  1. Open the theme editor
  2. Click Theme settings
  3. Click Products
  4. Toggle Quick add on

Quick Add Button

When enabled, product cards show a quick add button:

  • Products without variants: Adds directly to cart
  • Products with variants: Opens variant selector modal

The Quick Shop Modal

For products with variants, the modal displays:

  • Product image
  • Product title
  • Price
  • Variant selectors (size, color, etc.)
  • Quantity selector
  • Add to Cart button

Where Quick Shop Appears

Quick Shop works on product cards in:

  • Featured Collection sections
  • Collection pages
  • Search results
  • Product recommendations

Variant Selection

Simple Products

Products without variants add directly to cart with one click.

Products with Options

Products with size, color, or other options open the modal for selection.

Color Swatches

If your products use color swatches, they appear in the modal for selection.

Benefits

Faster Shopping

  • Reduces clicks to purchase
  • Customers stay in browsing flow
  • Easier impulse purchases

Better Experience

  • Don't lose context of current page
  • Quick comparison shopping
  • Smoother mobile experience

Best Practices

Product Images

Ensure product images clearly show the item since customers may not visit the full product page.

Variant Names

Use clear, descriptive variant names that make sense without seeing the full product page.

Inventory

Quick Shop respects inventory settings - sold out variants are not selectable.

Quick View vs Quick Add

Elle offers two related features:

Quick Add (Default)

  • Focuses on adding to cart
  • Minimal information shown
  • Fastest path to purchase

Quick View Button

  • Optional additional button
  • Shows more product details
  • Includes description and more images

Enable Quick View in Theme settings > Products > Quick view button.

Mobile Experience

On mobile devices:

  • Modal is full-screen for easier interaction
  • Touch-friendly variant selectors
  • Large Add to Cart button
  • Easy to close and return to browsing

Troubleshooting

Quick Add Not Showing

  • Check Theme settings > Products > Quick add is enabled
  • Verify you're viewing a section that supports it
  • Check that products exist in the collection

Modal Not Opening

  • JavaScript must be enabled
  • Check for theme conflicts
  • Clear browser cache

Variants Not Loading

  • Ensure product has variants configured
  • Check variant inventory settings

Was this article helpful?

Still need help?

Contact Support