Füge ein Quick-View-Modal zu Product Cards auf Collection-Seiten hinzu. Bild, Titel, Preis, Varianten, Add-to-cart — kein Page Load.
Want more control? See the expanded prompt ›
Füge auf jeder Collection-Seite einen 'Quick view'-Button zu jeder Product Card hinzu. Beim Klicken öffnet sich ein Modal mit der Produkt-Bildergalerie, Titel, Preis, Variantenauswahl und Add to cart — ohne kompletten Page Load.
- Öffnet Produktdetails inline, ohne die Collection zu verlassen.
- Vollständige Bildergalerie und Variantenauswahl, keine reduzierte Ansicht.
- Add to cart funktioniert ohne Page Reload.
- Mobile erhält eine Bottom-Sheet-Variante anstelle eines Modals.
Was du erreichen willst
Der Wechsel von einer Collection-Seite zu einer PDP ist ein Commitment — die meisten Kunden machen das nicht bei Produkten, auf die sie nur ein bisschen neugierig sind. Ein Quick-View-Modal lässt sie einen Blick riskieren, ohne sich festzulegen, und diejenigen, denen gefällt, was sie sehen, nutzen direkt den Add to cart.
Worauf du achten solltest
- Varianten-Handling: Fudge liest die Variantendaten des Produkts aus, wenn sich das Modal öffnet, sodass die Auswahl synchron bleibt.
- Mobile UX: Das Modal wird zu einem Bottom-Sheet in Reichweite des Daumens.
- Bilder-Karussell: Natives Scroll-Snap, keine Bibliothek notwendig.
- Zurück-Button: Escape oder der Zurück-Button des Browsers schließt das Modal, ohne die Seite zu verlassen.
Wie Fudge das macht
Fudge dupliziert dein Live-Theme in einen Entwurf, baut die Section als bearbeitbare Shopify-Section mit der Platzierung und dem Verhalten, das dein Prompt erfordert, und verknüpft sie mit deinen echten Produktdaten und deinem Brand-Styling. Alles beginnt im Entwurf — schau dir die Vorschau in deinem Store an, nimm Anpassungen über den Theme-Editor vor und veröffentliche erst, wenn du bereit bist. Dein Live-Store bleibt völlig unberührt.
Warum Quick-View-Modals das Browsing verbessern
Anstatt dich zur kompletten PDP durchzuklicken, öffnet ein Quick-View-Modal die Produktdetails (Bildergalerie, Titel, Preis, Variantenauswahl, In den Warenkorb), ohne die Kategorie-Seite zu verlassen. Das erspart deinen Kunden den Umweg über die Produktseite.
Wann sich die Umsetzung lohnt
Baue Quick-Views für Stores mit großen Collections, in denen Kunden vor dem Kauf durch mehrere Produkte stöbern. Überspringe dies bei Stores, in denen Kunden direkt auf der PDP landen.
Was ein gutes Modal ausmacht
- Quick-View-Button auf jeder Produktkarte — leicht zugänglich.
- Modal mit Produktgalerie + Buy-Box — volle PDP-äquivalente Funktionalität.
- Kein kompletter Seitenladevorgang — schnell.
- Mobilfreundliche Modal-Größe — füllt auf mobilen Geräten den Bildschirm aus.
Kombiniere das mit One-Click AJAX Add-to-Cart und Hover-Reveal in Collections.
Fudge baut dies als Teil seiner Merchandising-Arbeit ein; für eine Schritt-für-Schritt-Anleitung, sieh dir den Shopify Quick-View-Modal-Guide an.