Ajouter des images mises en avant

Commercialisez les billets de blog, les événements ou les produits inclus sur votre site avec une image convaincante.

Dernière mise à jour le 11 octobre 2024

Squarespace utilise des images mises en avant pour représenter des éléments de collection individuels, tels que des billet de blog, des événements et des produits, dans différentes zones de votre site. Par exemple, vous pouvez utiliser un bloc Sommaire pour afficher les publications de votre page Blog, avec lʼimage mise en avant de chaque article incluse. 

Si votre site utilise la version 7.0, vous pouvez également ajouter des images mises en avant de page qui apparaîtront sur les pages Index et créer des images de bannière par page dans certains templates.

Nous vous recommandons de toujours ajouter des images mises en avant lorsque lʼoption est disponible afin de créer une expérience visuelle exceptionnelle sur votre site. Pour obtenir de lʼaide sur le formatage des images avant de les charger, consultez lʼarticle Formater vos images pour lʼaffichage sur Internet.

Astuce

lorsque vous partagez un lien depuis votre site sur les réseaux sociaux, votre image de partage social peut sʼafficher à la place de lʼélément ou de lʼimage mise en avant de la page. Pour en savoir plus sur ce qui sʼaffiche, consultez Comment le contenu est affiché dans les publications sur les réseaux sociaux.

Images mises en avant d’un élément de collection

Les images mises en avant des éléments de collection représentent des billets de blog, des événements et des produits individuels sur votre site. Ils peuvent également sʼafficher lorsque les éléments sont partagés sur les réseaux sociaux.

Sur la version 7.0, certains templates utilisent des images mises en avant dʼéléments de collection pour créer une image de bannière.

La méthode pour ajouter une image mise en avant dʼélément de collection dépend de la version de Squarespace quʼutilise votre site.

Pour ajouter une image de sous-page de billet de blog, d’un événement ou d’un portfolio :

  1. Ouvrez le panneau Pages.
  2. Dans le panneau Pages, cliquez sur une page de blog, d’événements ou de portfolio. Si vous n’avez pas ajouté d’image mise en avant à une publication, un événement ou une sous-page, vous verrez apparaître une icône d’image au lieu de celle-ci.
  3. Survolez l'élément (par exemple, un billet de blog) et cliquez sur ..., puis sur Paramètres.
  4. Dans l’onglet Contenu ou Général, faites glisser votre image dans l’outil de chargement d’images ou cliquez sur l’outil de chargement d’images pour choisir un fichier enregistré sur votre ordinateur. Si lʼélément possède déjà une image, cliquez sur Supprimer lʼimage, puis ajoutez une nouvelle image.
  5. Pour réutiliser une image ou utiliser une image d’archive, cliquez sur Rechercher des images (billets de blog et événements uniquement).
  6. Cliquez sur Enregistrer.

Par défaut, la première image qui s’affiche dans l’éditeur de produit devient l’image mise en avant. Pour modifier l’image mise en avant de votre produit :

  1. Ouvrez le panneau Pages.
  2. Dans le panneau Pages, cliquez sur une page Boutique.
  3. Double-cliquez sur un produit.
  4. Dans l’éditeur de produit, faites défiler la page jusqu’à la section Images, puis cliquez sur Image mise en avant.
  5. Chargez une image ou sélectionnez-en une dans votre bibliothèque d’images.
  6. Si le produit possède déjà une image mise en avant, cliquez sur les trois points à droite de l’image, puis sur Supprimer. Chargez ensuite une nouvelle image.
  7. Cliquez sur Enregistrer.

Pour ajouter une image mise en avant personnalisée à une vidéo chargée sur une page Vidéos, procédez comme suit :

  1. Ouvrez le panneau Pages et cliquez sur une page Vidéos.
  2. Dans le panneau latéral, cliquez sur Tout.
  3. Survolez la vidéo à laquelle vous souhaitez ajouter une image mise en avant personnalisée, cliquez sur , puis sur Modifier la vidéo.
  4. Dans l’éditeur de vidéo, activez l’option Image mise en avant personnalisée. Veuillez noter que cette option n’est disponible que pour les vidéos chargées directement sur Squarespace. Il n’est pas possible d’ajouter une image mise en avant personnalisée à des vidéos intégrées.
  5. Cliquez sur Ajouter une image, puis chargez une image ou sélectionnez-en une dans votre bibliothèque d’images. Si l’élément possède déjà une image, cliquez sur Remplacer, puis ajoutez une nouvelle image.
  6. Cliquez sur Enregistrer.

