> ## Documentation Index
> Fetch the complete documentation index at: https://www.mintlify.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Configurations

> Modifiez identité de marque, apparence, navigation et paramètres du site depuis le panneau Configurations de l'éditeur web Mintlify, en temps réel.

Configurez l'identité de marque, l'apparence et les fonctionnalités de votre site depuis le panneau **Site configurations** de l'éditeur web. Les modifications de configuration se synchronisent en temps réel avec les autres éditeurs sur la même branche, afin que votre équipe voie toujours les derniers paramètres.

Pour ouvrir le panneau, cliquez sur l'icône de configurations <Icon icon="sliders-horizontal" /> dans la barre d'outils de l'éditeur.

<Frame>
  <img src="https://mintcdn.com/mintlify/yLHAwTnwTq05X1uS/images/editor/configurations-light.png?fit=max&auto=format&n=yLHAwTnwTq05X1uS&q=85&s=8d3d37dc337b15b533426bb4b9c24445" alt="Menu Configurations dans l'éditeur." className="block dark:hidden" width="2620" height="1350" data-path="images/editor/configurations-light.png" />

  <img src="https://mintcdn.com/mintlify/yLHAwTnwTq05X1uS/images/editor/configurations-dark.png?fit=max&auto=format&n=yLHAwTnwTq05X1uS&q=85&s=01aba3d30c86ab77a959a7672098b905" alt="Menu Configurations dans l'éditeur." className="hidden dark:block" width="2620" height="1350" data-path="images/editor/configurations-dark.png" />
</Frame>

Le panneau regroupe les paramètres en sections qui correspondent aux propriétés de premier niveau de votre [`docs.json`](/fr/organize/settings).

<div id="general">
  ## Général
</div>

Définissez l'identité de votre site et la façon dont il apparaît aux visiteurs.

* **Name** : Le nom de votre projet. Apparaît dans les onglets du navigateur et les résultats de recherche.
* **Description** : Brève présentation de votre projet. Utilisée pour le SEO et l'AEO.

<div id="branding">
  ## Branding
</div>

Téléversez les éléments qui identifient votre site.

* **Logo** : Le logo de votre marque. Téléversez des fichiers PNG ou JPG. Définissez des versions distinctes pour les modes clair et sombre, ainsi qu'une URL de redirection facultative. Pour utiliser un logo SVG, ajoutez le fichier à votre référentiel et référencez son chemin dans votre [`docs.json`](/fr/organize/settings-appearance#logos).
* **Favicon** : Petite icône qui apparaît dans les onglets du navigateur. Téléversez des fichiers ICO, PNG, GIF ou JPG. Définissez des versions distinctes pour les modes clair et sombre si nécessaire.

<div id="styling">
  ## Apparence
</div>

Contrôlez l'identité visuelle et la palette de couleurs de votre site.

* **Theme** : Choisissez un [thème](/fr/customize/themes) pour l'apparence générale de votre site.
* **Primary color** : La couleur d'accent principale utilisée sur l'ensemble de votre site pour les liens, les boutons et les mises en valeur.
* **Light color** : Couleur d'accent utilisée en mode sombre. Son application varie selon le thème.
* **Dark color** : Couleur d'accent utilisée en mode clair. Son application varie selon le thème.
* **Background color** : Couleurs d'arrière-plan personnalisées pour les modes clair et sombre.
* **Icon library** : Bibliothèque d'icônes utilisée pour toutes les propriétés d'icône. Par défaut : `fontawesome`.
* **Strict appearance** : Verrouille le site sur un seul mode d'apparence et masque le bouton de bascule de thème.
* **Default appearance** : Définit si votre site se charge par défaut en mode `system`, `light` ou `dark`.
* **Background decoration** : Applique un style visuel (`gradient`, `grid` ou `windows`) à votre arrière-plan.
* **Background image** : Image d'arrière-plan facultative. Définissez une image unique ou des versions distinctes pour les modes clair et sombre.

<div id="typography">
  ## Typographie
</div>

Remplacez les polices par défaut par la typographie de votre marque.

