Vidéos qui tournent en boucle sur la page produit

Bonjour,

J’ai réussi à mettre les vidéos qui tournent en boucle sur ma page d’accueil (grâce à un code liquid personnalisé).

J’aimerais que ces videos tournent également quand je vais sur ma page produit (là ce ne sont que des images).

comment faire ? merci beaucoup !

Bonjour @aude20 ,

D’après vos captures d’écran, la page d’accueil et la page produit n’utilisent pas le même composant pour afficher les médias.

Les vidéos en boucle sur votre page d’accueil proviennent de votre code Liquid personnalisé, tandis que la page produit utilise toujours la galerie média par défaut de Dawn. C’est pourquoi seules les images s’affichent.

Si vous souhaitez afficher les mêmes vidéos sur la page produit, vous devrez soit les ajouter comme médias du produit dans Shopify, soit intégrer votre code Liquid personnalisé dans le fichier de la galerie média du produit (par exemple product-media-gallery.liquid ou product-media.liquid). Le code ajouté sur la page d’accueil ne s’applique malheureusement pas automatiquement aux pages produits.

Merci !

Bonjour,

Pour que les vidéos tournent aussi sur les fiches produit, il faut les ajouter comme médias du produit, et non uniquement dans la section Liquid personnalisée de la page d’accueil.

  1. Allez dans Produits → sélectionnez le produit → Médias.
  2. Ajoutez la vidéo MP4 correspondante et placez-la en première position.
  3. Dans Boutique en ligne → Personnaliser → Produits → Produit par défaut, activez Boucler les vidéos si cette option est disponible.

Shopify permet d’ajouter directement des vidéos aux médias produit.

Si la vidéo affiche encore un bouton de lecture au lieu de démarrer automatiquement, c’est le comportement différé de Dawn. Après avoir dupliqué le thème, il faudra ajuster le rendu vidéo dans le fichier qui gère les médias produit, généralement snippets/product-media.liquid, avec une configuration de ce type :

{{ media | video_tag:
  autoplay: true,
  loop: true,
  muted: true,
  controls: false,
  playsinline: true,
  preload: 'metadata'
}}

Le filtre Shopify video_tag prend en charge la lecture automatique, la boucle et le mode muet.

Il faudra répéter l’ajout pour chaque collier afin que chaque fiche affiche sa propre vidéo.

Bonne chance.

merci pour votre réponse, et si je remets un code liquid personnalisé ici (différent de l’autre) ?

Oui, vous pouvez ajouter un autre bloc Liquid personnalisé ici, indépendant de celui de la page d’accueil.

En revanche, cela fonctionnera uniquement si ce bloc remplace ou personnalise l’affichage des médias du produit. Si votre grille de produits utilise toujours les cartes produits par défaut de Dawn, l’ajout d’un simple bloc Liquid ne remplacera pas automatiquement les images par des vidéos. Dans ce cas, il faudra modifier le composant de la carte produit ou de la galerie média.

d’accord que me conseillez vous de faire du coup ?

À votre place, je commencerais par modifier le composant de la galerie produit plutôt que d’ajouter plusieurs blocs Liquid.

Si vous souhaitez que les vidéos remplacent automatiquement les images sur toutes les fiches produits, la meilleure approche est de personnaliser le modèle de la galerie média de votre thème Dawn. Ainsi, le comportement sera cohérent sur tous les produits et vous n’aurez pas à ajouter un bloc Liquid différent sur chaque page.

En revanche, si vous préférez éviter les modifications de code, vous pouvez également envisager une application Shopify qui prend en charge les galeries vidéo sur les pages produits.

Si vous trouvez cette réponse utile, vous pouvez la marquer comme solution afin d’aider d’autres marchands rencontrant le même besoin.

Merci !

Comment je procède pour personnaliser le modèle de la galerie média du thème Dawn ?

Merci d’avance

Si vous êtes à l’aise avec le code, voici la démarche générale :

Allez dans Boutique en ligne → Thèmes → … → Modifier le code.
Recherchez le fichier qui gère la galerie produit, par exemple snippets/product-media-gallery.liquid, snippets/product-media.liquid ou un fichier similaire (selon votre version de Dawn).
C’est dans ce fichier qu’il faudra adapter l’affichage pour que les vidéos soient utilisées à la place des images, ou en complément, selon le résultat souhaité.

Avant toute modification, je vous conseille de dupliquer votre thème afin d’avoir une sauvegarde.

Si vous n’êtes pas à l’aise avec Liquid, une application Shopify ou l’aide d’un développeur sera probablement la solution la plus simple.

d’accord je modife quoi exactement dans snippets/product-media.liquid ?

À ce stade, cela dépend de la version de Dawn que vous utilisez et de la façon dont votre thème gère la galerie produit. Je ne peux donc pas vous indiquer précisément quelles lignes modifier sans voir le contenu du fichier.

Si vous pouvez partager le contenu de snippets/product-media.liquid (ou simplement me préciser la version de Dawn que vous utilisez), je vous indiquerai exactement quelle partie modifier et ce qu’il faut changer. Cela permettra d’éviter de casser la galerie ou le fonctionnement des autres médias.