Ajoute une modale d'aperçu rapide aux cartes produits sur les pages de collection. Image, titre, prix, variantes, ajout au panier — sans chargement de page.
Want more control? See the expanded prompt ›
Sur chaque page de collection, ajoute un bouton « Aperçu rapide » à chaque carte produit. Le clic ouvre une modale avec la galerie d'images du produit, le titre, le prix, le sélecteur de variantes et l'Ajout au panier — sans chargement complet de la page.
- Ouvre les détails du produit en ligne sans quitter la collection.
- Galerie d'images complète et sélecteur de variantes, pas une vue allégée.
- L'ajout au panier fonctionne sans recharger la page.
- Sur mobile, affiche un bottom-sheet plutôt qu'une modale.
Ce que vous essayez de faire
Passer d'une page de collection à une page produit (PDP) est un engagement — la plupart des clients ne le feront pas pour des produits qui ne suscitent qu'une légère curiosité. Une modale d'aperçu rapide leur permet de jeter un œil sans s'engager, et ceux qui aiment ce qu'ils voient l'ajoutent au panier directement.
Points de vigilance
- Gestion des variantes : Fudge lit les données des variantes du produit à l'ouverture de la modale, pour que le sélecteur reste synchronisé.
- UX mobile : la modale devient une bottom sheet à portée de pouce.
- Carrousel d'images : scroll-snap natif, aucune bibliothèque requise.
- Bouton retour : Échap ou le bouton retour ferme la modale sans quitter la page.
Comment Fudge procède
Fudge duplique votre thème actif dans un brouillon, crée la section en tant que section Shopify modifiable avec l'emplacement et le comportement requis par votre prompt, et la connecte à vos vraies données de produits et au style de votre marque. Tout commence dans un brouillon — prévisualisez sur votre boutique, ajustez via l'éditeur de thème, et publiez uniquement quand vous êtes prêt. Votre boutique en direct reste intacte.
Pourquoi les modales d’aperçu rapide améliorent la navigation
Au lieu de cliquer pour accéder à la PDP complète, une modale d’aperçu rapide ouvre les détails du produit (galerie d’images, titre, prix, sélecteur de variantes, Ajouter au panier) sans quitter la page de collection. Ça évite aux clients de faire un aller-retour sur la page produit.
Quand cela vaut la peine d’être développé
Créez un aperçu rapide pour les boutiques axées sur les collections, où les clients parcourent plusieurs produits avant d’acheter. À éviter pour les boutiques où les clients atterrissent directement sur la page produit.
Ce qui fait une bonne modale
- Bouton d’aperçu rapide sur chaque carte produit — facilement accessible.
- Modale avec galerie produit + buy box — fonctionnalité complète équivalente à une PDP.
- Aucun rechargement complet de la page — rapide.
- Format de la modale adapté aux mobiles — remplit l’écran sur mobile.
Associez cela à l’ajout au panier AJAX en un clic et à l’apparition au survol sur les collections.
Fudge construit cela dans le cadre de son travail de merchandising ; pour une version étape par étape, consultez le guide de la modale d’aperçu rapide Shopify.