Comment afficher les variantes sur la page de collection dans Shopify (Dawn, Horizon et tous les thèmes)

02 how to show variants on collection page shopify 980x525 4

Votre page de collection Shopify affiche une carte par produit. Une veste déclinée en six coloris n’est qu’une seule vignette, avec une image et un prix. Cinq de ces coloris restent invisibles jusqu’à ce que quelqu’un clique.

Ce guide explique comment afficher les variantes sur la page de collection sous forme de cartes distinctes — autrement dit les variantes en tant que produits — sur n’importe quel thème Shopify, sans modifier le code du thème et sans dupliquer le moindre produit. La configuration est identique sur Dawn, Horizon, Impulse et Debut : cet article couvre donc tous les thèmes.

Ce que signifie « afficher les variantes sur la page de collection »

Tous les thèmes Shopify construisent leur grille de collection à partir de la même boucle Liquid : elle parcourt collection.products et rend une carte par produit. Les variantes se situent un niveau en dessous et n’obtiennent donc jamais leur propre emplacement dans la grille.

Séparer les variantes inverse la logique. Chaque variante devient sa propre carte, avec son image, son prix, son lien et sa place dans le tri. La veste devient six vignettes : noir, écru, rouille, olive, sable et marine, côte à côte.

Les marchands cherchent cela d’une dizaine de façons : afficher les variantes en collection, variantes en tant que produits, séparer les variantes, afficher les variantes comme des produits distincts, variantes sur la page de catégorie. Toutes désignent le même changement.

C’est surtout déterminant quand :

  • La couleur est le produit. Mode, chaussures, cosmétiques, peintures, laines, coques de téléphone. Le client balaie la grille à la recherche d’une couleur ; une carte affichant la mauvaise couleur est une carte qu’il dépasse.
  • La taille ou le poids détermine le prix. Bougies, café, compléments, emballages, formats d’impression. Une carte à « 49 € » masque le prix d’entrée à 9 €.
  • Vous vous appuyez sur les filtres. Filtrez sur « olive » dans une grille classique et vous obtenez tous les produits qui existent accessoirement en olive, la plupart des cartes montrant autre chose.
  • Vous envoyez du trafic payant vers les collections. Chaque coloris qui n’apparaît jamais dans la grille est du stock que vous payez pour cacher.

Trois façons de faire (deux vous coûtent cher)

1. Dupliquer les produits

La voie évidente : transformer un produit en six produits réels. Cela fonctionne, et c’est l’option la plus coûteuse qui soit :

  • Le stock se fragmente en six fiches au lieu d’un produit à six niveaux de stock par variante : chaque flux, synchronisation et intégration logistique doit suivre
  • Les avis se fragmentent. 60 avis sur un produit deviennent dix par produit. Votre meilleure page perd sa preuve sociale.
  • Les statistiques se fragmentent. Votre reporting ne vous dit plus comment se porte la veste, mais comment se portent six produits.
  • Cannibalisation SEO : six pages quasi identiques en concurrence sur la même requête
  • La maintenance se multiplie. Chaque changement de prix, chaque texte, chaque photo : six fois, pour toujours.
  • La page produit se dégrade. Le client perd le sélecteur de variantes ; changer de couleur devient un chargement de page au lieu d’un clic.

Vous abîmez durablement votre catalogue pour régler un problème d’affichage sur une seule page.

2. Modifier le thème

Un développeur réécrit la grille de collection pour qu’elle parcoure les variantes. Moins cher et réversible, mais :

  • Il faut le refaire pour les résultats de recherche, la collection en vedette de la page d’accueil, les produits associés et toute autre grille
  • La pagination continue de compter des produits alors que la grille rend des variantes : les tailles de page se décalent
  • Chaque mise à jour du thème est soit ignorée, soit re-appliquée à vos frais
  • Sur les thèmes les plus récents, la carte produit est un arbre de blocs imbriqués et non un simple snippet, ce qui complique nettement l’intervention
  • Règles de masquage, formats de titre, exceptions par collection et échantillons deviennent du code sur mesure que vous maintenez désormais

3. Séparer au moment de l’affichage

Laissez le catalogue exactement en l’état — un produit, ses variantes, une page produit, un bloc d’avis, une fiche de stock — et ne changez que ce que la grille affiche.

C’est ce que fait Stamp — Show Variants on Collection. L’application se greffe via les intégrations d’applications de Shopify : aucun fichier de thème n’est modifié et aucune donnée produit n’est réécrite. Désactivez-la et la grille revient immédiatement à la normale.

Dupliquer les produitsModifier le thèmeSéparer à l’affichage
Le catalogue reste intactNonOuiOui
Le stock reste intactNonOuiOui
Les avis restent regroupésNonOuiOui
Survit aux mises à jour du thèmeOuiNonOui
Couvre aussi recherche et accueilOuiTravail supplémentaire à chaque endroitOui
Réversible en un clicNonNonOui
Temps de configurationJoursJoursMinutes

La configuration : identique sur tous les thèmes Shopify

Beaucoup s’attendent à ce que cette partie dépende du thème. Ce n’est pas le cas. Comme l’application fonctionne via une intégration d’application et non comme une modification du thème, les mêmes six étapes s’appliquent, que vous soyez sur Dawn, Horizon, Impulse ou un ancien Debut.

