Fudge can add a product quick-view modal

Drop-in CRO upgrades
•
Conversion

Add a quick-view modal to Shopify collection cards: image gallery, variant picker and Add to cart in a popup, without loading the product page.

Try this in Fudge Book a demo
Try this prompt

Add a quick-view modal to product cards on collection pages. Image, title, price, variants, add-to-cart — no page load.
Want more control? See the expanded prompt ›

On every collection page, add a 'Quick view' button to each product card. Clicking opens a modal with the product image gallery, title, price, variant picker, and Add to cart — no full page load.

Pattern
[Element] + [Trigger] + [Visibility rules] + [Style direction] — Fudge fills in the rest (brand voice, fonts, photography, shipping, schema) from your store.
You say
Fudge fills in automatically
Quick-view modal on collection pages
Component and scope
Image, title, price, variants, add-to-cart
Modal contents
No page load
Behavior
AUTO
Product image gallery in modal
AUTO
Variant picker
AUTO
Common conversion patterns for this element
AUTO
Styling matching your brand
Key takeaways
  • Opens product details inline without leaving the collection.
  • Full image gallery and variant picker, not a stripped-down view.
  • Add to cart works without page reload.
  • Mobile gets a bottom-sheet variant instead of a modal.

What you're trying to do

Going to a PDP from a collection page is a commitment — most shoppers won't make it for products they're only mildly curious about. A quick-view modal lets them peek without committing, and the ones who like what they see add to cart in place.

Things to watch out for

  • Variant handling: Fudge reads the product's variant data when the modal opens, so the picker stays in sync.
  • Mobile UX: the modal becomes a bottom sheet within thumb reach.
  • Image carousel: native scroll-snap, no library needed.
  • Back button: Escape or the back button closes the modal without leaving the page.
Want this built for you? Fudge does it in minutes.
Try this in Fudge

How Fudge does it

Fudge duplicates your live theme into a draft, builds the section as an editable Shopify section with the placement and behavior your prompt requires, and wires it to your real product data and brand styling. Everything starts in draft — preview on your store, tweak via the Theme Editor, and publish only when you're ready. Your live store stays untouched.

Why quick-view modals improve browsing

Instead of clicking through to the full PDP, a quick-view modal opens the product details (image gallery, title, price, variant picker, Add to cart) without leaving the collection page. It saves shoppers a round trip to the product page.

When this is worth building

Build quick-view for collection-heavy stores where shoppers browse multiple products before buying. Skip for stores where shoppers land on the PDP directly.

What makes one great

  • Quick view button on each product card — easily accessible.
  • Modal with product gallery + buy box — full PDP-equivalent functionality.
  • No full-page load — fast.
  • Mobile-friendly modal sizing — fills screen on mobile.

Pair this with one-click AJAX add-to-cart and hover-reveal collection.

Fudge builds this as part of its merchandising work; for a step-by-step version, see the Shopify quick view modal guide.

Common questions

Does it work with my custom PDP layout?
Yes. Fudge reuses your existing variant picker and Add to cart components rather than building parallel ones.
Will Google still index my PDPs?
Yes. Quick view only adds a button; each product page keeps its URL and stays the canonical page for search engines.
Can I disable it for certain products?
Yes. Add the tag no-quick-view to a product and its card skips the button.
👋 Have your own questions?
Chat to us

Try Fudge free

Install the Shopify app and run this exact prompt in under a minute.

Free Shopify Trial Book a demo