Comment modifier la bannière de la page d'accueil sur Shopify (2026)

Dernière mise à jour
Spécialiste consulté
5 min de lecture
Jacques Blom
Jacques Blom
CTO chez Fudge.

L’essentiel

  • Modifiez la bannière de votre page d’accueil dans l’éditeur de thème : Boutique en ligne → Thèmes → Personnaliser → Page d’accueil → cliquez sur la section bannière.
  • Vous pouvez mettre à jour l’image, le texte superposé, le texte et le lien du bouton, et le jeu de couleurs sans coder.
  • Pour les bannières diaporama, chaque diapositive est un bloc distinct - modifiez-les individuellement.
  • Les bannières vidéo et les sections animées nécessitent du code ou une application Shopify.

La bannière de votre page d’accueil est la première impression que donne votre boutique. La mettre à jour pour une nouvelle campagne, une promotion saisonnière ou pour rafraîchir l’image de votre marque est une tâche courante dans l’éditeur de thème.

Pourquoi vous pouvez nous faire confiance

Jacques a plus de 15 ans d’expérience en développement Shopify. Nous avons créé Fudge — un éditeur de boutique IA utilisé par des centaines de boutiques Shopify, avec une note de 5,0 sur l’App Store de Shopify.


Comment modifier la bannière de la page d’accueil sur Shopify

Étape 1. Accédez à l’interface d’administration Shopify → Boutique en ligne → Thèmes → Personnaliser.

Étape 2. L’éditeur de thème s’ouvre sur votre page d’accueil par défaut. S’il s’ouvre sur une autre page, utilisez le menu déroulant du sélecteur de page en haut au centre de l’éditeur pour accéder à la page d’accueil.

Étape 3. Dans la barre latérale gauche, trouvez la section de la bannière. Elle peut s’appeler Bannière d’image, Hero, Diaporama ou Image pleine largeur. Le nom exact dépend de votre thème.

Étape 4. Cliquez sur le nom de la section pour ouvrir ses paramètres.

Étape 5. Mettez à jour les éléments nécessaires :

Étape 6. Enregistrez.


Comment personnaliser la bannière de la page d’accueil

Les personnalisations les plus courantes au-delà du simple changement de l’image :

Changer la couleur du texte. Cliquez sur le bloc Titre ou Texte → cherchez un paramètre de couleur de texte, ou utilisez l’option Jeu de couleurs de la section pour passer à un jeu plus clair ou plus foncé.

Ajuster la superposition. La plupart des sections de bannière ont un curseur Opacité de la superposition. Augmentez-le pour rendre le texte plus lisible sur des images chargées ; diminuez-le pour laisser l’image apparaître plus clairement.

Changer le style du bouton. Cherchez dans les paramètres du bloc Bouton une option de style - “Principal”, “Secondaire”, “Contour”. Cela détermine s’il est plein ou avec un contour.

Changer la hauteur de la bannière. Cherchez dans les paramètres de la section (et non d’un bloc) un paramètre Hauteur de la bannière ou Hauteur de la section. Les options sont généralement “Petite”, “Moyenne”, “Grande” ou une valeur en pixels personnalisée.


Comment modifier la bannière de la page d’accueil Shopify s’il s’agit d’un diaporama ?

Si votre bannière est un diaporama (plusieurs images qui défilent), chaque diapositive est un bloc distinct dans la section.

Dans la barre latérale gauche, développez la section diaporama. Vous verrez les blocs de diapositives individuels listés en dessous. Cliquez sur chaque bloc pour modifier l’image, le texte et le bouton de cette diapositive de façon indépendante.

Pour ajouter une nouvelle diapositive : cliquez sur Ajouter un bloc en bas de la liste des blocs de la section et sélectionnez le type de bloc de diapositive.

Pour réorganiser les diapositives : faites glisser les blocs vers le haut ou le bas dans la barre latérale.


Comment ajouter une bannière vidéo à la page d’accueil Shopify

Les thèmes Shopify standards comme Dawn prennent en charge les sections vidéo de manière native. Cherchez un type de section Vidéo dans le sélecteur de section de l’éditeur de thème (cliquez sur Ajouter une section en bas de la barre latérale).

Pour une bannière vidéo d’arrière-plan pleine largeur - une vidéo jouée silencieusement derrière un texte superposé - c’est un composant plus avancé. Le thème Dawn l’inclut dans la section Bannière d’image (cherchez un onglet “Vidéo” à côté du sélecteur d’image). D’autres thèmes pourraient ne pas l’inclure.

Si votre thème ne prend pas en charge les bannières vidéo nativement, vous avez deux options :

Besoin d'une bannière de page d'accueil personnalisée ? Décrivez-la à Fudge.
Try Fudge for Free