Étape 1 — Activer le réglage

Deux interrupteurs indépendants dans le tableau de bord :

  • Show variants separately — sépare les variantes en cartes distinctes. C’est l’interrupteur décisif.
  • Show product price range — conserve une carte par produit mais remplace le prix unique par une fourchette ou un prix « à partir de ».

Étape 2 — Sélectionner une collection

Choisissez les collections sur lesquelles l’application doit tourner. Commencez par une collection riche en couleurs : vous jugerez le résultat plus vite. Le plan gratuit fonctionne sur un nombre limité ; les plans payants débloquent toutes les collections, y compris un interrupteur All collections.

Étape 3 — Sélectionner un thème

Par défaut, l’application agit sur votre thème publié. Sur une boutique en production, dupliquez d’abord le thème et sélectionnez la copie non publiée dans Theme settings : l’aperçu se fera sur la copie jusqu’à ce que vous publiiez.

Étape 4 — Choisir le critère de séparation

La seule décision qui façonne toute la grille.

RéglageCe qui apparaît dans la grilleUsage typique
Show 1st option separatelyUne carte par valeur de la première option (ex. Color)Mode, cosmétiques
Show 2nd option separatelyUne carte par valeur de la deuxième option (ex. Size)Bougies, café, emballages
Show 1st and 2nd combinedUne carte par combinaison (ex. Bleu / 45)Chaussures, où les deux comptent
Show all options combinedUne carte par variantePetits catalogues, sur-mesure
Show selected options separatelyUne carte par valeur des noms d’options que vous saisissezCatalogues mixtes à ordre d’options irrégulier

L’erreur la plus fréquente consiste à choisir « 1st option » alors que l’ordre des options n’est pas uniforme dans le catalogue. Si la moitié de vos produits sont en Color/Size et l’autre moitié en Size/Color, utilisez Show selected options separately et saisissez explicitement les noms d’options, y compris toutes les variantes linguistiques employées par votre boutique : Color, Couleur, Taille, Size, Farbe.

La deuxième erreur la plus fréquente est de se rabattre sur « all options combined ». Un produit en 5 couleurs × 6 tailles devient 30 cartes. Séparez selon l’axe que vos clients parcourent réellement et laissez le reste à la page produit.

L’assistant de configuration vous guide : activer le réglage Show variants separately, sélectionner une collection, sélectionner un thème et choisir l’option de séparation des variantes (vous pouvez préciser quelle option s’affiche séparément).

Une fois l’application activée sur votre thème, cliquez sur le bouton I have done this, puis ouvrez l’aperçu de la collection et regardez le résultat.

Étape 5 — Activer l’application sur votre thème

Allez dans Shopify Admin → Boutique en ligne → Thèmes → Personnaliser → Intégrations d’applications, activez Variants on Collection puis cliquez sur Enregistrer en haut à droite de l’éditeur de thème. De retour dans l’application, cliquez sur I have done this.

Le tableau de bord affiche un statut App embed: Installed / Not installed : vous n’avez donc pas à deviner si cela a fonctionné.

Éditeur de thème Shopify : activer l'intégration d'application Variants on Collection puis enregistrer

Éditeur de thème → Intégrations d’applications (1) → activer Variants on Collection (2) → Enregistrer (3). C’est le seul changement apporté à votre thème.

Étape 6 — Afficher la page de collection

Ouvrez la collection. Une carte par variante, chacune avec son image et son prix. Durée totale : environ cinq minutes.

Rendre la grille séparée volontairement soignée

Séparer est la partie facile. Ces quatre réglages déterminent si la grille paraît conçue ou cassée.

Format de titre

Six cartes répétant « Field Jacket » six fois ressemblent à un bug. Choisissez un format qui nomme la variante :

  • Product title – Variant title → « Field Jacket – Olive »
  • Product title (option1) → « Field Jacket (Olive) »
  • Variant title → « Olive »
  • Product title (option1/option2/option3) → spécification complète entre parenthèses
  • Custom title format → {product.title} - {variant.title} ou {variant.title} - {variant.options2} pour « Olive – 45,46,47 »

Format de prix

Pertinent lorsqu’une carte séparée couvre encore plusieurs variantes à des prix différents :

  • From min. price → « à partir de 48 € »
  • Min. price – Max price → « 48 € – 56 € »
  • Regular price → « 56 € »
  • Custom price format, avec un interrupteur pour afficher avec ou sans devise

Règles de masquage

La séparation expose chaque référence morte et chaque photo manquante. Trois interrupteurs font le ménage :

  • Hide products/variants without images — le plus grand gain de qualité pour un seul réglage. Activez-le avant de montrer le résultat à qui que ce soit.
  • Hide out of stock — masque indépendamment du réglage « Continuer la vente en rupture de stock »
  • Hide unavailable — s’applique lorsque ce réglage est désactivé

Vous pouvez aussi exclure entièrement certains produits de la séparation à l’aide d’une balise : pratique pour les lots, les cartes cadeaux et les produits à variante unique qui doivent rester une seule carte.

Mélanger les variantes

