À retenir
- Shopify permet d’uploader des GIF dans les médias produits, le contenu des pages et les blocs d’image de l’éditeur de thème.
- Les GIF se lancent en autoplay partout où ils sont intégrés.
- Compressez vos GIF avant de les uploader : un GIF non compressé peut être très lourd. Utilisez ezgif.com.
- Pour les sections hero et les grands affichages, une vidéo MP4 est généralement le meilleur choix pour les performances.
Pour ajouter un GIF sur Shopify, uploadez-le comme n’importe quelle image : dans la section Médias d’un produit, avec le bouton Insérer une image de l’éditeur de page, ou dans un bloc image de l’éditeur de thème. Essayez de ne pas dépasser les 2 Mo.
Pourquoi vous pouvez nous faire confiance
Nous avons créé et personnalisé des centaines de boutiques Shopify. Nous avons aussi créé Fudge, l’opérateur IA pour les boutiques Shopify, qui a une note de 4.9 sur le Shopify App Store.
Comment ajouter un GIF sur une page produit
Étape 1. Allez dans Produits > sélectionnez votre produit > scrollez jusqu’à la section Médias.
Étape 2. Cliquez sur Ajouter un média et uploadez votre fichier GIF.
Étape 3. Le GIF apparaît dans la galerie du produit à côté de vos images statiques. Quand les clients cliquent dessus, il se lance dans la lightbox en taille réelle.
Étape 4. Glissez-déposez pour réorganiser si besoin. Enregistrez.
Le GIF se lancera en autoplay dans la miniature de la galerie et en plein écran. Il n’y a pas de bouton lecture ou pause : il tourne en boucle en continu.
Les gros GIF ralentissent les pages. Pour d’autres astuces d’optimisation, consultez Accélérer un thème Shopify.
Comment ajouter un GIF sur une page ou un article de blog Shopify
Étape 1. Allez dans Boutique en ligne > Pages (ou Articles de blog) et ouvrez la page que vous souhaitez éditer.
Étape 2. Dans l’éditeur de texte enrichi, cliquez sur le bouton Insérer une image (l’icône photo dans la barre d’outils).
Étape 3. Téléchargez votre GIF ou sélectionnez-le dans la bibliothèque de fichiers.
Étape 4. Le GIF s’insère directement dans le texte et se lancera automatiquement au chargement de la page.
Comment ajouter un GIF via l’éditeur de thème
Dans l’éditeur de thème, partout où vous voyez un bloc ou une section Image, vous pouvez uploader un GIF exactement comme une image statique.
Étape 1. Allez dans Boutique en ligne > Thèmes > Personnaliser.
Étape 2. Cliquez sur la section ou le bloc où vous voulez mettre le GIF.
Étape 3. Dans le sélecteur d’image, uploadez votre GIF ou choisissez-le parmi vos fichiers.
Étape 4. Enregistrez.
Le GIF se lancera en autoplay à cet endroit sur la boutique.
Pour d’autres types d’animations, consultez Ajouter du contenu animé sur Shopify.
Poids du fichier GIF - pourquoi c’est important
Les GIF sont réputés pour être des fichiers très lourds. Une animation de 5 secondes à 800px de large peut facilement dépasser 10 Mo si elle n’est pas compressée. Des GIF trop lourds entraînent :
- Des temps de chargement de page lents
- De mauvais scores Core Web Vitals
- Une forte consommation de données mobiles pour vos clients
Compressez toujours vos GIF avant de les télécharger. Utilisez ezgif.com - c’est gratuit, sans inscription, et vous permet de réduire les couleurs, recadrer et couper des frames pour réduire considérablement le poids du fichier. Visez moins de 2 Mo pour tout GIF utilisé dans une galerie de produits ou le contenu d’une page, et moins de 500 Ko pour des petits GIF intégrés au texte.
GIF vs MP4 pour le contenu animé
Pour les grandes zones animées (backgrounds de hero, animations de bannière pleine largeur, démos produits de plus de 3 secondes), la vidéo MP4 est presque toujours le meilleur choix.
Un clip vidéo de 5 secondes qui tourne en boucle au format MP4 est généralement 80 à 90 % plus léger que le GIF équivalent, charge plus vite et offre une image plus nette. Le MP4 gère aussi le son et tourne de manière plus fluide sur mobile.
Utilisez des GIF quand :
- Vous avez besoin d’une petite icône ou d’un badge animé simple
- Vous ajoutez une animation dans une zone de texte enrichi (pas d’option vidéo)
- L’animation est assez simple pour que la compression GIF fonctionne bien (peu de couleurs, mouvements limités)
Utilisez le MP4 quand :
- L’animation dure plus de 2-3 secondes
- Vous en avez besoin dans une section hero, une bannière ou une section pleine largeur
- Le poids du fichier ou la vitesse de chargement est un enjeu
Pour utiliser un MP4 dans la galerie produit à la place, consultez Ajouter une vidéo à une galerie produit Shopify.
Héberger des GIF en externe
Le stockage de fichiers de Shopify est généreux mais pas illimité. Si vous utilisez beaucoup de GIF, vous pouvez les héberger en externe (par ex. sur Giphy, Cloudinary ou votre propre CDN) et les intégrer via leur URL.
Dans les blocs d’image de l’éditeur de thème, cela nécessite généralement du code pour intégrer une image basée sur une URL plutôt que d’utiliser le sélecteur de fichiers standard. Décrivez ce besoin à l’éditeur de boutique de Fudge si nécessaire ; la modification arrive sous forme de brouillon que vous pouvez prévisualiser avant de publier.
FAQ
Quelle est la taille maximale d'un fichier GIF sur Shopify ?
La limite générale de Shopify pour les images est de 20 Mo par fichier, et les GIF suivent la même règle. En pratique, la limite est bien plus basse : tout ce qui dépasse 5 Mo va visiblement ralentir le chargement de la page. Visez moins de 2 Mo pour les GIF de la galerie produit, et moins de 500 Ko pour les petits GIF intégrés dans le texte.
Pourquoi mon GIF Shopify ne s'anime-t-il pas ?
C'est presque toujours un problème de format de fichier ou de thème : (1) le fichier a été uploadé comme un GIF à une seule frame (sans véritable animation), (2) le processeur d'images de Shopify l'a aplati (uploadez-le via la section Fichiers plutôt que l'éditeur de texte enrichi et utilisez l'URL), ou (3) le lazy-loading de votre thème bloque le GIF.
Puis-je ajouter un GIF à l'image d'une variante de produit Shopify ?
Oui. Dans la section Médias de l'éditeur de produit, uploadez le GIF, puis dans la section Variantes, cliquez sur une variante et assignez-lui le GIF comme média. Le GIF s'affichera quand les clients sélectionneront cette variante.
Les GIF vont-ils nuire à mon SEO sur Shopify ?
Indirectement. Les gros GIF non optimisés dégradent la vitesse de la page et les Core Web Vitals, ce qui impacte le classement. Les GIF compressés et bien dimensionnés ont un impact SEO négligeable. Un GIF de 10 Mo dans votre section hero est un tueur de score Lighthouse ; un petit GIF de 200 Ko dans le texte, c'est parfait.
Un GIF ou une vidéo, quel est le mieux pour une démo produit sur Shopify ?
La vidéo. Une démo produit de 5 secondes en MP4 est généralement 80 à 90 % plus légère que le même contenu en GIF, l'image est plus nette, et Shopify la gère nativement dans les galeries produits. Gardez les GIF pour les animations courtes et simples ou les zones de contenu où vous ne pouvez pas ajouter de vidéo. Pour placer un MP4 en boucle en dehors de la galerie produit (par ex. dans une section personnalisée), décrivez ce que vous voulez à Fudge et il construira la section avec les attributs autoplay + muted + loop.