Gestion des images et des vidéos du produit

Pour chaque produit, vous pouvez charger plusieurs images et vidéos, réorganiser leur ordre et contrôler leur utilisation. Si vous devez gérer une grande quantité d’images, il est préférable de les importer par lot, plutôt que de les charger individuellement. Pour plus d’informations, voir Importer des images de produit.

Si vous envisagez de charger des images volumineuses pour les afficher sur la page Product Details, vous pouvez envisager de définir une taille maximale en pixels (largeur et hauteur) et de redimensionner automatiquement les fichiers lors du chargement. Il existe une option pour activer le redimensionnement automatique des fichiers image plus volumineux au fur et à mesure du chargement. Pour plus d’informations, voir Redimensionnement de l’image du produit.

Mise à jour des images du produit

  1. Ouvrez le produit en mode d’édition.

  2. Pour utiliser une vue de magasin spécifique, définissez le sélecteur de Store View dans le coin supérieur gauche sur la vue applicable.

    note note
    NOTE
    Les nouvelles images du produit sont toujours chargées et visibles dans toutes les vues du magasin, même si la portée du All Store Views n’est pas utilisée pour le chargement.

    Pour masquer une image de produit d’une vue de magasin spécifique, vous devez basculer vers cette vue de magasin , cocher la case Hide from Product Page de l’image, puis cliquer sur Save.
  3. Faites défiler vers le bas et développez la section Images and Videos.

Charger une image

Pour une meilleure compatibilité, il est recommandé de charger toutes les images du produit avec le profil colorimétrique sRGB. Tous les autres profils de couleurs sont automatiquement convertis en profil de couleurs sRGB lors du chargement de l’image du produit, ce qui peut entraîner une incohérence des couleurs dans l’image chargée.

La longueur du nom du fichier image, extension incluse, ne peut pas dépasser 90 caractères.

Pour charger une image, effectuez l’une des opérations suivantes :

  • Faites glisser une image à partir du bureau et déposez-la sur la mosaïque Appareil photo ( icône Appareil photo ) de la zone de Images And Videos.

  • Dans la zone de Images And Videos, cliquez sur la mosaïque_ Appareil photo _( icône Appareil photo ), sélectionnez le fichier image sur votre ordinateur, puis cliquez sur Open.

    Chargement ou glisser-déposer {width="600" modal="regular"}

Réorganiser les images

Pour modifier l’ordre des images dans la galerie, cliquez sur l’icône Sort( Icône Trier ) au bas de la mosaïque de l’image et faites glisser l’image à un autre emplacement dans la zone de​Images And Videos.

Modifier l’ordre {width="600" modal="regular"}

Suppression d’une image

Pour supprimer une image de la galerie, cliquez sur l’icône Delete ( Icône Corbeille ) dans le coin supérieur droit de la mosaïque de l’image, puis cliquez sur Save.

Définition des détails de l’image

Cliquez sur l’image à ouvrir dans la vue détaillée et effectuez l’une des opérations suivantes :

Affichage des détails de l’image {width="600" modal="regular"}

Pour fermer la vue détaillée, cliquez sur l’icône Fermer ( icône Fermer ) dans le coin supérieur droit.

Cliquez ensuite sur Save.

Saisir le texte de remplacement

Le texte de remplacement de l’image est référencé par les lecteurs d’écran pour améliorer l’accessibilité web et par les moteurs de recherche lors de l’indexation du site. Certains navigateurs affichent le texte de remplacement lorsque le curseur de la souris survole la page. Le texte secondaire peut comporter plusieurs mots et inclure des mots clés soigneusement sélectionnés.

Dans la zone de Alt Text, saisissez une brève description de l’image.

Attribuer des rôles

Par défaut, tous les rôles sont affectés à la première image téléchargée sur le produit. Pour réaffecter un rôle à une autre image, procédez comme suit :

Dans la zone de Role, choisissez le rôle que vous souhaitez affecter à l’image.

Lorsque vous revenez à la section Images et vidéos, les rôles actuellement attribués s’affichent sous chaque image.

Rôles affectés {width="600" modal="regular"}

Masquage d’une image

Pour exclure une image de la galerie de miniatures, cochez la case Hidden et cliquez sur Save.

Images cachées {width="600" modal="regular"}

Gestion des images et des vidéos au niveau de l’affichage du magasin

Lorsque vous basculez le sélecteur de Store View vers une vue de magasin spécifique (non All Store Views), la section Images and Videos​fournit des commandes supplémentaires pour gérer l’affichage des images pour cette vue de magasin sans affecter la portée par défaut.

Réorganiser les images pour une vue de magasin

Lorsque vous travaillez dans une portée d’affichage de magasin, une case à cocher de Use Default Order s’affiche sous la zone de Images and Videos. Cochez cette case pour rétablir l’ordre d’affichage de l’image dans la séquence définie dans la portée par défaut.