Par défaut, les variantes séparées d’un même produit restent côte à côte, si bien qu’un produit très coloré peut occuper une ligne entière. Mix variants les répartit dans la grille. Cela fonctionne avec les tris « Featured » et « Best selling ».

Échantillons de variantes sur les cartes de collection

Les échantillons sont l’autre moitié du travail : les pastilles de couleur, les vignettes d’image ou les boutons libellés sous chaque carte. Forme (carrée, arrondie, ronde), taille, hauteur, épaisseur et couleur de bordure, alignement et marges sont entièrement paramétrables.

Le Swatch type détermine ce qui est rendu : un code couleur, une image ou un bouton texte. La Swatch source détermine d’où vient la valeur :

  • Variant — de la variante elle-même
  • Theme swatch — les couleurs et images que vous avez déjà définies sur les valeurs d’option produit dans l’admin Shopify, avec repli sur « Variant » lorsqu’une valeur n’en a pas
  • Metafield — un métachamp de variante que vous associez vous-même

Les valeurs épuisées peuvent s’afficher avec une double croix, une croix simple ou un aspect désactivé, et vous décidez sur quelles surfaces les échantillons apparaissent : page de collection, page de recherche, section sélectionnée à la main, section meilleures ventes ou section produits associés.

Une configuration courante en mode : séparer par Color pour que chaque coloris ait sa carte, puis lancer un échantillon de type Button sur Size afin que chaque carte de couleur montre les tailles restantes. Le client voit la couleur, le prix de ce coloris et les tailles disponibles sans un seul clic.

Trier les variantes selon ce qui se vend vraiment

Dès lors que les variantes sont des cartes, « Best selling » au niveau produit est le mauvais signal : que la veste olive se vende mieux que l’écrue devrait se voir dans l’ordre. Smart sort classe les variantes selon leurs propres performances de vente, avec les options push out of stock down et push new items to top. Lancement manuel ou recalcul programmé toutes les 1 à 4 semaines.

Au-delà de la page de collection

La même séparation peut s’appliquer à toutes les autres grilles de produits de la boutique :

  • Collection en vedette de la page d’accueil — avec limite d’affichage et sélecteur de position
  • Page de résultats de recherche — la page de résultats, pas le menu de suggestions
  • collections/all — votre page catalogue générale
  • Sections sélection manuelle, meilleures ventes et produits associés — sous forme de blocs de thème à glisser dans n’importe quel modèle

Des règles par collection

Les réglages généraux s’appliquent partout par défaut ; Advanced settings les remplace collection par collection. Dans une collection, vous filtrez la liste des variantes par option 1/2/3, prix, stock, remise, balise produit ou jusqu’à cinq métachamps, avec des conditions comme est égal à, contient, est vide et supérieur à. Vous définissez si les variantes doivent remplir toutes les conditions ou au moins une, puis vous triez par titre, prix ou manuellement par glisser-déposer.

Ainsi « Soldes » peut n’afficher que les variantes remisées, séparées par couleur et sans les articles épuisés, tandis que vos collections éditoriales restent intactes.

Afficher les variantes sur la page de collection, thème par thème

La configuration ci-dessus est la même partout. Ce qui change selon le thème, c’est la séparation qui rend le mieux dans cette grille et la fonction du thème avec laquelle vous la combinez.

Thèmes gratuits Shopify 2.0 : Dawn · Refresh · Craft · Sense · Studio · Taste · Origin · Colorblock · Publisher · Ride · Spotlight · Crave · Trade · Rise

Collection Horizon : Horizon · Atelier · Dwell · Fabric · Heritage · Pitch · Ritual · Savor · Tinker · Vessel

Thèmes vintage Shopify 1.0 : Debut · Brooklyn · Narrative · Supply · Venture · Boundless · Minimal · Simple · Express · Jumpstart · Pop

Thèmes payants populaires : Impulse · Enterprise · Wonder · Pebble · Hyper · Be Yours · Focal · Prestige · Concept · Symmetry

Afficher les variantes sur la page de collection dans le thème Dawn

Dawn est le thème de référence de Shopify et celui par défaut des nouvelles boutiques : plus de pages de collection tournent dessus que sur n’importe quel autre. Sa grille provient de sections/main-collection-product-grid.liquid, qui parcourt les produits et rend chacun via snippets/card-product.liquid : une boucle de produits où les variantes n’apparaissent jamais. Activez l’intégration Variants on Collection, séparez par la 1st option (généralement Color) et réglez Title format sur Product title – Variant title. Deux ajustements propres à Dawn : passez le ratio d’image de la carte produit de « Adapt » à « Square » ou « Portrait » pour que les lignes restent alignées, et désactivez Show second image on hover : dans une grille séparée, il peut révéler un autre coloris et annuler l’intérêt de la séparation.

Afficher les variantes sur la page de collection dans le thème Refresh

Refresh appartient à la famille Dawn : la grille de collection est donc la même boucle de produits et la même configuration en six étapes s’applique. Séparez par la 1st option si la couleur ou le parfum structure votre gamme. Si la nomenclature des options a dérivé au fil des ans — tantôt Parfum, tantôt Flavour, tantôt Goût — laissez tomber le critère positionnel et utilisez Show selected options separately avec toutes les orthographes. Combinez avec Hide products/variants without images ; Refresh mise beaucoup sur l’image et une vignette d’espace réservé saute aux yeux.