Article connexe : Refaire la page d’accueil de votre boutique Shopify.


Bonnes pratiques pour l’image de bannière

Utilisez ces spécifications pour garder une bannière rapide et nette :

SpécificationRecommandation
Dimensions2560 x 1440px
Taille du fichierMoins de 1 Mo
FormatWebP ou JPEG
Image mobile750 x 1000px (recadrage portrait)

Vérifiez toujours l’aperçu mobile dans l’éditeur de thème avant de sauvegarder. Les images de bannière sont souvent recadrées de manière inattendue sur les petits écrans. Si votre thème dispose d’un champ séparé pour l’image mobile, utilisez-le.


Utiliser Fudge pour repenser la bannière de votre page d’accueil

Si vous souhaitez plus qu’un simple remplacement d’image - une nouvelle mise en page, l’ajout d’éléments de conversion, une structure différente - décrivez-le à Fudge :

« Refais la bannière de ma page d’accueil avec une disposition scindée : image du produit à droite, titre et deux puces à gauche, avec une couleur d’arrière-plan sur toute la largeur au lieu d’une image. »

Fudge génère le code sous forme de brouillon. Vérifiez et publiez quand le résultat vous convient.


FAQ

La bannière de ma page d’accueil doit-elle être un diaporama ou une image unique ?

Une image statique unique l’emporte généralement en matière de conversion. Les diaporamas divisent l’attention sur plusieurs messages, ralentissent le chargement initial, et la plupart des acheteurs ne voient pas au-delà de la première diapositive avant de faire défiler. N’utilisez un diaporama que si vous avez réellement plusieurs campagnes d’égale importance en cours simultanément.

Quelle hauteur de bannière convertit le mieux sur Shopify ?

Une bannière moyenne (environ 60 à 80 % de la hauteur de l’écran) l’emporte généralement sur une bannière qui occupe tout l’écran. Les bannières en plein écran masquent le reste de votre contenu sous la ligne de flottaison, ce qui nuit à la profondeur de défilement et à la découverte des produits. Testez les formats moyen contre petit pour votre catégorie — les vêtements performent souvent mieux avec des bannières plus grandes ; les produits de type SaaS performent mieux avec des plus petites.

Puis-je programmer l’affichage d’une bannière de page d’accueil à une date précise ?

Pas de manière native dans l’éditeur de thème. L’approche la plus propre : décrivez la date de lancement à Fudge et il génère un code Liquid conditionnel basé sur la date qui active la bannière à l’heure prévue — aucun basculement manuel n’est requis le jour du lancement. Alternative : une application de planification Shopify qui contrôle la visibilité des sections par date, ou dupliquez le thème pour le publier manuellement.

Pourquoi le bouton de la bannière de ma page d’accueil est-il coupé sur mobile ?

La hauteur de la bannière n’est pas suffisante pour accueillir le titre + le sous-titre + le bouton. Vous pouvez soit réduire la longueur du texte, soit passer à une hauteur de bannière « Petite » sur mobile (certains thèmes ont des paramètres de hauteur séparés bureau/mobile), soit déplacer le bouton sous la bannière en utilisant une section distincte.

Les vidéos de la bannière de page d’accueil doivent-elles se lancer automatiquement ?

Oui, avec quelques réserves. Les navigateurs exigent que les vidéos soient mises en sourdine pour la lecture automatique — concevez la vidéo pour un visionnage sans le son. Utilisez la vidéo uniquement pour une toile de fond d’ambiance où le message se trouve dans le texte superposé, et non dans l’audio. La lecture automatique de vidéos longues avec le son est bloquée par les navigateurs et échouerait à charger de toute façon.

Jacques's signature
Mettez à jour la bannière de votre page d'accueil — simplement en décrivant ce que vous voulez.

Connexe : Fudge Store Editor.

Connexe : Accélérer un thème Shopify.

Connexe : Ajouter un bouton sur Shopify.

Connexe : Remplacer les images d’arrière-plan Hero sur Shopify.

You might also be interested in

Comment ajouter une vidéo à une galerie de produits Shopify (2026)
Découvrez comment ajouter des vidéos à la galerie de votre produit Shopify. Téléversez des fichiers MP4 ou intégrez des URL YouTube et Vimeo (formats, tailles...).
Comment réorganiser les images de produits sur Shopify (2026)
Comment réorganiser les images de produits sur Shopify en les faisant glisser dans l'admin. Couvre la sélection de l'image principale, la réorganisation en masse via CSV et les images de variantes.
Comment ajouter une image au survol sur vos cartes produits Shopify (2026)
Affichez une deuxième image de produit au survol de vos cartes produits sur Shopify. Découvrez les paramètres des thèmes natifs, les thèmes compatibles et les solutions via le code.