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 récupère le JSON des variantes en direct pour que le sélecteur reste synchronisé.
- UX mobile — Fudge s'en charge : la modale devient un bottom-sheet qui respecte la zone d'action du pouce.
- Carrousel d'images — Fudge s'en charge : fonctionne avec le scroll-snap natif, aucune bibliothèque n'est nécessaire.
- Bouton retour — Fudge s'en charge : la touche Échap ferme la modale ; le bouton retour du navigateur ne vous fait pas 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 page produit (PDP) complète, une modale d’aperçu rapide ouvre les détails du produit — galerie d’images, titre, prix, sélecteur de variantes, bouton Ajouter au panier — sans quitter la page de collection. Augmente le taux d’ajout au panier des acheteurs qui, autrement, retourneraient en arrière.
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 de produits + buy box — mêmes fonctionnalités qu’une page produit complète.
- Pas de chargement de page complète — rapide.
- Taille de la modale adaptée aux mobiles — remplit l’écran sur mobile.
Associez ceci à l’ajout au panier AJAX en un clic et à la collection révélée au survol (hover-reveal).