Afficher les variantes sur la page de collection dans le thème Craft

Craft est un thème de la famille Dawn : la configuration ne change donc en rien. Les catalogues Craft grandissent le plus souvent produit par produit au fil du temps, si bien que l’ordre des options est rarement uniforme : prenez Show selected options separately et listez explicitement les noms d’options plutôt que de vous fier à « 1st option ». Si vos pièces sont uniques et comptent peu de variantes, Show all options combined est ici sans risque : le nombre de cartes reste maîtrisable et chaque finition obtient sa vignette.

Afficher les variantes sur la page de collection dans le thème Sense

Sense suit la structure de Dawn : l’intégration d’application constitue donc toute l’installation. Lorsque la teinte ou la fragrance est la première option, séparez par la 1st option pour que chaque teinte ait sa carte — précisément le cas où une seule carte produit masque l’essentiel de la gamme. Réglez Swatch source sur Theme swatch pour que les cartes séparées reprennent les valeurs de couleur déjà définies dans l’admin Shopify, et utilisez des échantillons Image pour tout ce qui a une texture qu’une couleur plate représenterait mal.

Afficher les variantes sur la page de collection dans le thème Studio

Studio est un thème de la famille Dawn à la grille façon galerie : les cartes sont grandes, une séparation profonde s’allonge donc vite. Restez sur un seul axe : séparez par la 1st option ou utilisez Show selected options separately si vous proposez la même pièce en plusieurs formats ou tailles. Réglez Price format sur From min. price quand une carte séparée couvre encore plusieurs tailles, pour qu’elle n’annonce pas un prix que le client n’obtiendra pas.

Afficher les variantes sur la page de collection dans le thème Taste

Taste appartient à la famille Dawn : la configuration est donc celle de Dawn. Si vos options sont des poids ou des conditionnements — 250 g / 500 g / 1 kg — séparez par la 2nd option pour que chaque format ait sa carte et son prix, et réglez Price format sur Min. price – Max price là où une fourchette subsiste. Ajoutez Hide out of stock pour que les formats épuisés cessent de prendre la place de ceux que vous pouvez expédier.

Afficher les variantes sur la page de collection dans le thème Origin

Origin est un thème de la famille Dawn : l’intégration d’application est donc le seul changement. Commencez par la séparation sur la 1st option et Title format: Product title – Variant title. Si un ou deux produits comptent beaucoup plus de variantes que les autres et monopolisent une ligne, activez Mix variants pour les répartir dans la grille : cela fonctionne avec les tris « Featured » et « Best selling ».

Afficher les variantes sur la page de collection dans le thème Colorblock

Colorblock est un thème de la famille Dawn bâti autour de la couleur franche, ce qui en fait le cas le plus évident de toute cette liste : si la couleur est la promesse du thème et que votre grille affiche encore une carte par produit, le thème ne fait que la moitié de son travail. Séparez par la 1st option, réglez Swatch source sur Theme swatch et donnez aux échantillons une bordure grise moyenne de 1 px pour que les valeurs blanches et pastel restent visibles sur le fond de la carte.

Afficher les variantes sur la page de collection dans le thème Publisher

Publisher est un thème de la famille Dawn aux mises en page riches en contenu : la retenue est ici payante. Utilisez Show selected options separately et nommez une seule option plutôt que d’en combiner deux : une séparation profonde entre en concurrence avec le contenu éditorial de la page. Activez Hide products/variants without images pour que chaque carte survivant à la séparation apporte sa propre photo.

Afficher les variantes sur la page de collection dans le thème Ride

Ride est un thème de la famille Dawn : même configuration, même intégration. Quand la couleur et la taille déterminent toutes deux la décision d’achat — pour l’équipement et le matériel sportif, c’est souvent le cas — Show 1st and 2nd option combined donne une carte par combinaison couleur/taille. Cela génère beaucoup de cartes : combinez donc avec Hide out of stock et envisagez Smart sort pour que les combinaisons qui se vendent vraiment passent devant.

Afficher les variantes sur la page de collection dans le thème Spotlight

Spotlight appartient à la famille Dawn et sa grille vit de l’image : la séparation doit donc être adossée à des photos de variantes. Séparez par la 1st option et activez Hide products/variants without images avant de regarder le résultat : dans une grille portée par l’image, une seule vignette d’espace réservé plombe toute la ligne. Réglez Title format sur Product title (option1) si vous voulez nommer la variante sans allonger la carte.

Afficher les variantes sur la page de collection dans le thème Crave

Crave est un thème de la famille Dawn pensé pour une navigation rapide : maîtrisez donc le nombre de cartes. Séparez par la 2nd option quand la taille ou le conditionnement guide la décision et laissez les options de type couleur à la page produit. Utilisez Price format: From min. price pour que le plus petit format ancre le prix et que la carte se lise comme un point d’entrée et non comme un plafond.

Afficher les variantes sur la page de collection dans le thème Trade

