À retenir
- Shopify ne propose pas de fonctionnalité native de comparaison de produits côte à côte.
- L’option de prix « Compare at » affiche le prix d’origine par rapport au prix de vente sur un seul produit, et non une comparaison entre plusieurs produits.
- Pour comparer plusieurs produits, utilisez une application de comparaison ou créez un tableau de comparaison sur mesure avec Fudge.
- Les pages de comparaison sont particulièrement utiles pour les boutiques vendant plusieurs produits similaires (abonnements, compléments alimentaires, produits tech).
Les acheteurs qui comparent des produits similaires veulent voir les différences clairement, sans avoir à ouvrir plusieurs onglets. Un tableau de comparaison permet de répondre à la question « pourquoi celui-ci plutôt qu’un autre ? » en un seul coup d’œil.
Pourquoi vous pouvez nous faire confiance
Nous avons travaillé sur l’architecture produit et l’optimisation des conversions pour des centaines de boutiques Shopify. Nous avons également créé Fudge — un éditeur de vitrine IA avec une note de 4.9 sur le Shopify App Store.
Existe-t-il une fonctionnalité de comparaison de produits intégrée à Shopify ?
Non, malheureusement, Shopify ne possède aucune fonctionnalité en natif permettant de comparer vos articles côte à côte.
La fonction native qui aurait pu s’en approcher de près ou de loin est le prix avant réduction (prix barré) – mais celle-ci ne sert qu’à afficher un ancien prix barré avec le prix réduit sur la fiche d’un seul produit. C’est simplement un indicateur d’affichage pour fixer son prix. Cela ne remplace en aucun cas un vrai comparateur.
Mais rassurez-vous, si vous voulez faire de la VRAIE comparaison entre produits, vous aurez accès à trois autres approches qui marcheront très bien.
Option 1 - Afficher un tableau de comparaison dans une page (ou dans la section d’une page produit)
C’est la méthode de loin la plus simple pour ceux dont l’objectif est simplement de créer une comparaison qui restera “statique” sur un groupe bien précis de produits.
Pour ce faire, construisez simplement la structure de votre tableau comparatif sous forme de section incluse dans l’une de vos pages classiques ou sur votre page de description du produit en question. Renseignez-y des lignes faisant état des attributs clés recherchés par les consommateurs visés, ainsi que des colonnes représentant chaque article.
Ce qu’il faut absolument penser à y mettre :
- Nom et visuel attrayant de l’article
- Le prix
- Des caractéristiques techniques essentielles (tailles ou formats, poids, matériaux, ingrédients contenus, capacités)
- Une mise en évidence des fonctionnalités que l’article aura ou n’aura pas (des croix pour non, et des coches pour un grand oui)
- Les notes étoilées réelles et la quantité de notes/avis sur cet article
- Un beau bouton “Call-to-action” mis en évidence sous la colonne de CHAQUE article
Le seul petit bémol : comme précisé, parce que l’éditeur natif de Shopify peut manquer de sections tableaux pré-faites, vous allez sûrement insérer votre simple petit tableau sous forme de code HTML primitif depuis un éditeur de texte. Mais le rendu ne vaudra rien vis-à-vis de l’UI/design très travaillée de votre thème de départ.
À la place de bidouiller ce code HTML pur que vous allez insérer vous-même, tournez vous plutôt vers un véritable tableau que Fudge s’assurera de rendre attrayant et conforme avec les codes pré-installés par l’équipe qui a développé le design actuel du modèle visuel final de l’infrastructure globale qui anime l’UI existante du front, sur la base de la thématique mise en place et développée par vos équipes actuelles au lancement. Plus sobrement, vous utiliserez Fudge.
Option 2 - Miser sur une application de comparatif venant du store Shopify
Sachez que plusieurs chouettes apps disponibles dans l’App Store de votre ami Shopify pourraient rajouter des fonctionnalités utiles visant à aider au bon diagnostic d’éléments produits sur le shop. Que fera t-on du coup ? :
- Les acheteurs vont pouvoir tranquillement cliquer pour sélectionner d’une traite entre 2 et 4 produits en se baladant pour faire leurs achats sur les fameuses pages “Collection”.
- Une modale ou un panneau à tiroir latéral fait alors subitement et gracieusement irruption sur l’écran et dévoile directement sous les yeux ahuris – pour ne pas en rater une miette ! – de vos gentils acheteurs en manque de renseignements techniques pointus, une superbe juxtaposition bien mise en avant, de caractéristiques, de fonctionnalités qui séparent l’article B plus cher par rapport à l’article A bradé par la promo éphémère mise en ligne l’avant-veille.
- Cela tirera (souvent) toutes les caractéristiques ou les “specs” nécessaires sur l’écran en un battement d’onglet, puisées sur la data de l’inventaire back-end de la base.
Rendez-vous sur l’App Store de Shopify et cherchez des termes tels que “product comparison”. Vous aurez un très grand choix au regard de divers réglages esthétiques / prix.
Pour aller plus loin : Ajouter des Metafields aux produits Shopify.
Pour aller plus loin : Personnaliser votre page de produit Shopify.
Où ça devient ultra pertinent : Très chouette pour les propriétaires de sites hébergeant des tonnes et des tonnes de catalogues bien distincts à foison recelant de nombreuses catégories produits (Ex. Hi-tech grand format, petits suppléments vitaminés variés via de minuscules fioles dissemblables aux vertus divergentes, des placards et étagères IKEA à composer de son côté avec d’impressionnantes listes à n’en plus finir remplies jusqu’à ras-bord d’innombrables choix concernant toute la variation métrique de mesures géométriques dont le catalogue a pu en faire de longues fiches de présentation).
Option 3 - Créer un joli tableau de comparaison très propre et unique grâce à Fudge
Si vous aspirez à ce fameux tableau de comparaison visuel sur mesure et parfait qui viendra se fondre de manière native sur votre propre page actuelle (en conservant absolument vos mêmes jolis styles d’écriture, vos typos personnalisées, vos palettes aux exactes mêmes couleurs de vos logos et des agencements du layout), Fudge devient du coup votre nouveau super meilleur ami absolu pour réussir ça.
Quelques petits exemples de “prompts” pour vous mettre l’eau à la bouche :
-
“Peux-tu rapidement générer pour moi de toutes pièces une belle section reprenant et retraçant exactement, sous la jolie mais lisible forme et l’allure d’un grand tableau ultra large qui engloberait la page avec mes supers poudres, une façon de mettre côte à côte ces mêmes 3 produits ; et qu’on y lise bien très en gras le coût de leur version ‘par cuillère’ puis la composition complète de la poudre des extraits, les goûts mis en vente, leurs additifs très bien renseignés sans aucun tabou et le petit bouton cliquable de renvoi au checkout à caler en bon dernier tout à fait à droite du tableau de son propre article cliqué à chaque fois ?”
-
“Je veux de l’aide et de la génération algorithmique à ce que je mette pour les literies que je propose à ma gentille clientèle, là maintenant sur le champ, cet autre tableau de test technique détaillé. Il m’est très nécessaire que je puisse placer à tout moment une colonne attribuée uniquement pour tout matelas que j’ajouterai en base et pour finir insère très exactement en les croisant avec plein de puces et une belle lisibilité : leur soutien/le matelas de ressort qui le tiendra pour un bon repos nocturne sain pour mes vieux os. Ainsi qu’évidemment pour les couches et matériaux (rempli du petit coton tout propre de bonne nature écolo). Qu’on en compte aussi un certain taux attribué lié au chouette remboursement des pénalités éventuelles de vice lors de la rente. Ajoute vers le bout cette petite bulle ‘L’idéal conseillé’.”
-
“Allez ! Vas y crée moi stp un espace comparateur pour que je refourgue aisément de nouveaux contrats de vente (starter pack / level growth pack, de la gamme pro mega giga cher de l’espace). En fait y’à rien de bien compliqué tu n’auras juste à y inclure que trois pôles divisés que vont venir remplir quelques textes informatifs reprenant les choses et un prix par tranche tarifaire et sa modale de redirections de finalisation.”
Avec cela, c’est l’IA de Fudge elle-même via tout son potentiel de dingue qui va retranscrire avec du superbe code de la logique “Liquid” l’exact code HTML natif (tout en préservant le bon flow existant) ! Laissez ça traîner du côté des draft “brouillons” et à peine serrez-vous assez sûr de la vérification vous publiez tout court, net, d’une seule touche ciblée.
À lire aussi : Constructeur de pages Fudge.
À lire aussi : Ajouter du code Javascript personnalisé sur Shopify.
Est-ce utile et pertinent de construire ce genre de page, en fin de compte… et à partir de quels moments et cas de figure bien précis ?
Cas les plus pertinents :
- Plusieurs SKU avec des noms similaires - “Formule avancée vs Originale vs Extra forte”
- Niveaux d’abonnement ou forfaits - une différenciation claire des fonctionnalités par forfait
- Produits tech - processeurs, appareils photo, enceintes nécessitant de comparer les caractéristiques techniques
- Matelas, meubles, électroménager - où les différences de spécifications influencent directement la décision d’achat
Cas moins pertinents :
- Les produits qui diffèrent principalement par leur couleur ou leur taille (les acheteurs peuvent le voir dans les sélecteurs de variantes)
- Les boutiques avec moins de 5 produits (la comparaison a moins de valeur ajoutée pour les petits catalogues)
- Les produits de grande consommation où le prix est le seul élément de différenciation
Les pages de comparaison et de cas d’usage font également partie des éléments que les moteurs de réponse IA recherchent pour décider quelle boutique citer. Notre test gratuit de préparation à l’IA pour Shopify évalue votre couverture de pages longue traîne ainsi que le reste de votre lisibilité par les machines.
Quelle est alors, la si grande différence qu’il y aurait pour ce truc entre de la fameuse “comparaison” (le compare basique) versus le bouton du “prix avant réduction” (compare-at) dans un logiciel qu’est celui ce chez notre gentil développeur canadien de Shopify au juste !! ?
Prix avant réduction ou le fameux “prix barré” (compare at) : c’est quoi ?! Hé bien tout très bêtement c’est une sorte de métadonnée d’un bête d’un tout très tout bête champ intégré (par Shopify nativement dans ses éditeurs back de vos panels des paramètres lors des bons listings) qu’il faut en toute aisance entrer au tout bon début et tout va du meilleur et c’est ce qu’il va servir qu’il affiche et qu’il se souvienne pour afficher quoi d’autre ? Bah tout bonnement le prix plein tarifs initiaux. C’est du Prix Public Conseillé on dira un RRP chez les ricains par la simple traduction là !! Dès d’lors du fait si d’un côté la baisse effectuée (l’ancien d’un tarif passé avec qu’il lui soit de par là apposée ici dans une promo ou qu’importe). Vous avez de ce fait tout d’un de coup une mise super chic qui souligne en format tout d’un coup visuellement “barré” d’une ligne d’un vieux tarif rattaché au prix mis actuellement pour solder des articles. C’est à la pure et forte caractéristique très et d’emblée à 100% que là pour ce qui est de bien faire de la simple et bête affichage et de belles baisses ! (C’est tout d’une fonctionnalité pour faire une chose sur un article seul rien !! !).
L’authentique et la véritable expérience que confère l’outil du “Comparateur très poussé via des bons beaux produits” – ici on passe de choses différentes avec d’avantage l’intention bien ferme et qu’ils ont voulu d’avoir à l’esprit la bonne super approche sur ça de vous exposer sous de gros angles multiples très côte-à-côté pas qu’un truc pour tout évaluer et se les confronter sous pleins de de bons et très larges d’aspects toutes les options et tous les moindres de multiples trucs de différents et réels et gros détails pour de tout et pleins de produits à même fois sur l’écran pour bien l’aide à faire une super estimation par les utilisateurs en ligne pour tout vérifier sous la lampe les aspects. C’est CE bon et vrai système ou les gens l’appelleront ici par ce super et formidable moyen qui imposera et que c’est une exigence d’une bonne et belle superbe app ou la customisation de bout à autre de votre part d’une vraie petite solution ad ‘hoc ! (d’une implémentation) !.
Du coup sur les terminologies ces superbes amis que ce sont tout ces termes se ne sont tout d’entres eux pour vous, qu’il vous y faire à vous, sur un avis… et au bout de grand moment qu’ils se rencontrent c’est de bien les dissocier : Aucun. Oui Aucun !!! Absolument en fin de l’échelle y à aucuns rapports dans Shopify. (Juste leurs mots, s’entre d’un nom de sens super trompeur quoi !).
De la partie de savoir le “comment mettre à de vraies oeuvres et le “faire” et les actes ! Pour alors, là… rajouter du super Prix tout bien mis en “avant réductions” de prix dans la plateforme l’ami Shopify ?? Hé Comment ça se goupille !??
Le « Prix avant réduction » est un prix barré qui affiche le coût initial à côté du prix de vente. Pour l’ajouter : allez dans Produits → sélectionnez le produit → descendez jusqu’à la section Tarification et saisissez une valeur dans le champ Prix avant réduction. Définissez le prix de vente actuel dans le champ Prix. Shopify affichera automatiquement les deux et calculera le pourcentage de remise. Consultez notre guide sur la modification des noms des variantes dans Shopify si vous souhaitez afficher des prix avant réduction pour chaque variante.
FAQ
Non. Shopify propose un prix "compare at" pour un seul produit, mais aucune fonctionnalité native de comparaison multi-produits. Pour une comparaison côte à côte, décrivez le tableau à Fudge ("compare ces trois poudres de protéines par prix par portion, grammes de protéines et parfum") et il générera une section native intégrant les attributs des produits dans une grille bien stylisée. Alternative : une application de comparaison sur le Shopify App Store.
3 à 4 colonnes sur ordinateur, 2 colonnes sur mobile. Au-delà de 4, les tableaux de comparaison deviennent difficiles à lire et nécessitent un défilement horizontal sur la plupart des écrans. Pour de plus grands ensembles de comparaison (par ex. plus de 10 produits), utilisez une page de comparaison filtrable où les acheteurs peuvent sélectionner jusqu’à 4 produits à comparer côte à côte.
Les tableaux de comparaison basés sur des applications le peuvent — ils injectent généralement du JavaScript qui s’exécute sur chaque page. Les tableaux de comparaison natifs construits directement dans votre thème ajoutent un poids négligeable (juste du HTML/CSS). Pour les boutiques soucieuses de leurs performances, privilégiez la création native plutôt que l’installation d’une application.
Les deux fonctionnent ; tout dépend de l’intention. La comparaison sur une page de collection aide les acheteurs à affiner leur choix au sein d’une catégorie. Les pages de comparaison dédiées (ex: "Comparez notre gamme de soins") sont meilleures pour le SEO et le netlinking car elles ciblent directement les requêtes d’intention de comparaison. La plupart des boutiques ont tout intérêt à utiliser les deux.
Oui — définissez des metafields pour les attributs que vous souhaitez comparer (ex: weight, material, feature_x). Le tableau de comparaison les lit via Liquid et les affiche automatiquement pour chaque produit. C’est très évolutif : l’ajout d’un nouveau produit avec les bons metafields l’intègre automatiquement dans le tableau sans aucune mise à jour manuelle.