Personnaliser les légendes dʼimage

Personnalisez l’affichage des titres et des descriptions de vos images.

Dernière mise à jour le 10 juillet 2024

Les légendes sont des titres de texte et des descriptions qui ajoutent des informations et du contexte à vos images. Les légendes n'ont pas de réglages de style propres. Ces sont les réglages des autres textes sur votre site qui leur sont appliqués.

La façon dont vous pouvez personnaliser la légende d'une image dépend de l'endroit où elle se trouve et de la façon dont elle est configurée pour être affichée. Les légendes s'affichent généralement de l'une des trois manières suivantes :

  • Légende en-dessous - Le texte s'affiche sur la page, sous l'image.
  • Superposition de légende : le texte s'affiche sur l'image, de façon permanente ou uniquement au survol.
  • Affichage superposé de la lightbox - Lorsque la case lightbox est activée, l'image apparaît dans une fenêtre contextuelle lorsque vous cliquez dessus. Une légende s'affiche sur l'image lorsque vous la survolez.

Ce guide explique les règles de style pour toutes les images de votre site qui affichent des légendes.

Regarder une vidéo

Avant de commencer

  • Les réglages des polices et des couleurs sont distincts.
  • Nous vous recommandons de préférer les légendes courtes, en particulier si la légende superpose une image. Une légende trop longue risque dʼêtre coupée sur certains appareils et navigateurs.

Dans la version 7.0 :

  • Il n’est pas possible d’ajouter des sauts de ligne aux légendes des images, mais vous pouvez les utiliser dans les descriptions.
  • Nous utilisons le terme « corps de texte » pour faire référence à tout texte qui n’est pas un titre ou un métatexte, mais chaque template possède ses propres noms d’ajustement Par exemple, dans Adirondack, l’ajustement qui contrôle la police du corps de texte s’appelle Texte. Dans Skye, il s’appelle Corps. Pour en savoir plus, consultez l’article Personnaliser le texte.
  • Pour certains templates un seul réglage est possible qui contrôle toutes les couleurs d'en-tête ou toutes les polices d'en-tête. Dans ces cas, pour les légendes qui suivent des styles d'en-tête spécifiques (comme Titre 3) ce sera le réglage général de l'en-tête qui s'appliquera.