Trade est un thème de la famille Dawn destiné aux grands catalogues, et c’est précisément là que nommer explicitement les options compte le plus. Utilisez Show selected options separately et listez chaque nom d’option et chaque traduction ; sur un catalogue large, les critères positionnels laissent toujours un segment de côté. Servez-vous ensuite d’Advanced settings pour donner des règles différentes à des collections différentes plutôt que d’imposer une séparation unique à des milliers de références.

Afficher les variantes sur la page de collection dans le thème Rise

Rise est un thème gratuit de la famille Dawn : la grille de collection est donc la même boucle de produits et la même intégration fait le travail. Commencez par la séparation sur la 1st option, Title format: Product title – Variant title et Hide products/variants without images. Si la grille obtenue paraît trop longue sur mobile, revenez à Show selected options separately avec une seule option nommée plutôt qu’une séparation combinée.

Afficher les variantes sur la page de collection dans le thème Horizon

Horizon est le dernier vaisseau amiral gratuit de Shopify, bâti sur des blocs de thème imbriqués plutôt que sur des sections et des snippets. Sa liste de résultats gère à la fois la grille, l’état des filtres et la pagination, et précharge les pages voisines pour le défilement infini : c’est justement pour cela que le forker afin de séparer les variantes est une mauvaise idée. L’intégration d’application contourne tout cela. Séparez par la 1st option, réglez Swatch source sur Theme swatch pour que les cartes séparées héritent des valeurs de couleur définies dans l’admin, et utilisez soit le défilement infini propre à Horizon, soit l’Infinite scroll de l’application — pas les deux. L’aperçu rapide d’Horizon ouvrira alors le coloris cliqué par le client plutôt que la variante par défaut.

Afficher les variantes sur la page de collection dans le thème Atelier

Atelier fait partie de la collection Horizon : allure haut de gamme, images pleine largeur et mises en page éditoriales. Les grandes cartes font qu’une séparation profonde s’allonge très vite : restez sur Show 1st option separately et évitez les séparations combinées. Réglez Title format sur Product title – Variant title pour que les cartes supplémentaires paraissent voulues, et activez Hide products/variants without images : à la taille de carte d’Atelier, un espace réservé est impossible à masquer.

Afficher les variantes sur la page de collection dans le thème Dwell

Dwell est un thème de la collection Horizon aux tons doux et à l’esprit décoration : ici, c’est plutôt la finition ou la matière qui compte qu’une couleur vive. Utilisez Show selected options separately et nommez l’option explicitement — Finish, Material, Couleur — plutôt que de vous fier à sa position. Combinez avec des échantillons Image pour que des matières comme le chêne, le noyer ou le lin se montrent telles quelles et non sous forme de pastilles approximatives.

Afficher les variantes sur la page de collection dans le thème Fabric

Fabric est un thème de la collection Horizon aux grandes grilles d’images pensées pour les catalogues variés : il encaisse une séparation dense mieux que la plupart. Séparez par la 1st option et, si votre catalogue couvre réellement plusieurs structures d’options, utilisez Advanced settings pour donner à chaque collection sa propre règle plutôt qu’une séparation globale. Smart sort vaut particulièrement le coup ici, pour que les variantes qui se vendent remontent dans une grille étendue.

Afficher les variantes sur la page de collection dans le thème Heritage

Heritage est un thème de la collection Horizon destiné aux marques classiques et narratives, où une grille agitée dessert le positionnement. Gardez la séparation sur un seul axe : Show 1st option separately. Utilisez Title format: Product title (option1) pour que les cartes restent compactes et activez Hide unavailable afin que les coloris arrêtés disparaissent discrètement de la grille au lieu d’apparaître comme des impasses.

Afficher les variantes sur la page de collection dans le thème Pitch

Pitch est un thème de la collection Horizon pour les boutiques créatives et riches en contenu, où la grille côtoie souvent du matériel éditorial. Séparez de façon resserrée : Show selected options separately avec une option nommée. Utilisez le Display limit de l’application quand vous étendez la séparation à une collection en vedette de la page d’accueil, pour qu’une section conçue pour huit produits n’en rende pas soudain quarante.

Afficher les variantes sur la page de collection dans le thème Ritual

Ritual est un thème de la collection Horizon au style magazine de mode de luxe, avec de grandes cartes portées par l’image. Séparez uniquement par la 1st option : une séparation combinée démultiplie une grille déjà haute. Réglez Price format sur From min. price plutôt que sur une fourchette si un chiffre unique s’intègre mieux à la mise en page, et utilisez Hide products/variants without images pour que chaque carte apporte la photographie pour laquelle le thème est conçu.

Afficher les variantes sur la page de collection dans le thème Savor

Savor est un thème de la collection Horizon aux mises en page nettes et centrées sur le produit. Quand la taille ou le conditionnement détermine le prix, séparez par la 2nd option pour que chaque format ait sa carte et son chiffre, et réglez Price format sur Min. price – Max price pour tout ce qui couvre encore une fourchette. Ajoutez Hide out of stock pour que la grille ne montre que ce que vous pouvez expédier aujourd’hui.

Afficher les variantes sur la page de collection dans le thème Tinker

Tinker est un thème de la collection Horizon pour l’outillage, la tech et l’équipement de la maison : des catalogues pratiques où l’option décisive est plutôt la capacité, la longueur ou la matière que la couleur. Utilisez Show selected options separately et nommez ces options explicitement. Les échantillons de type Button conviennent mieux ici que les pastilles de couleur, car les valeurs ont un nom et non une apparence.

