Qu'est-ce qu'un élément de produit dans GemPages ?
L'espace Élément de produit est un élément essentiel, vous permettant d'ajouter n'importe quel produit de Shopify à GemPagesL'introduction de l'Éditeur v7 apporte des changements notables par rapport à la version précédente.
Vous trouverez ci-dessous des informations détaillées concernant ces mises à jour importantes.
Pour utiliser l'élément de produit:
- Ouvrez le Tableau de bord GemPages et cliquez sur la page cible pour l'ouvrir dans l'éditeur.
- Dans la barre latérale gauche, repérez le Élément de produit sous le Éléments languetteVous pouvez utiliser la barre de recherche pour trouver rapidement cet élément.
- Choisissez votre disposition de produit préférée, puis glisser-déposer Déplacez l'élément à la position souhaitée sur votre page.

Éléments enfants
L'élément Produit comprend plusieurs éléments enfants qui permettent de mettre en valeur différents attributs du produit. doit être placé à l'intérieur de l'élément pour fonctionner correctement. Les éléments enfants disponibles incluent :
- Insigne de produit
- Image du produit
- Étiquette de remise
- Titre du produit
- Description du produit
- Prix du produit
- La quantité de produit
- Variantes et échantillons de produits
- Fournisseur de produits
- Produit REF
- Remise sur les lots de produits
- Ajouter au panier
- Voir le produit Plus
- Paiement dynamique
- Téléchargement du fichier produit
Note: Les détails du produit sont extraits directement de votre boutique Shopify. Pour modifier les informations sur le produit, accédez à Administrateur Shopify > Produits, sélectionnez le produit et mettez à jour ses détails.
Configurer l'onglet Paramètres
En vertu des Normes sur l’information et les communications, les organismes doivent rendre leurs sites et applications Web accessibles. Ils y parviennent en conformant leurs sites Web au niveau AA des Web Content Accessibility Guidelines (WCAG). Paramètres Dans l'onglet, vous verrez des paramètres efficaces pour affiner l'apparence du contenu afin d'obtenir le meilleur taux de conversion possible.
Mise En Page
En vertu des Normes sur l’information et les communications, les organismes doivent rendre leurs sites et applications Web accessibles. Ils y parviennent en conformant leurs sites Web au niveau AA des Web Content Accessibility Guidelines (WCAG). Mise En Page Dans cette section, sélectionnez la mise en page que vous préférez pour l'affichage de votre produit : horizontal or vertical.
De plus, dans le panneau des paramètres étendu, vous pouvez réarranger, dupliquer, ou delete la colonne sous le Ordre des colonnes.
Sous Largeur de colonneVous pouvez modifier la largeur pour l'adapter au contenu ou modifier le rapport hauteur/largeur.

Origine du produit
Modèle de page produit
Si votre page est une page produit, vous pouvez modifier la source du produit à partir de deux options.: Affichage par produit attribué or Choisir manuellement.
- Affichage par produit attribué
Lorsque vous sélectionnez l'option d'affichage par produit attribué, le modèle actuel sera appliqué à tous les produits attribués de manière dynamique. Le produit sera sélectionné de manière aléatoire pour s'afficher sur la page de l'éditeur actuel.
Passez la souris sur la source du produit actuel et cliquez sur le bouton éditer icône pour ouvrir le Sélectionner un produit dialogue. De là, vous pouvez sélectionner d'autres produits attribués disponibles.

Note: Vous devez attribuer un produit au modèle pour vous assurer qu'il est appliqué à votre page en direct.
- Choisir manuellement
Cette option vous permet d'afficher plusieurs éléments de produit sur le même modèle et des options de variantes spécifiques.
Pour faire une sélection, cliquez sur Choisir manuellement, et une fenêtre s'ouvrira affichant une liste de produits parmi lesquels vous pourrez choisir.

Dans un autre type de page
Si votre page est d'un autre type (par exemple, page de destination, page d'accueil, etc.), il vous suffit de survoler le produit actuel et de cliquer sur le bouton correspondant. stylo icône pour modifier.
![]()
Ensuite, sélectionnez le produit que vous souhaitez cibler dans la liste des produits.

Espacement des colonnes
Réglez l'espacement entre les colonnes à l'aide du curseur ou saisissez une valeur exacte.
Valeur par défaut: 30px

Taille
- Largeur: Définissez la largeur que doit avoir l'élément produit.
- Rembourrage: Ajuster l'espacement interne (Haut, Droite, Bas, Gauche).

Présentation
Vous pouvez définir la couleur d'arrière-plan de votre élément produit : saisissez un code couleur, choisissez une couleur sur votre page ou sélectionnez-la dans un nuancier.

Forme
Personnalisez le style de l'élément produit :
- Frontière: Ajouter une bordure continue, en pointillés ou en tirets
- Rayon coinArrondir les bords (en px)
- ShadowAppliquez des ombres douces ou marquées pour améliorer la visibilité.

Option d'affichage
Cette section vous permet de contrôler le comportement des variantes et des quantités lorsque plusieurs produits sont affichés à l'aide de l'élément Produit.
Variante par défaut : Cochez cette case OUI si vous souhaitez qu'une variante spécifique soit présélectionnée lors du chargement de la page.
Note: Pour utiliser cette fonctionnalité, assurez-vous que votre source de produit est définie sur Choisir manuellement au lieu du produit attribué.
Etat: Cela définit comment variantes et Quantité sont liés entre les produits :
- Liens entre variantes, quantité pour un même produit : Les variantes partagent la même quantité et se comportent comme un seul bloc de produit unifié.
- Dissocier les variantes, la quantité entre un même produit : Chaque variante est traitée individuellement en termes de quantité, même si elles appartiennent au même produit.

Note: Modifiez la source du produit dans l'élément Produit en Choisir manuellement pour personnaliser la variante par défaut. Apprendre encore plus.
Aligner
En vertu des Normes sur l’information et les communications, les organismes doivent rendre leurs sites et applications Web accessibles. Ils y parviennent en conformant leurs sites Web au niveau AA des Web Content Accessibility Guidelines (WCAG). Aligner Dans cette section, configurez l'alignement vertical de votre élément de produit. Vous pouvez choisir parmi les options suivantes :
- Aligner en haut
- Aligner le centre
- Aligner le bas
- Répartir l'espacement vertical

Configurer l'onglet Avancé
Pour accéder à des options de style supplémentaires, rendez-vous dans l'onglet Avancé et suivez les instructions. cet article.

Merci pour vos commentaires