Images Et Vidéos - Vue Boutique {width="600" modal="regular"}

Définition des détails de l’image pour une vue de magasin

Lorsque vous ouvrez l’affichage Détails de l’image à la portée de l’affichage du magasin, chaque champ, y compris Alt Text, les affectations de Role d’image (Base, Petit, Miniature, Échantillon) et Hide from Product Page, affiche une case à cocher Use Default Value. Cochez cette case pour hériter de la valeur configurée dans la portée par défaut de ce champ.

Affichage des détails de l’image - Affichage de la boutique {width="600" modal="regular"}

Rôles d’image

Rôle de l’image
Description
Thumbnail
Les miniatures apparaissent dans la galerie de miniatures, dans le panier et dans certains blocs tels que les articles associés. Exemple de taille : 50 x 50 pixels
Small Image
La petite image est utilisée pour les images du produit dans les listes des pages de catégories et de résultats de recherche, et pour afficher les images du produit nécessaires aux sections telles que les ventes incitatives, les ventes croisées et la liste des nouveaux produits. Exemple de taille : 470 x 470 pixels
Base Image
L’image de base est l’image principale de la page des détails du produit. Le zoom de l’image est activé si vous téléchargez une image plus grande que le conteneur d’images. Selon le niveau de zoom que vous souhaitez atteindre, l’image de base doit avoir une taille deux à trois fois supérieure à celle du conteneur. Exemples de tailles : 470 x 470 pixels (sans Zoom), 1 100 x 1 100 pixels (avec Zoom)
Swatch
Un échantillon peut être utilisé pour illustrer la couleur, le motif ou la texture. Exemple de taille : 50 x 50 pixels

Filigranes

Si vous faites les frais de la création de vos propres images de produits originaux, il n'y a pas grand-chose que vous puissiez faire pour empêcher des concurrents sans scrupules de les voler d'un simple clic de souris. Cependant, vous pouvez en faire une cible moins attrayante en plaçant un filigrane sur chaque image pour les identifier comme votre propriété. Un fichier de filigrane peut être une image JPG (JPEG), GIF ou PNG. Les types de fichiers GIF et PNG prennent en charge les calques transparents, qui peuvent être utilisés pour donner au filigrane un arrière-plan transparent.

Le filigrane utilisé pour l’image small dans l’exemple suivant est un logo noir avec un arrière-plan transparent et enregistré en tant que fichier PNG avec les paramètres suivants :

  • Taille : 50x50
  • Opacité : 5
  • Position : mosaïque

Filigrane en mosaïque {width="700" modal="regular"}

Ajout de filigranes aux images du produit

  1. Dans la barre latérale Admin, accédez à Content > Design>Configuration.

    Pour plus d’informations sur les configurations de conception, voir Configuration de conception.

  2. Recherchez la vue de magasin que vous souhaitez configurer, puis cliquez sur Edit dans la colonne Action.

  3. Sous Other Settings, développez Sélecteur d’extension la section Product Image Watermarks.

    Filigranes d’image de produit - Base {width="600" modal="regular"}

    Les paramètres d’image Base, Thumbnail, Small et Swatch Image sont identiques.

  4. Utilisez l’une des méthodes suivantes pour ajouter la ressource image de filigrane :

    • Cliquez sur Upload et sélectionnez le fichier image de votre système que vous souhaitez charger pour l’utiliser comme filigrane.
    • Cliquez sur Select from Gallery et sélectionnez une ressource image dans la ​ Galerie de médias ​.
  5. Définissez les paramètres d’affichage du filigrane :

    • Saisissez le Image Opacity en pourcentage. Par exemple : 40

    • Saisissez le Image Size en pixels. Par exemple : 200 x 200

    • Définissez Image Position pour déterminer où apparaît le filigrane.

  6. Cliquez ensuite sur Save Config.

  7. Lorsque vous êtes invité à actualiser le cache, cliquez sur Cache Management dans le message système et actualisez le cache non valide.

    Actualiser le cache {width="600" modal="regular"}

TIP
Vous pouvez cliquer sur Use Default Value Retour flèche pour restaurer la valeur par défaut.

Supprimer un filigrane

  1. Dans le coin inférieur gauche de l’image, cliquez sur l’icône Delete ( Icône Corbeille ).

    Supprimer le filigrane {width="300"}

  2. Cliquez sur Save Config.

  3. Lorsque vous êtes invité à actualiser le cache, cliquez sur Cache Management dans le message système et actualisez le cache non valide.

    Si l’image du filigrane persiste dans le storefront, revenez à la gestion du cache et cliquez sur Flush Magento Cache.

recommendation-more-help
af062d56-f22c-4537-813d-bedf8b92a071