Afficher les variantes sur la page de collection dans le thème Vessel

Vessel est un thème de la collection Horizon à la carte nette et centrée sur le détail. Séparez par la 1st option et réglez Swatch source sur Theme swatch pour que les cartes séparées héritent des couleurs et images définies sur vos valeurs d’option, avec repli sur la variante là où une valeur n’en a pas. Choisissez le style d’épuisement Disabled look : sur une carte minimaliste, il fonctionne mieux qu’une croix.

Afficher les variantes sur la page de collection dans le thème Debut

Debut était le thème par défaut de Shopify avant Dawn, et beaucoup de boutiques l’utilisent encore. C’est un thème vintage 1.0 : les blocs d’application ne sont donc pas disponibles, mais selon la documentation de Shopify : « App embed blocks are supported in vintage and in Online Store 2.0 themes, because they don’t rely on sections or JSON templates. » La séparation des variantes passe par l’intégration d’application : elle fonctionne donc ici. Les catalogues Debut sont généralement assez anciens pour que la nomenclature des options ait dérivé : utilisez Show selected options separately et incluez les orthographes historiques et les traductions.

Afficher les variantes sur la page de collection dans le thème Brooklyn

Brooklyn est un thème vintage 1.0 construit autour de l’image de marque, ce qui rend les coloris cachés particulièrement coûteux : l’image est l’information produit. L’intégration d’application est prise en charge sur les thèmes vintage : la configuration ne change donc pas. Séparez par la 1st option et activez d’abord Hide products/variants without images ; les catalogues anciens ont la plus faible couverture en photos de variantes, et la séparation met chaque manque à nu d’un coup.

Afficher les variantes sur la page de collection dans le thème Narrative

Narrative est un thème vintage 1.0 pour les petits catalogues narratifs. Avec peu de produits et peu de variantes, Show all options combined est ici sans risque : le nombre de cartes reste faible et chaque variante obtient sa vignette. Comme Narrative est antérieur aux valeurs de couleur natives de Shopify, réglez Swatch source sur Variant ou associez un métachamp de variante plutôt que d’attendre quoi que ce soit de Theme swatch.

Afficher les variantes sur la page de collection dans le thème Supply

Supply est un thème vintage 1.0 pour les gros stocks avec filtrage, et c’est exactement là que la séparation paie : un filtre couleur sur une grille non séparée renvoie des produits qui, pour la plupart, montrent autre chose. Vu la profondeur du catalogue, utilisez Show selected options separately et combinez avec Hide out of stock pour que les filtres ne mènent pas à des impasses.

Afficher les variantes sur la page de collection dans le thème Venture

Venture est un thème vintage 1.0 pour les grands catalogues. Quand la couleur et la taille déterminent la décision, Show 1st and 2nd option combined donne une carte par combinaison — mais avec cette profondeur de catalogue, vérifiez le résultat sur mobile avant de publier. Utilisez Advanced settings pour n’appliquer la séparation agressive qu’aux collections qui en profitent et laissez le reste sur une règle plus légère.

Afficher les variantes sur la page de collection dans le thème Boundless

Boundless est un thème vintage 1.0 aux images plein écran et au texte minimal : les cartes sont très grandes, une séparation profonde produit donc une page interminable. Limitez-vous à Show 1st option separately et envisagez Title format: Variant title pour que le texte des cartes reste aussi sobre que le thème le prévoit. Ici, Hide products/variants without images est pratiquement obligatoire.

Afficher les variantes sur la page de collection dans le thème Minimal

Minimal est un thème vintage 1.0 à la grille nette et centrée sur le produit dans ses trois styles. Séparez par la 1st option et gardez les échantillons discrets : une forme ronde en petite taille avec une bordure fine s’accorde mieux que de grandes pastilles. Comme Minimal est antérieur aux valeurs de couleur natives, alimentez les échantillons depuis Variant ou depuis un métachamp associé.

Afficher les variantes sur la page de collection dans le thème Simple

Simple est un thème vintage 1.0 à navigation latérale et catalogues profonds. Utilisez Show selected options separately et nommez vos options plutôt que de vous fier à leur position : dans un catalogue construit sur des années, les hypothèses positionnelles cassent. Activez Hide unavailable pour que les variantes arrêtées cessent d’occuper de la place, et servez-vous des remplacements par collection pour que chaque catégorie ait sa propre règle.

Afficher les variantes sur la page de collection dans le thème Express

Express est un thème vintage 1.0 conçu pour une navigation rapide et sans friction. Séparez par la 2nd option là où la taille ou le conditionnement guide le choix, pour que le client sélectionne un article concret directement depuis la grille. Activez le add to cart button sur un plan payant afin qu’une carte séparée puisse être achetée sans détour par la page produit : c’est toute la promesse de ce thème.

Afficher les variantes sur la page de collection dans le thème Jumpstart

Jumpstart est un thème vintage 1.0 pour les très petits catalogues. Avec une poignée de produits, Show all options combined rend toute la gamme parcourable sans générer un nombre de cartes ingérable. Réglez Title format sur Product title – Variant title pour que chaque vignette soit sans ambiguïté et laissez les règles de masquage actives afin que la grille courte reste nette.

