Définissez le paramètre Source sur Collection pour charger les produits depuis une collection, ou sur Produits pour afficher une liste sélectionnée manuellement. Collection est la valeur par défaut. Lorsque Source est défini sur Collection, choisissez la collection dans le paramètre Collection ; lorsqu’il est défini sur Produits, sélectionnez jusqu’à 20 produits dans le paramètre Produits.
Liste de produits
Mis à jour le mois dernier
La section de liste de produits affiche les produits d’une collection ou d’une liste de produits sélectionnée manuellement, sous forme de curseur ou, sur ordinateur, de grille. Utilisez-la pour mettre en avant une sélection de produits choisie où que ce soit dans votre boutique.
Paramètres
Paramètre | Description |
|---|---|
Source | Choisissez de charger les produits depuis une Collection ou depuis une liste spécifique de Produits. La valeur par défaut est Collection. |
Collection | Sélectionnez la collection depuis laquelle charger les produits. S’affiche lorsque Source est défini sur Collection. Les produits s’affichent uniquement lorsque la collection contient au moins un produit. |
Produits | Sélectionnez les produits spécifiques à afficher, jusqu’à 20. S’affiche lorsque Source est défini sur Produits. |
Produits à afficher | Définit le nombre de produits à afficher, de 2 à 12 (6 par défaut). |
Utiliser une grille sur ordinateur | Affiche les produits dans une grille sur ordinateur au lieu d’un curseur. Cette option est activée par défaut. Lorsqu’elle est activée, les boutons précédent et suivant du curseur sont masqués sur ordinateur. |
Colonnes sur ordinateur | Définit le nombre de colonnes de la grille, de 1 à 6 (3 par défaut). S’affiche lorsque l’option Utiliser une grille sur ordinateur est activée. |
Espacement de la grille (ordinateur) | Définit l’espacement entre les éléments de la grille, de 0 à 34 px (8 par défaut). S’affiche lorsque l’option Utiliser une grille sur ordinateur est activée. |
Largeur des diapositives (mobile) | Définit la largeur de chaque diapositive sur mobile, de 12 à 36 rem (22 par défaut). |
Largeur des diapositives (ordinateur) | Définit la largeur de chaque diapositive sur ordinateur, de 16 à 48 rem (36 par défaut). S’affiche lorsque l’option Utiliser une grille sur ordinateur est désactivée. |
Média d’arrière-plan | Définit l’arrière-plan de la section sur Aucun, Image ou Vidéo. |
Image / Vidéo | Sélectionne l’image ou la vidéo d’arrière-plan ainsi que sa position. S’affiche selon le choix effectué pour le média d’arrière-plan. |
Superposition d’arrière-plan | Ajoute une superposition unie ou en dégradé sur l’arrière-plan, avec une couleur de superposition et, pour les dégradés, une direction. |
Largeur | Définit la largeur de la section sur Page ou Pleine largeur. |
Activer la gouttière de page | Ajoute un espacement de chaque côté d’une section pleine largeur. Activée par défaut ; s’affiche lorsque Largeur est défini sur Pleine largeur. |
Hauteur | Définit la hauteur de la section sur Auto, Petite, Moyenne, Grande, Plein écran ou Personnalisée. |
Hauteur personnalisée | Définit la hauteur de la section sous forme de pourcentage, de 0 à 100 (50 par défaut). S’affiche lorsque Hauteur est définie sur Personnalisée. |
Marges intérieures réactives | Définit séparément les marges intérieures supérieure et inférieure pour mobile et ordinateur, chacune de 0 à 34 px (16 par défaut). |
Masquer la section sur ordinateur / Masquer la section sur mobile | Masque la section sur un appareil spécifique. |
Classe personnalisée | Ajoute une ou plusieurs classes CSS, séparées par des espaces. |
Blocs
La section de liste de produits accepte les blocs de thème et d’application ainsi qu’un bloc fixe de carte produit. Le modèle prédéfini de la section construit chaque carte produit à partir de blocs comprenant du texte, un bouton, le titre du produit, l’évaluation du produit, le prix, une galerie de produits, du Liquid personnalisé et l’ajout rapide.
Si aucune source valide n’est sélectionnée — si la collection est vide ou si aucun produit n’est choisi — la section affiche à la place le même nombre d’espaces réservés de cartes produit vides.
FAQ
Comment choisir entre une collection et une liste de produits spécifique dans la section de liste de produits Pops ?
Pourquoi ma section de liste de produits Pops affiche-t-elle des cartes produit vides ?
Si aucune source valide n’est sélectionnée — si la collection est vide ou si aucun produit n’est choisi — la section affiche à la place le même nombre d’espaces réservés de cartes produit vides. Une collection n’affiche également les produits que lorsqu’elle contient au moins un produit.
Combien de produits puis-je afficher dans la section de liste de produits Pops ?
Le paramètre Produits à afficher contrôle le nombre de produits affichés, de 2 à 12, avec une valeur par défaut de 6. Lorsque Source est défini sur Produits, vous pouvez sélectionner jusqu’à 20 produits spécifiques.
Comment afficher les produits sous forme de grille sur ordinateur dans Pops ?
Activez Utiliser une grille sur ordinateur, qui l’est par défaut, pour afficher les produits dans une grille au lieu d’un curseur sur ordinateur. Lorsqu’elle est activée, les boutons précédent et suivant du curseur sont masqués sur ordinateur. Utilisez Colonnes sur ordinateur (1 à 6, 3 par défaut) et Espacement de la grille (ordinateur) (0 à 34 px, 8 par défaut) pour contrôler la mise en page.
Comment définir la largeur des diapositives sur mobile et ordinateur dans la section de liste de produits Pops ?
Utilisez Largeur des diapositives (mobile) pour définir la largeur de chaque diapositive sur mobile, de 12 à 36 rem (22 par défaut). Largeur des diapositives (ordinateur) définit la largeur des diapositives sur ordinateur, de 16 à 48 rem (36 par défaut), et s’affiche uniquement lorsque l’option Utiliser une grille sur ordinateur est désactivée.
Puis-je ajouter une image ou une vidéo d’arrière-plan à la section de liste de produits Pops ?
Oui. Définissez Média d’arrière-plan sur Image ou Vidéo (ou sur Aucun pour ne pas utiliser d’arrière-plan), puis choisissez l’image ou la vidéo et sa position dans le paramètre Image / Vidéo. Vous pouvez également ajouter une Superposition d’arrière-plan unie ou en dégradé par-dessus.