Pour ajouter un billet de blog ou l’image mise en avant d’un événement :

  1. Ouvrez le panneau Pages.
  2. Dans le panneau Pages, cliquez sur une page Blog ou Événements
  3. Ouvrez les paramètres de l’élément et cliquez sur Options.
  4. Faites glisser votre image dans l’outil de chargement d’images ou cliquez sur l’outil de chargement d’images pour choisir un fichier enregistré sur votre ordinateur. Si lʼélément possède déjà une image, cliquez sur Supprimer lʼimage ou sur lʼicône de corbeille, puis ajoutez une nouvelle image.
  5. Pour réutiliser une image ou utiliser une image d’archive, cliquez sur Rechercher une image.
  6. Cliquez sur Enregistrer.

Par défaut, la première image qui s’affiche dans l’éditeur de produit devient l’image mise en avant. Pour modifier l’image mise en avant de votre produit :

  1. Ouvrez le panneau Pages.
  2. Dans le panneau Pages, cliquez sur une page Boutique.
  3. Double-cliquez sur un produit.
  4. Dans l’éditeur de produit, faites défiler la page jusqu’à la section Images, puis cliquez sur Image mise en avant.
  5. Chargez une image ou sélectionnez-en une dans votre bibliothèque d’images.
  6. Si le produit possède déjà une image mise en avant, cliquez sur les trois points à droite de l’image, puis sur Supprimer. Chargez ensuite une nouvelle image.
  7. Cliquez sur Enregistrer.

Astuce

utilisez lʼéditeur dʼimages pour personnaliser ou recadrer l’image mise en avant après le téléchargement. Vous pouvez également utiliser des points focaux pour centrer lʼimage dans ses dimensions de hauteur.

Accéder à cette fonctionnalité

L’application Squarespace prend uniquement en charge l’ajout d’images mises en avant d’éléments de collection aux billets de blog. Pour ajouter des images mises en avant d’événements ou de produits, utilisez un ordinateur.

Pour ajouter une image mise en avant d’un élément de collection sur un site utilisant la version 7.1 :

  1. Appuyez sur Plus, sur Pages, sur le blog, puis sur Contenu du blog.
  2. Appuyez sur ... à côté de la publication, puis sur Paramètreset enfin sur Contenu.
  3. Si l’élément possède déjà une image, cliquez sur Supprimer l’image, puis sur Ajouter une image
  4. Choisissez une image :
    • Prendre une nouvelle photo : appuyez sur Prendre une photo ou sur Appareil Photo.
    • Choisir une image stockée sur votre appareil : appuyez sur Photothèque ou sur Fichiers.
    • Choisir une image stockée sur iCloud - Appuyez sur Insérer à partir de....
  5. Appuyez sur Retour, puis sur Enregistrer.

Pour ajouter une image mise en avant d’un élément de collection sur un site utilisant la version 7.0 :

  1. Appuyez sur Plus, puis sur Pages
  2. Appuyez sur le blog, puis sur le billet de blog. 
  3. Appuyez sur …, puis sur Paramètres de la page.
  4. Dans les paramètres de la publication, appuyez sur Ajouter une image, puis choisissez une image :
    • Prendre une nouvelle photo : appuyez sur Prendre une photo ou sur Appareil Photo.
    • Choisir une image stockée sur votre appareil : appuyez sur Photothèque ou sur Fichiers.
    • Choisir une image stockée sur iCloud - Appuyez sur Insérer à partir de....
  5. Appuyez sur Enregistrer

Images mises en avant de page (version 7.0)

Accéder à cette fonctionnalité

La version 7.1 n’utilise pas les images mises en avant sur la page. Pour créer une image de bannière, ajoutez plutôt une image d’arrière-plan de section à une section de page. Pour représenter la page sur les réseaux sociaux, ajoutez une autre image de partage social.

Les images mises en avant de page apparaissent sur les pages Index et créent des images de bannière par page dans certains templates. Certains templates prennent également en charge lʼajout de vidéos.

Pour ajouter une image mise en avant de page :

  1. Ouvrez le panneau Pages.
  2. Survolez la page dans le panneau de gauche et cliquez pour ouvrir les paramètres de la page.
  3. Dans les paramètres de la page, cliquez sur l’onglet Médias.
  4. Faites glisser une image dans la zone Image mise en avant ou cliquez sur Ajouter une image. Si lʼélément possède déjà une image, cliquez sur Supprimer lʼimage ou sur lʼicône de corbeille, puis ajoutez une nouvelle image. Vous pouvez également cliquer sur Rechercher des images pour réutiliser une image ou ajouter une image d’archive.
  5. Cliquez sur Enregistrer.