Afficher les variantes sur la page de collection dans le thème Pop

Pop est un thème vintage 1.0 au design affirmé et aux petits catalogues. Séparez par la 1st option pour que chaque couleur ait sa vignette et donnez aux échantillons une bordure visible : les fonds de carte soutenus avalent les valeurs claires. Comme sur tout thème vintage, l’intégration d’application est prise en charge ; seuls les blocs de section à glisser restent réservés à Online Store 2.0.

Afficher les variantes sur la page de collection dans le thème Impulse

Impulse est l’un des thèmes payants les plus installés de la Shopify Theme Store, proposé à 500 $ avec 94 % d’avis positifs. Il affiche déjà des échantillons sur les cartes de collection — mais un échantillon n’est pas une carte : il n’a ni emplacement propre dans la grille, ni prix propre, ni place propre dans le tri, et il n’apparaît pas lorsqu’un client filtre sur cette couleur. Séparez par la 1st option puis vérifiez le changement d’image au survol ; dans une grille séparée, la seconde image peut appartenir à un autre coloris. Comme l’application fonctionne en intégration, Impulse continue de recevoir ses mises à jour normalement.

Afficher les variantes sur la page de collection dans le thème Enterprise

Enterprise est proposé à 420 $ avec 94 % d’avis positifs et conçu pour les catalogues larges : nommer explicitement les options est ici le bon choix. Utilisez Show selected options separately et listez chaque nom d’option et chaque traduction. Faites varier la règle par collection via Advanced settings plutôt que d’imposer une séparation à tout le catalogue, et activez Smart sort pour que les variantes les plus fortes ouvrent une grande grille.

Afficher les variantes sur la page de collection dans le thème Wonder

Wonder est proposé à 390 $ avec 99 % d’avis positifs. La configuration est l’intégration habituelle : pas de fork du thème, son flux de mises à jour reste donc intact. Séparez par la 1st option, réglez Swatch source sur Theme swatch pour que les cartes séparées héritent des données de couleur déjà entretenues dans l’admin, et tranchez entre les échantillons du thème et ceux de l’application ; faire tourner les deux est pire que n’en garder qu’un.

Afficher les variantes sur la page de collection dans le thème Pebble

Pebble est proposé à 400 $ avec 98 % d’avis positifs. Séparez par la 1st option et réglez Title format sur Product title – Variant title pour que les cartes supplémentaires paraissent voulues. Si le thème embarque son propre « charger plus » ou défilement infini, choisissez-en un : soit celui du thème, soit l’Infinite scroll / Auto load more de l’application, jamais les deux.

Afficher les variantes sur la page de collection dans le thème Hyper

Hyper est proposé à 400 $ avec 99 % d’avis positifs. Quand les deux axes déterminent la décision, Show 1st and 2nd option combined donne une carte par combinaison : la séparation utile la plus fine. Associez-la à Hide out of stock et Smart sort, car une séparation combinée sans hiérarchie laisse la grille triée par rien de précis.

Afficher les variantes sur la page de collection dans le thème Be Yours

Be Yours est proposé à 350 $ avec 98 % d’avis positifs. Séparez par la 1st option et accordez le style des échantillons de l’application au design de carte existant : forme, taille, épaisseur et couleur de bordure, alignement et marges sont paramétrables, les échantillons peuvent donc paraître natifs plutôt que rapportés. Réglez le style d’épuisement sur Disabled look si le design de carte est plutôt minimaliste.

Afficher les variantes sur la page de collection dans le thème Focal

Focal est proposé à 320 $ avec 93 % d’avis positifs. Intégration habituelle, séparation par la 1st option, Product title – Variant title. Le point à surveiller ici est l’image au survol : si la seconde image appartient à un autre coloris, désactivez le changement ou réordonnez vos images de variantes pour que la photo de survol corresponde à la carte. Étendez la séparation à la page de recherche sur un plan payant afin que les grilles filtrées et recherchées se comportent de la même façon.

Afficher les variantes sur la page de collection dans le thème Prestige

Prestige est proposé à 400 $ avec 91 % d’avis positifs et adopte un ton éditorial, avec de grandes cartes et des espacements généreux. Gardez la séparation plate — uniquement Show 1st option separately — pour que la grille ne s’emballe pas. Réglez Price format sur From min. price pour un chiffre unique plus net et utilisez Hide products/variants without images pour que chaque carte apporte la photographie autour de laquelle le thème est conçu. Comme rien n’est modifié dans le thème, les mises à jour de Prestige s’installent normalement.

Afficher les variantes sur la page de collection dans le thème Concept

Concept est proposé à 400 $ avec 98 % d’avis positifs. Utilisez Show selected options separately et nommez vos options si le catalogue mélange les structures ; sinon, la séparation par la 1st option est la voie la plus rapide. Activez le add to cart button de l’application sur un plan payant et accordez sa couleur de texte et de fond au bouton existant du thème, pour que les cartes séparées conservent le design que vous avez payé.

Afficher les variantes sur la page de collection dans le thème Symmetry

