Dans Shopify, vous pouvez ajouter des images à vos variantes de produits pour permettre à vos clients de voir à quoi ressemble chaque variante d'un produit. Cependant, étant réglementé par Shopify, vous ne pouvez associer qu'une seule image à une seule variante. La question est donc de savoir comment associer plusieurs images à une seule variante ?
Il existe une réponse dans Be Yours, dans laquelle vous pouvez spécifier certaines images pour une variante d'option . Cette fonction est particulièrement adaptée à l’option de couleur, mais vous pouvez l’utiliser à d’autres fins.
Sur cette page
- Exigences
- Choisis une option
- Modifier la balise ALT des images
- Définir (ou conserver) mon propre texte alternatif
Exigences
- Be Yours 4.0.0 ou version ultérieure
Vous devez désactiver l'option qui masque les médias des autres variantes après avoir sélectionné une variante . Cette option est compatible avec le comportement natif de Shopify : associer une seule image à une variante.
Dans Be Yours, cette option est disponible dans les sections suivantes :
- Section produits en vedette
- Section d'informations sur le produit (sur les pages produits)
- Section d'informations sur le produit (sur le modal du produit)
Choisissez une option que vous souhaitez
Regardez votre produit dans votre interface administrateur et choisissez une option pour laquelle vous souhaitez classer vos images. Dans l'exemple ci-dessous, j'ai décidé de choisir Color . Mon produit est disponible dans les couleurs Noir , Vert et Rose et je souhaite afficher les images respectives uniquement lorsqu'un utilisateur sélectionne une variante.
Modifier la balise ALT des images
Vous devez modifier la balise alt pour spécifier la variante à laquelle appartient l'image :
- Passez la souris sur l'image et cliquez sur le bouton à six points pour ouvrir les informations de l'image
- Cliquez sur Ajouter un texte alternatif
- Utilisez le nom de votre option que vous choisissez en combinant avec le nom de la variante . La syntaxe est ici très importante et doit être dans l'ordre suivant :
#
(caractère hashtag)
option name
(minuscule)
_
(caractère de soulignement)
variant-name
(minuscule, remplacer tous les espaces par des tirets)#color_black
- Cliquez sur Enregistrer le texte alternatif pour enregistrer les modifications
- Faites le même processus pour les autres images
Définir (ou conserver) mon propre texte alternatif
Que faire si je souhaite définir (ou conserver) mon propre alt utilisé à des fins de référencement ? Ajoutez simplement quelque chose dans le champ alt avant le caractère # , comme ceci :
Nous savons que la plupart des clients se soucient du référencement et vous pourrez améliorer votre efficacité en ajoutant des balises alt à toutes les images conformément aux instructions ci-dessus.
SEO : Image Optimizer Page Speed d'AVADA est une application hautement recommandée pour le référencement d'images afin de vous aider à surpasser vos concurrents dans les résultats de recherche. Cette application exploite facilement votre référencement grâce à l'automatisation en :
- Optimisation de l'image ALT/balises méta/JSON-LD pour être compatible avec la recherche Google.
- Optimiser la taille des images sans perte de qualité pour accélérer votre site Web.
>> Apprenez-en plus sur le référencement : Image Optimizer Page Speed dès aujourd'hui !