* **Font family** : Toute famille [Google Fonts](https://fonts.google.com/) fonctionne directement. Pour une police auto-hébergée, fournissez une URL source et un format (`woff` ou `woff2`).
* **Weight** : Généralement `400` pour le texte normal et `700` pour le gras. Les polices variables prennent en charge des graisses précises comme `550`.
* **Heading font** : Surcharge facultative appliquée à tous les titres (`h1` à `h6`).
* **Body font** : Surcharge facultative appliquée au corps de texte et au reste de la page.

<div id="navbar">
  ## Barre de navigation
</div>

Ajoutez des éléments de navigation en haut de votre site.

* **Primary button** : L'appel à l'action principal dans votre en-tête. Définissez le type, le label et l'URL de destination.
* **Navbar links** : Liens de navigation supplémentaires dans votre en-tête. Chaque lien comporte un texte et une URL.

<div id="footer">
  ## Pied de page
</div>

Ajoutez des liens et des comptes de réseaux sociaux au pied de page de votre site.

* **Social links** : Profils sur des plateformes comme GitHub, X, LinkedIn, Discord, YouTube et Slack.
* **Footer columns** : Activez pour organiser les liens du pied de page en jusqu'à quatre colonnes avec des titres personnalisés.

<div id="banner">
  ## Bannière
</div>

Affichez une barre d'annonce en haut de chaque page.

* **Content** : Le texte de la bannière. Prend en charge la mise en forme MDX de base, comme les liens, le gras et l'italique. Les composants personnalisés ne sont pas pris en charge.
* **dismissible** : Affiche un bouton de fermeture sur le côté droit de la bannière.
* **Type** : Style visuel. `info` utilise la couleur de marque principale, `warning` utilise un arrière-plan ambré et `critical` utilise un arrière-plan rouge. Par défaut : `info`.
* **Color** : Remplace la couleur d'arrière-plan de la bannière par une couleur hexadécimale personnalisée. Définissez des valeurs distinctes pour les modes clair et sombre pour des couleurs adaptées au thème.

<div id="thumbnail">
  ## Vignette
</div>

Personnalisez les vignettes de page et les aperçus pour les réseaux sociaux.

* **Background** : Image d'arrière-plan personnalisée pour les vignettes.
* **Appearance** : Affiche les vignettes en mode `light` ou `dark`. Si non défini, les vignettes sont générées automatiquement à partir des couleurs de votre thème.
* **Font** : Police personnalisée pour le texte des vignettes.

<div id="content">
  ## Contenu
</div>

Personnalisez la façon dont le contenu apparaît sur votre site.

* **Page eyebrow** : Affiche de petits labels au-dessus des titres de page. Choisissez `section` ou `breadcrumbs`.
* **Timestamps** : Affiche la date de dernière modification du contenu sur toutes les pages.
* **LaTeX** : Charge les feuilles de style LaTeX (KaTeX) pour le rendu des notations mathématiques.

<div id="codeblocks">
  ## Blocs de code
</div>

Configurez la coloration syntaxique et le comportement des blocs de code.

* **Code block theme** : Adaptez au mode clair/sombre du site avec `system`, utilisez toujours un thème sombre avec `dark`, ou choisissez un thème [Shiki](https://shiki.style/) personnalisé.
* **Custom code languages** : Enregistrez des langages de coloration syntaxique supplémentaires.

<div id="context-menu">
  ## Menu contextuel
</div>

Configurez les actions rapides présentées dans le menu contextuel de la page.

* **Options** : Liste déroulante à sélection multiple d'actions comme `copy`, `view` et l'ouverture de la page dans `chatgpt`, `claude`, `cursor` et d'autres assistants IA.
* **Display** : Où afficher les options. `header` (par défaut) les affiche dans le menu contextuel en haut de page ; `toc` les affiche dans la barre latérale de la table des matières.

<div id="navigation">
  ## Navigation
</div>

Ajustez le comportement de la navigation sur votre site.

* **drilldown** : Navigue automatiquement vers la première page lorsqu'un utilisateur clique sur un groupe de navigation.

<div id="search">
  ## Recherche
</div>

Personnalisez l'expérience de recherche et les retours utilisateur.

* **Search placeholder** : Le texte qui apparaît dans le champ de recherche avant que les utilisateurs ne tapent. La valeur par défaut est `Search or ask`.
* **Feedback** : Affiche les boutons pouce vers le haut et pouce vers le bas, ou un lien « Suggest edits » sur chaque page.

<div id="api-reference">
  ## Référence d'API
</div>

Documentez les endpoints de votre API.

* **OpenAPI specs** : Ajoutez des fichiers de spécification OpenAPI pour générer des pages de référence d'API.
* **AsyncAPI specs** : Ajoutez des fichiers de spécification AsyncAPI pour générer des pages de référence d'API.
* **MDX server** : Endpoints MDX server personnalisés pour le bac à sable d'API.
* **Playground display** : Affichez le bac à sable d'API interactif, le bac à sable d'API simple ou aucun bac à sable d'API.
* **Proxy server** : Activez ou désactivez le serveur proxy pour les requêtes d'API.
* **`mdx.schema`** : Détermine si la section de schéma s'affiche sur les pages de référence d'API.

<div id="redirects">
  ## Redirections
</div>

Utilisez la section **Redirects** pour ajouter, modifier, rechercher et supprimer des redirections sans modifier manuellement votre fichier `docs.json`. Les redirections envoient les utilisateurs d'anciennes URL vers de nouvelles, ce qui est utile lorsque vous renommez des pages ou réorganisez votre site. Pour plus d'informations, consultez [Redirections](/fr/create/redirects).

Chaque redirection comporte les champs suivants :

* **Source** : Le chemin à rediriger, comme `/old-path`. Prend en charge les caractères génériques.
* **Destination** : Le chemin de destination, comme `/new-path`. Prend en charge les caractères génériques.
* **Status** : Le code d'état HTTP de la redirection.
  * `308` : Redirection permanente. À utiliser pour le contenu qui a été déplacé définitivement. C'est le statut par défaut.
  * `307` : Redirection temporaire. À utiliser lorsque le déplacement est temporaire.

<Frame>
  <img src="https://mintcdn.com/mintlify/De7VVdLQKy1YZcUm/images/editor/redirects-light.png?fit=max&auto=format&n=De7VVdLQKy1YZcUm&q=85&s=ab5f397d74f04d07f3ab1b4f3149763a" alt="Menu des redirections dans l'éditeur." className="block dark:hidden" width="1590" height="972" data-path="images/editor/redirects-light.png" />

  <img src="https://mintcdn.com/mintlify/De7VVdLQKy1YZcUm/images/editor/redirects-dark.png?fit=max&auto=format&n=De7VVdLQKy1YZcUm&q=85&s=2ca09783d35e3ed01cea7b2975e623f6" alt="Menu des redirections dans l'éditeur." className="hidden dark:block" width="1590" height="972" data-path="images/editor/redirects-dark.png" />
</Frame>

Pour ajouter une redirection :

1. Cliquez sur **Add redirect**.
2. Saisissez la source et la destination.
3. Cliquez sur **Save**.

Pour modifier ou supprimer une redirection existante, survolez la ligne et utilisez l'icône d'édition inline ou le **X** pour la supprimer.

<div id="seo">
  ## SEO
</div>

Configurez les balises méta et l'indexation pour les moteurs de recherche.

* **metatags** : Balises `<meta>` personnalisées appliquées à l'ensemble de votre site. Ajoutez des paires clé-valeur pour des balises comme `og:image` ou `twitter:card`.
* **Indexing** : Choisissez d'indexer ou non les pages masquées.

<div id="analytics">
  ## Analytics
</div>

Connectez des plateformes d'analytics pour suivre le comportement des visiteurs. Les fournisseurs pris en charge incluent Amplitude, Mixpanel, Heap, Google Analytics, Google Tag Manager, PostHog, Plausible, Fathom, Segment, Hightouch, Hotjar, LogRocket, Microsoft Clarity, Intercom, Clearbit, et plus encore.

Chaque entrée s'affiche sous forme de ligne inline. Utilisez l'icône **X** pour supprimer une intégration.

<div id="404-page">
  ## Page 404
</div>

Personnalisez l'expérience lorsqu'un utilisateur arrive sur une page manquante.

* **Redirect to home** : Lorsqu'activé, les pages manquantes redirigent vers votre page d'accueil. Lorsque désactivé, le site affiche une page 404 et vous pouvez personnaliser le titre et la description ci-dessous.
* **Title** : Titre affiché sur la page 404.
* **Description** : Sous-titre affiché sur la page 404.

<div id="variables">
  ## Variables
</div>

Définissez des variables personnalisées réutilisables dans tout votre contenu. Chaque variable est une paire clé-valeur. Utilisez l'icône **X** pour supprimer une variable.


## Related topics

- [Vérifications CI](/docs/fr/deploy/ci.md)
- [Configuration de l'authentification](/docs/fr/deploy/authentication-setup.md)
- [Configuration d’un monorepo](/docs/fr/deploy/monorepo.md)