Astuce

utilisez lʼéditeur dʼimages pour personnaliser ou recadrer l’image mise en avant après le téléchargement. Vous pouvez également utiliser des points focaux pour centrer lʼimage dans ses dimensions de hauteur.

Pour ajouter une image mise en avant de page :

  1. Appuyez sur Plus, puis sur Pages.
  2. Appuyez sur ... ou en haut de lʼécran, puis appuyez sur Paramètres de page.
  3. Sous Options, appuyez sur Médias.
  4. Appuyez sur Ajouter une image sous Image mise en avant. Si lʼélément possède déjà une image, cliquez sur Remplacer, puis ajoutez une nouvelle image.
  5. Choisissez une image :
    • Prendre une nouvelle photo - Appuyez sur Prendre une photo ou sur Appareil Photo.
    • Choisir une image stockée sur votre appareil - Appuyez sur Photothèque ou sur Fichiers.
    • Choisir une image stockée sur iCloud - Appuyez sur Insérer à partir de....
  6. Appuyez sur Paramètres de page, puis sur Enregistrer.

Dans la plupart des templates, une image mise en avant est automatiquement créée avec la première image de la galerie si la page Galerie n’en possède pas. Suivez les étapes ci-dessus pour remplacer cette image par une autre, ou supprimez-la complètement.

Dans certains templates, si vous supprimez lʼimage mise en avant de page, la première image de la galerie est automatiquement utilisée comme image mise en avant lorsque vous effectuez un changement dans la galerie. Ce fonctionnement est particulièrement visible pour les templates dans lesquels l’image mise en avant crée une bannière de page.

Dans ces cas-là, vous pouvez supprimer la nouvelle image mise en avant après chaque modification en accédant aux paramètres de la page. Si vous ajoutez manuellement une image mise en avant dans les paramètres de la page, cette dernière n’est pas automatiquement mise à jour lorsque vous apportez des modifications à la galerie. Pour créer un effet sans bannière, chargez une image mise en avant de couleur unie, identique à votre arrière-plan.

Comment s’affichent les images mises en avant

Les images mises en avant s’affichent différemment en fonction la version de votre site et de l’endroit où l’image apparaît. 

Consultez ce tableau pour en savoir plus sur lʼaffichage des images mises en avant en fonction des zones de votre site. 

Zone du site

Affichage des images mises en avant

Pages Blog, Événements, Boutique et Vidéos

Les images mises en avant dʼélément sʼaffichent sur la page principale de la collection pour représenter chaque élément. Par exemple, les pages Événements affichent lʼimage mise en avant de chaque événement à venir.

Blocs Produit

Les images mises en avant sʼaffichent lorsque lʼoption Afficher lʼimage est cochée.

Blocs Sommaire

Les images mises en avant sʼaffichent pour les éléments de collection présentés dans le bloc. Choisissez entre plusieurs dispositions différentes.

Consultez ce tableau pour en savoir plus sur lʼaffichage des images mises en avant en fonction des zones de votre site.  

Zone du site

Affichage des images mises en avant

Bannières

Les images mises en avant sʼaffichent sous forme de bannières de page et dʼéléments de collection dans certains templates.

Pages Index

Selon le template de votre site, les images mises en avant sʼaffichent sous forme de grille, empilées ou en plein écran.

Pages Blog, Événements et Boutique avancées

Les images mises en avant des éléments de collection sʼaffichent sur la page principale de la collection pour représenter chaque élément. Par exemple, les pages Événements affichent lʼimage mise en avant de chaque événement à venir.

Blocs Produit

Les images mises en avant sʼaffichent lorsque lʼoption Afficher lʼimage est cochée.

Blocs Sommaire

Les images mises en avant sʼaffichent pour les éléments de collection présentés dans le bloc. Choisissez entre plusieurs dispositions différentes.

Blocs Liens internes

Les images mises en avant s’affichent pour les pages ou les éléments vers lesquels vous créez un lien.

Footer Image
  • Obtenir de l’aide de notre communauté

  • Obtenez de l’aide sur les personnalisations avancées auprès de notre communauté.

  • Trouver un Squarespace Expert

  • Démarquez-vous en ligne avec l’aide d’un designer ou d’un développeur expérimenté.