Symmetry est proposé à 420 $ avec 94 % d’avis positifs et sert souvent des catalogues profonds à filtrage latéral : le scénario où la séparation a le plus d’effet, parce que les résultats filtrés correspondent enfin au filtre. Utilisez Show selected options separately pour gagner en fiabilité sur un catalogue large, ajoutez Hide out of stock pour que les filtres ne mènent jamais à des impasses, et définissez des règles par collection dans Advanced settings.

Autres thèmes payants populaires

La même configuration vaut sans changement pour Broadcast, Motion, Eurus, Release, Stiletto, Xtra, Palo Alto, Sleek, Allure, Ignite et Monk, ainsi que pour tout autre thème Shopify. Activez l’intégration, choisissez la séparation, définissez les formats de titre et de prix, puis regardez l’aperçu.

Pourquoi une seule configuration fonctionne sur tous les thèmes

Deux choses la rendent indépendante du thème.

Premièrement, elle s’installe comme intégration d’application Shopify et non comme modification du thème. La documentation de Shopify est explicite : les intégrations fonctionnent aussi bien sur les thèmes vintage que sur les thèmes Online Store 2.0, parce qu’elles ne dépendent ni des sections ni des modèles JSON. C’est pourquoi Debut et Horizon demandent la même installation.

Deuxièmement, les cartes de variantes ne sont pas génériques. L’application travaille avec un modèle par thème : une correspondance de votre conteneur de collection, de l’élément carte produit, du titre, de l’image (y compris l’image de survol ou secondaire), du prix, du prix soldé et du balisage des badges. Les cartes de variantes sont donc clonées à partir de votre carte de thème et remplies variante par variante. Votre design de carte, vos badges et votre bouton sont conservés au lieu d’être remplacés.

Dépannage

Rien n’a changé sur la page de collection

Vérifiez le statut App embed dans le tableau de bord. S’il indique « Not installed », l’enregistrement dans l’éditeur de thème n’a pas été pris en compte : rouvrez Personnaliser → Intégrations d’applications, activez Variants on Collection et cliquez sur Enregistrer.

Seuls certains produits sont séparés

Les noms d’options ne sont pas uniformes dans le catalogue. Passez à Show selected options separately et saisissez chaque orthographe et chaque traduction que vous utilisez.

La grille est pleine d’images d’espace réservé

Activez Hide products/variants without images ou affectez des images aux variantes dans l’admin Shopify.

Trop de cartes

Vous êtes probablement sur Show all options combined. Revenez à une seule option ou utilisez Show selected options separately en ne nommant que l’axe que vos clients parcourent.

J’ai changé de thème

Activez l’intégration sur le nouveau thème et cliquez sur Enable App dans Theme settings. Vos réglages sont conservés. Les mises à jour de thème ne demandent aucune action.

Je dois le désactiver tout de suite

L’interrupteur Emergency du tableau de bord désactive l’application sur la boutique instantanément et conserve tous les réglages. Utilisez-le plutôt que de désinstaller.

Questions fréquentes

Mes produits sont-ils dupliqués si j’affiche les variantes sur la page de collection ?

Non. Catalogue, variantes, stock et pages produit restent inchangés. Seul ce que la grille affiche change, et c’est pour cela que l’opération est réversible en un clic.

Est-ce que cela fonctionne sur mon thème ?

Oui. L’installation passe par une intégration d’application Shopify, prise en charge aussi bien sur les thèmes vintage 1.0 que sur Online Store 2.0 : Dawn, Horizon, Debut, Impulse, Prestige et tous les autres.

Dois-je modifier le code du thème ?

Non. Le seul changement consiste à activer une intégration d’application dans l’éditeur de thème. Aucun fichier Liquid n’est modifié.

Est-ce que cela cassera à la prochaine mise à jour du thème ?

Non. Comme aucun fichier de thème n’est modifié, les mises à jour s’installent normalement et ne demandent aucune action.

Puis-je afficher les variantes en tant que produits aussi sur la recherche et la page d’accueil ?

Oui. La page de résultats de recherche, les collections de la page d’accueil et collections/all sont des interrupteurs distincts dans les plans payants, auxquels s’ajoutent les blocs sélection manuelle, meilleures ventes et produits associés.

Des collections différentes peuvent-elles avoir des règles différentes ?

Oui. Advanced settings remplace les valeurs par défaut collection par collection, avec filtres de variantes par option, prix, stock, remise, balise ou métachamp, et tri manuel.

Combien de temps prend la configuration ?

Environ cinq minutes : activer l’intégration, allumer « Show variants separately », choisir une collection, choisir l’option de séparation, définir le format de titre et regarder l’aperçu.

Commencer maintenant

Le plan Build est gratuit et donne accès à toutes les fonctionnalités : vous pouvez donc séparer une collection réelle sur votre propre thème et juger le résultat avant de payer quoi que ce soit. Standard et Advanced débloquent toutes les collections, ainsi que le bouton d’ajout au panier, les collections de la page d’accueil, la page de recherche, collections/all et le défilement infini, tous deux avec 3 jours d’essai gratuit.

Installer Stamp — Show Variants on Collection et afficher les variantes sur vos pages de collection en environ cinq minutes.

Table of Contents

Create your account