Si vous rencontrez des difficultés pour personnaliser des légendes sur un site 7.0, nous vous recommandons de faire des essais sur une page de test :

  1. Créez une disposition de page dans la section Non liée de votre navigation.
  2. Ajoutez un bloc Texte contenant un Titre 1, un Titre 2, un Titre 3 et du corps de texte (vous aurez besoin d'au moins quatre lignes de texte).
  3. Utilisez les Styles de site pour donner à chacun d'eux une police et une couleur distinctes.
  4. Vérifiez votre légende pour voir les différences.

Section galerie

Accéder à cette fonctionnalité

La version 7.0 ne prend pas en charge les sections Galerie. Utilisez plutôt une page Galerie.

Les images des sections Galerie prennent en charge les descriptions, qui sont affichées lorsque le bouton Légendes est activé dans lʼéditeur de section.

Dans toutes les mises en page :

  • Police : suit Paragraphes
  • Couleur : suit Paragraphe : moyen
  • Taille : non réglable
  • Alignement des légendes : non réglable

Important :

  • Les descriptions des images ne prennent pas en charge les sauts de ligne.
  • Les légendes apparaissent sous chaque image pour toutes les dispositions en grille ainsi que pour les dispositions Diaporama : Simple et Plein. Pour la disposition Diaporama : Bobine, les légendes apparaissent uniquement sous l’image centrale.
  • Les légendes n'apparaissent pas dans la vue Lightbox.

Bloc Image

Dans les sections de l’Éditeur intuitif, vous utiliserez un bloc Texte pour ajouter du texte adjacent ou superposé à un bloc Image au lieu d’ajouter une légende.

Dans l’éditeur classique, la plupart des dispositions des blocs Image prennent en charge un titre et un sous-titre avec leurs propres paramètres de style. La façon dont vous pouvez personnaliser ces légendes dépend de la version de Squarespace que votre site utilise.

Astuce

les blocs Image ajoutés aux sections créées avec l’Éditeur intuitif ne disposent pas d’options de disposition intégrées. Au lieu d’ajouter une légende à un bloc Image, utilisez un bloc Texte pour ajouter du texte adjacent à un bloc Image ou le superposer.

Pour la disposition Inline ajoutée à une section de l’éditeur classique, les légendes peuvent être affichées sous l’image ou de manière superposée, avec ou sans effet lightbox. Vous pouvez mettre en forme le texte de légende dans la barre d’outils Texte.Vous trouverez ci-dessous les règles de style pour chaque option. 

Légende en dessous

Pour les légendes qui s'affichent sous le bloc Image Inline :

  • Police : suit Paragraphes
  • Couleur : suit les ajustements Texte pour le type de texte défini sous Couleurs
  • Taille  : est définie dans la barre d'outils de texte

Légende superposée

Pour les légendes qui s'affichent sur le bloc Images Inline de façon permanente ou au survol :

  • Police : suit Paragraphes
  • Couleur : toujours blanc
  • Taille  : est définie dans la barre d'outils de texte

Superposition d'une Lightbox

Pour les légendes qui s'affichent sur le bloc Image Inline dans une fenêtre pop-up de lightbox :

  • Police : suit Polices
  • Couleur : toujours blanc
  • Taille : suit Paragraphe 3

Avec la disposition Inline, les légendes peuvent être affichées sous l’image ou de manière superposée, avec ou sans effet lightbox. Vous trouverez ci-dessous les règles de style pour chaque option.

Légende en dessous

Dans la plupart des templates, pour les légendes qui s'affichent sous le bloc Image Inline :

  • Police : suit le corps de texte
  • Couleur : suit le corps de texte
  • Taille : non réglable

Il existe des exceptions dans ces familles de templates :

Bedford

Taille : suit le corps de texte

Five

Police : toujours en noir et en majuscules

Pacific

Taille : suit le corps de texte

Skye

Police, couleur et taille : suit l’ajustement Légendes des blocs Image et Galerie

York

Taille : suit le corps de texte

Légende superposée

Dans la plupart des templates, pour les légendes qui s'affichent sur le bloc Image Inline lors de l'affichage sur la page :

  • Police : suit le corps de texte
  • Couleur : toujours gris
  • Taille : non réglable

Il existe des exceptions dans ces familles de templates :

Five

Police : toujours en majuscules

Skye

Police : suit l’ajustement Légendes des blocs Image et Galerie

Superposition d'une Lightbox

Dans la plupart des templates, pour les légendes qui s'affichent sur le bloc Image Inline dans une fenêtre pop-up de lightbox :

  • Police : suit le corps de texte
  • Couleur : toujours blanc
  • Taille : non réglable

Il existe des exceptions dans ces familles de templates :

Adirondack

Police : non réglable

Bedford

Police : non réglable

Five Taille : suit le corps de texte

Flatiron

Couleur : suit le corps de texte

Pacific

Police : non réglable

Skye

Police : suit l’ajustement Extrait
Taille : suit l’ajustement Extrait

Tremont

Police : non réglable
Couleur :
suit le corps de texte

Wexley

Taille : suit le corps de texte

Bloc Sommaire

Le bloc Sommaire prend en charge les légendes pour tous les styles (mur, liste, carrousel, grille).

La façon dont vous pouvez personnaliser la légende du bloc Sommaire dépend de la version de Squarespace sur laquelle se trouve votre site.

Dans tous les styles de bloc Sommaire :

  • Taille du titre : suit Paragraphe 2
  • Taille de la description et Taille des métadonnées : non réglables
  • Police : suit Paragraphes
  • Couleur : suit les ajustements Bloc Sommaire sous Couleurs

Dans tous les templates :

  • Taille du titre, taille de la description et taille des métadonnées : non réglables
  • Police de la description : suit le corps de texte
  • Couleur de la description : suit le corps de texte
  • Couleur du titre : varie selon le template (voir liste ci-dessous)

Dans la plupart des templates :

  • Police des métadonnées 1 et 2 : suit le corps de texte
  • Couleur des métadonnées 1 et 2 : suit le corps de texte
  • Police du titre : suit le corps de texte

Il existe des exceptions dans ces familles de templates :

Adirondack

Police du titre : suit l’ajustement Police du titre des blocs Sommaire
Couleur du titre : suit l’ajustement Couleur du titre des blocs Sommaire

Avenue

Police du titre : suit l’ajustement Police du titre des blocs Sommaire
Couleur du titre : suit l’ajustement Couleur du titre des blocs Sommaire

Aviator

Police du titre : suit l’ajustement Police du titre des blocs Sommaire
Couleur du titre : suit l’ajustement Couleur du titre des blocs Sommaire

Bedford

Police du titre : suit l’ajustement Police du titre des blocs Sommaire
Couleur du titre : suit l’ajustement Couleur du titre des blocs Sommaire
Couleurs des métadonnées 1 et 2 : suit l’ajustement Couleur des métadonnées des pages

Brine

Couleur du titre - Suit le corps de texte

Farro

Couleur du titre - Suit le corps de texte

Five

Couleur du titre : suit l’ajustement Lien dans le corps

Galerie et blog :

  • Couleur des métadonnées 1 : suit le corps de texte
  • Couleur des métadonnées 2 : suit l’ajustement Lien dans le corps

Événements :

  • Couleur des métadonnées 1 et 2 : suit le corps de texte

Produits :

  • Couleur des métadonnées 1 et 2 : suit l’ajustement Lien dans le corps

Flatiron

Couleur du titre : suit l’ajustement Couleur du lien

Forte

Couleur du titre : suit l’ajustement Couleur du lien du corps
L’ajustement Souligner : Liens dans le corps affecte les métadonnées 2

Galapagos

Couleur du titre : suit l’ajustement Couleur du lien

Ishimoto

Couleur du titre : suit l’ajustement Couleur du lien du corps

Marquee (supprimé)

Police du titre : suit l’ajustement Police du titre des blocs Sommaire
Couleur du titre : suit l’ajustement Couleur du titre des blocs Sommaire

Momentum

Police du titre : suit l’ajustement Police du titre des blocs Sommaire
Couleur du titre : suit l’ajustement Couleur du titre des blocs Sommaire

Montauk

Police du titre : suit l’ajustement Police du titre des blocs Sommaire
Couleur du titre : suit l’ajustement Couleur du titre des blocs Sommaire

Native

Police du titre : suit Titre 1
Couleur du titre : suit Titre 1

Pacific

Police du titre : suit l’ajustement Police du titre des blocs Sommaire
Couleur du titre : suit l’ajustement Couleur du titre des blocs Sommaire
Police des métadonnées 1 et 2 : suit l’ajustement Police des métadonnées
Couleur des métadonnées 1 et 2 : suit l’ajustement Couleur des métadonnées

Skye

Police du titre : suit l’ajustement Titre de la liste
Couleur du titre : suit l’ajustement Couleur du titre
Police des métadonnées 1 et 2 : suit l’ajustement Métadonnées
Couleur des métadonnées 1 et 2 : suit l’ajustement Couleur des métadonnées

Supply

Couleur du titre : suit l’ajustement Couleur du lien

Tremont

Couleur du titre : suit l’ajustement Couleur du lien du corps

Galerie et blog :

  • Police des métadonnées 1 et 2 : suit l’ajustement Police des métadonnées
  • Couleur des métadonnées 1 : suit l’ajustement Couleur des métadonnées
  • Couleur des métadonnées 2 : suit l’ajustement Couleur du lien du corps

Événements :

  • Police des métadonnées 1 et 2 : suit l’ajustement Police des métadonnées
  • Couleur des métadonnées 1 et 2 : suit l’ajustement Couleur des métadonnées

Produits

  • Police des métadonnées 1 et 2 : suit l’ajustement Police des métadonnées
  • Couleur des métadonnées 1 et 2 : suit l’ajustement Couleur du lien du corps

Wells

Couleur du titre : suit l’ajustement Couleur du lien du corps

Wexley

Couleur du titre : suit l’ajustement Couleur du lien du corps

York

Couleur du titre : suit l’ajustement Couleur du lien du corps

Galerie et blog :

  • Couleur des métadonnées 1 : suit le corps de texte
  • Couleur des métadonnées 2 : suit l’ajustement Couleur du lien du corps

Événement :

  • Couleur des métadonnées 1 et 2 : suit le corps de texte

Produits :

  • Couleur des métadonnées 1 et 2 : suit l’ajustement Couleur du lien du corps

Bloc Instagram

Le bloc Instagram prend en charge les légendes des styles Diaporama et Empilé, ainsi que dans le style Grille lors de l’affichage dans une lightbox.

La façon dont vous pouvez ajuster le texte de la légende dépend de la version de Squarespace sur laquelle se trouve votre site.

Empilé

Légendes indiquées sous chaque image :

  • Police : suit Paragraphes
  • Couleur : suit Paragraphe : moyen
  • Taille : suit Paragraphe 2

Diaporama

Les légendes des designs Diaporama s’affichent de manière superposée, tout le temps ou en cas de survol :

  • Police : suit Paragraphes
  • Couleur : toujours blanc
  • Taille : non réglable

Grille

Les légendes des designs Grille s’affichent de manière superposée avec effet lightbox :

  • Police : suit Polices
  • Couleur : toujours blanc
  • Taille : non réglable

Empilé

Les légendes des designs Empilé s’affichent sous chaque image. Dans tous les templates :

  • Police : suit le corps de texte
  • Couleur : suit le corps de texte
  • Taille : suit le corps de texte

Diaporama

Les légendes des designs Diaporama s’affichent de manière superposée, tout le temps ou en cas de survol. Dans tous les templates :

  • Police : suit le corps de texte
  • Couleur : toujours blanc
  • Taille : non réglable

Grille

Les légendes des designs Grille s’affichent de manière superposée avec effet lightbox. Dans la plupart des templates :

  • Police : suit le corps de texte
  • Couleur : toujours blanc
  • Taille : suit le corps de texte

Exceptions

La police de la légende et la taille de légende ne sont pas ajustables dans ces familles de templates :

  • Adirondack
  • Bedford
  • Pacific

Bloc Galerie en Grille

La méthode pour modifier le texte des légendes d’un bloc Galerie en grille dépend de la version de Squarespace qu’utilise votre site.

Accéder à cette fonctionnalité

Dans la version 7.1, vous pouvez ajouter des blocs Galerie uniquement aux billets de blog, aux produits et aux événements.

Les titres d’un bloc Galerie en grille peuvent s’afficher sous l’image. Les titres et les descriptions s’affichent de manière superposée avec effet lightbox.

Titre affiché en-dessous

Pour les titres qui s'affichent sous les images de bloc Galerie en Grille :

  • Police : suit Paragraphes
  • Couleur : suit Paragraphe : moyen sous Couleurs
  • Taille : non réglable

Superposition d'une Lightbox

Pour les légendes qui s'affichent sur les images des blocs Galerie en Grille dans une fenêtre pop-up de lightbox :

  • Police du titre : suit Titres
  • Couleur du titre : toujours blanc
  • Taille du titre : non réglable
  • Police de la description : suit Polices
  • Couleur de la description : toujours blanc
  • Taille de la description : non réglable

Les titres d’un bloc Galerie en grille peuvent s’afficher sous l’image. Les titres et les descriptions s’affichent de manière superposée avec effet lightbox.

Titre affiché en-dessous

Dans tous les templates, pour les titres qui s'affichent sous les images des blocs Galerie en Grille :

  • Police : suit le corps de texte
  • Couleur : suit le corps de texte
  • Taille : non réglable

Superposition d'une Lightbox

Dans la plupart des templates, pour les légendes qui s’affichent sur les images des Blocs Galerie en grille dans une fenêtre pop-up avec effet lightbox :

  • Police du titre : suit Titre 1
  • Couleur du titre : toujours blanc
  • Taille du titre : suit le corps de texte
  • Police de la description : suit le corps de texte
  • Couleur de la description : toujours blanc
  • Taille de la description : suit le corps de texte

Il existe des exceptions dans ces familles de templates :

Adirondack

Taille du titre : non réglable
Police de la description : non réglable
Taille de la description : non réglable

Bedford

Taille du titre : non réglable
Police de la description : non réglable
Taille de la description : non réglable

Five

Taille du titre : suit Titre 1

Flatiron

Couleur de la description : suit le corps de texte

Galapagos

Couleur du titre : suit Titre 1
Taille du titre
 : suit Titre 1

Remarque : activez Titres personnalisés dans le panneau Styles du site

Pacific

Couleur du titre : Suit celle du Titre 1
Taille du Titre : Suit celle du Titre 1
Police de Description : Non réglable

Skye

Police du titre : suit l’ajustement Titre de la liste
Couleur du titre : suit l’ajustement Couleur du titre sous Couleurs du texte sur tout le site
Taille du titre : non réglable
Police de la description : suit l’ajustement Extrait
Taille de la description : suit l’ajustement Extrait

Remarque : Les réglages du Titre de Liste et de la Couleur du Titre ne sont disponibles que lors de l'affichage d'une page Blog

Tremont

Police de la description : non réglable
Couleur de la description : suit le corps de texte
Taille de la description
 : non réglable

York

Couleur du titre : suit Titre 1
Taille du titre
 : suit Titre 1

Astuce

Dans certains templates, le réglage de la Couleur du Titre affecte également les titres des billets de blog. Pour garantir la visibilité, la Couleur de votre Titre doit être différente de la couleur d'arrière-plan de votre site.

Bloc Galerie en Diaporama

La façon dont vous pouvez ajuster le texte de légende du bloc de la Galerie de Diaporamas dépend de la version de Squarespace sur laquelle se trouve votre site.

Accéder à cette fonctionnalité

Dans la version 7.1, vous pouvez ajouter des blocs Galerie uniquement aux billets de blog, aux produits et aux événements.

Les légendes du bloc Galerie en diaporama peuvent uniquement s’afficher de façon superposée. Pour les légendes qui s’affichent sur le bloc Galerie en diaporama :

  • Police du titre : suit Paragraphes
  • Couleur du titre : toujours blanc
  • Taille du titre : non réglable
  • Police de la description : suit Paragraphes
  • Couleur de la description : toujours blanc
  • Taille de la description : non réglable

Les légendes du bloc Galerie de Diaporamas peuvent uniquement s'afficher de façon superposée. Dans la plupart des templates, pour les légendes qui s'affichent sur le bloc Galerie de diaporamas :

  • Police du titre : suit le corps de texte
  • Couleur du titre : toujours blanc
  • Taille du titre : non réglable
  • Police de la description : suit le corps de texte
  • Couleur de la description : toujours blanc
  • Taille de la description : non réglable

Dans la famille Skye :

  • Police du titre : suit le corps de texte
  • Police de la description : suit l’ajustement Légendes des blocs Image et Galerie

Bloc Galerie en pile

La méthode pour modifier le texte des légendes d’un bloc Galerie en pile dépend de la version de Squarespace qu’utilise votre site.

Accéder à cette fonctionnalité

Dans la version 7.1, vous pouvez ajouter des blocs Galerie uniquement aux billets de blog, aux produits et aux événements.

Les légendes d’un bloc Galerie en pile ne peuvent être affichées que sous l’image :

  • Police du titre : suit Titres
  • Couleur du titre : suit Titre (moyen)
  • Taille du titre : suit Titre 3
  • Police de la description : suit Paragraphes
  • Couleur de la description : suit Paragraphe (moyen)
  • Taille de la description : suit Paragraphe 2

Les légendes d’un bloc Galerie en pile ne peuvent être affichées que sous l’image. Dans la plupart des templates :

  • Police du titre : suit Titre 3
  • Couleur du titre : suit Titre 3
  • Taille du titre : suit Titre 3
  • Police de la description : suit le corps de texte
  • Couleur de la description : suit le corps de texte
  • Taille de la description : suit le corps de texte

Astuce

activez Titres personnalisés dans le panneau Styles du site pour personnaliser les en-têtes Galapagos.

Dans la famille Skye :

  • Couleur du titre : suit l’ajustement Titre du bloc Galerie du corps
  • Police de la description : suit l’ajustement Légendes des blocs Image et Galerie
  • Couleur de la description : suit l’ajustement Légendes des blocs Image et Galerie
  • Taille de la description : suit l’ajustement Légendes des blocs Image et Galerie

Bloc Galerie en Carrousel

Accéder à cette fonctionnalité

Dans la version 7.1, vous pouvez ajouter des blocs Galerie uniquement aux billets de blog, aux produits et aux événements.

Il n'y a pas de légendes pour les blocs Galerie de Carousel.

Page Galerie

Accéder à cette fonctionnalité

La version 7.1 ne prend pas en charge les pages Galerie. Utilisez plutôt une section galerie .

Chaque template de la version 7.0 comporte une page Galerie intégrée. De nombreux templates possèdent une page Galerie unique, tandis que d’autres utilisent la page Galerie standard, qui peut s’afficher sous forme de diaporama ou de grille.

Pages Galerie uniques

Ces familles de templates ont des pages Galerie uniques (spécifiques au template). Consultez les liens ci-dessous pour en savoir plus sur la page Galerie de chaque template. Si votre template n'est pas répertorié ici, il s'agit alors d'une page Galerie standard.

Dans la plupart des templates avec des pages de galerie standard :

Format de grille :

  • Police du titre : suit Titre 1
  • Couleur du titre : toujours blanc
  • Taille du titre : suit le corps de texte
  • Police de la description : suit le corps de texte
  • Couleur de la description : toujours blanc
  • Taille de la description : suit le corps de texte

Format du diaporama :

  • Police du titre : suit le corps de texte
  • Couleur du titre : toujours blanc
  • Taille du titre : non réglable
  • Police de la description : suit le corps de texte
  • Couleur de la description : toujours gris
  • Taille de la description : non réglable

Remarque : Les paramètres du corps du texte adaptent l'espace entre le titre et la description

Il existe des exceptions dans ces familles de templates :

Famille de templates

Format de grille

Format de diaporama

Adirondack

Police du titre : non réglable
Taille du titre : non réglable
Police de la description : non réglable
Taille de la description : non réglable

Police du titre : suit Titre 1

Remarque : s'affiche toujours en haut et centré

Bedford

Taille du titre : non réglable
Police de la description : non réglable
Taille de la description : non réglable

 

Five

Taille du titre : suit Titre 1

 

Galapagos

Couleur du titre : suit Titre 1
Taille du titre
 : suit Titre 1

Remarque : activez Titres personnalisés dans le panneau Styles du site.

 

Marquee (supprimé)

Police du titre : suit le corps de texte
Taille du titre : suit le corps de texte
Taille de la description : suit le corps de texte

 

Native

 

Remarque : s'affiche toujours en haut

Pacific

Couleur du titre : suit Titre 1
Taille du titre 
: suit Titre 1
Police de la description 
: non réglable
Taille de la description : non réglable

 

Skye

Police du titre : suit l’ajustement Titre de la liste
Couleur du titre : suit l’ajustement Couleur du titre
Taille du titre : suit l’ajustement Titre de la liste
Police de la description : suit l’ajustement Extrait
Taille de la description : suit l’ajustement Extrait

Remarque : Les réglages du Titre de Liste et de la Couleur du Titre ne sont disponibles que lors de l'affichage d'une page Blog

Police du titre : suit l’ajustement Titre de la liste
Couleur du titre : suit l’ajustement Couleur du titre
Taille du titre : suit l’ajustement Titre de la liste
Police de la description : suit l’ajustement Titre de la liste
Couleur de la description : suit l’ajustement Couleur du titre
Taille de la description : suit l’ajustement Titre de la liste

Remarque : Les réglages du Titre de Liste et de la Couleur du Titre ne sont disponibles que lors de l'affichage d'une page Blog

York

Police du titre : suit Titre 1
Couleur du titre : suit Titre 1
Taille du titre : suit Titre 1

 

Pages Projet

Accéder à cette fonctionnalité

La version 7.1 ne prend pas en charge les pages de projet. Utilisez plutôt une section galerie .

La page Projet est une disposition portfolio spécifique au template, disponible dans la famille York (Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, York). Sur les pages Projet, le titre de l’image et le texte de la description s’affichent sur la page située à côté ou au-dessous de l’image.

Utilisez les réglages dans Projet : section polices de Styles de site pour personnaliser le texte du titre et des descriptions de votre image. Vous pouvez également mettre à l'échelle les polices pour contrôler leur affichage.

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é.