mirror of
https://github.com/mintlify/docs.git
synced 2026-09-14 13:35:46 +08:00
locadex-agent[bot]
c789e88df2
* docs(locadex): add translations * Apply suggestion from @ethanpalm * Apply suggestion from @ethanpalm --------- Co-authored-by: locadex-agent[bot] <217277504+locadex-agent[bot]@users.noreply.github.com> Co-authored-by: Ethan Palm <56270045+ethanpalm@users.noreply.github.com>
373 lines
18 KiB
Plaintext
373 lines
18 KiB
Plaintext
---
|
||
title: "Éditeur visuel"
|
||
description: "Créez, mettez à jour et publiez votre documentation dans votre navigateur."
|
||
keywords: ["éditeur visuel", "WYSIWYG", "éditeur web"]
|
||
---
|
||
|
||
<img className="block dark:hidden my-0 pointer-events-none" src="/images/editor/editor-light.png" alt="Interface de l’éditeur visuel Mintlify en mode clair" />
|
||
|
||
<img className="hidden dark:block my-0 pointer-events-none" src="/images/editor/editor-dark.png" alt="Interface de l’éditeur visuel Mintlify en mode sombre" />
|
||
|
||
Accédez à l’éditeur visuel depuis votre [Dashboard](https://dashboard.mintlify.com/editor) pour gérer votre documentation directement dans votre navigateur.
|
||
|
||
* **Édition WYSIWYG** : Modifiez votre documentation avec un éditeur WYSIWYG (What You See Is What You Get) qui affiche l’apparence de votre contenu une fois publié.
|
||
* **Synchronisation Git** : Toutes les modifications sont automatiquement synchronisées avec votre référentiel Git pour conserver l’historique des versions.
|
||
* **Collaboration en équipe** : Plusieurs personnes peuvent travailler simultanément sur la documentation.
|
||
* **Intégration de composants** : Ajoutez des encarts, des code blocks et d’autres composants avec des commandes au slash.
|
||
* **Aucune configuration requise** : Commencez à écrire immédiatement depuis votre Dashboard.
|
||
|
||
<div id="overview">
|
||
## Aperçu
|
||
</div>
|
||
|
||
Voici comment vous travaillerez généralement dans l’éditeur visuel :
|
||
|
||
<Steps>
|
||
<Step title="Choisissez votre branche">
|
||
Créez une branche ou apportez des modifications directement à votre branche de déploiement. Nous recommandons de créer une branche afin de pouvoir prévisualiser vos modifications avant leur mise en ligne.
|
||
</Step>
|
||
|
||
<Step title="Ouvrez votre fichier">
|
||
Accédez à un fichier existant dans la barre latérale ou créez-en un nouveau à l’aide de l’explorateur de fichiers.
|
||
</Step>
|
||
|
||
<Step title="Modifiez votre contenu">
|
||
Apportez des modifications dans l’éditeur visuel. Appuyez sur <kbd>/</kbd> pour ouvrir le menu des composants.
|
||
</Step>
|
||
|
||
<Step title="Prévisualisez vos modifications">
|
||
Le mode visuel vous montre comment vos modifications apparaîtront sur votre site en ligne. Utilisez-le pour vérifier que tout est correct.
|
||
</Step>
|
||
|
||
<Step title="Publiez vos modifications">
|
||
Si vous travaillez sur votre branche de déploiement, publiez vos modifications directement depuis l’éditeur visuel. Sur les autres branches, créez une pull request (demande de fusion) pour relecture avant la publication.
|
||
</Step>
|
||
</Steps>
|
||
|
||
<div id="editor-modes">
|
||
## Modes de l’éditeur
|
||
</div>
|
||
|
||
L’éditeur visuel propose deux modes pour s’adapter à différentes préférences et besoins d’édition : le mode visuel et le Mode Markdown.
|
||
|
||
Utilisez l’interrupteur de mode dans la barre d’outils de l’éditeur pour changer de mode.
|
||
|
||
<Frame>
|
||
<img src="/images/editor/mode-toggle-light.png" alt="Icônes de bascule de mode mises en évidence dans l’éditeur visuel." className="block dark:hidden" />
|
||
|
||
<img src="/images/editor/mode-toggle-dark.png" alt="Icônes de bascule de mode mises en évidence dans l’éditeur visuel." className="hidden dark:block" />
|
||
</Frame>
|
||
|
||
<div id="visual-mode">
|
||
### Mode visuel
|
||
</div>
|
||
|
||
Le mode visuel offre une expérience WYSIWYG (What You See Is What You Get) dans laquelle les modifications apportées dans l’éditeur reflètent l’apparence de votre documentation publiée. Ce mode est idéal lorsque vous souhaitez voir, en temps réel, à quoi ressembleront vos modifications.
|
||
|
||
<Frame>
|
||
<img src="/images/editor/visual-mode-light.png" alt="Mode d’édition visuelle dans l’éditeur visuel Mintlify" className="block dark:hidden" />
|
||
|
||
<img src="/images/editor/visual-mode-dark.png" alt="Mode d’édition visuelle dans l’éditeur visuel Mintlify" className="hidden dark:block" />
|
||
</Frame>
|
||
|
||
<div id="markdown-mode">
|
||
### Mode Markdown
|
||
</div>
|
||
|
||
Le mode Markdown offre un accès direct aux fichiers qui composent votre documentation. Ce mode est idéal lorsque vous avez besoin d’un contrôle précis sur les propriétés des composants ou lorsque vous préférez écrire en syntaxe MDX.
|
||
|
||
<Frame>
|
||
<img src="/images/editor/markdown-mode-light.png" alt="Mode Markdown dans l'éditeur visuel Mintlify" className="block dark:hidden" />
|
||
|
||
<img src="/images/editor/markdown-mode-dark.png" alt="Mode Markdown dans l'éditeur visuel Mintlify" className="hidden dark:block" />
|
||
</Frame>
|
||
|
||
<div id="manage-content">
|
||
## Gérer l’objet
|
||
</div>
|
||
|
||
<div id="navigate-your-files">
|
||
### Parcourir vos fichiers
|
||
</div>
|
||
|
||
Utilisez l’explorateur de fichiers dans la barre latérale pour parcourir vos fichiers de documentation. Cliquez sur n’importe quel fichier pour l’ouvrir dans l’éditeur.
|
||
|
||
Appuyez sur <kbd>Commande</kbd> + <kbd>P</kbd> sur macOS ou <kbd>Ctrl</kbd> + <kbd>P</kbd> sur Windows pour rechercher des fichiers par nom.
|
||
|
||
<div id="create-new-pages">
|
||
### Créer de nouvelles pages
|
||
</div>
|
||
|
||
Sélectionnez l’icône **Créer un nouveau fichier** dans la barre latérale de l’explorateur de fichiers.
|
||
|
||
<Frame>
|
||
<img src="/images/editor/files-menu-light.png" className="block dark:hidden rounded-2xl border border-gray-100 shadow-lg" style={{ width:"400px",height:"auto" }} alt="Menu Fichiers dans l’éditeur visuel" />
|
||
|
||
<img src="/images/editor/files-menu-dark.png" className="hidden dark:block rounded-2xl border border-white/10 shadow-lg" style={{ width:"400px",height:"auto" }} alt="Menu Fichiers dans l’éditeur visuel en mode sombre" />
|
||
</Frame>
|
||
|
||
Les noms de fichiers sont automatiquement complétés par l’extension `.mdx`. Pour changer le type de fichier, cliquez sur l’extension. Sélectionnez le type de fichier souhaité dans le menu déroulant.
|
||
|
||
<Frame>
|
||
<img src="/images/editor/file-type-light.png" className="block dark:hidden" style={{ width:"auto",height:"400px" }} alt="Menu des extensions de fichier dans l’éditeur visuel." />
|
||
|
||
<img src="/images/editor/file-type-dark.png" className="hidden dark:block" style={{ width:"auto",height:"400px" }} alt="Menu des extensions de fichier dans l’éditeur visuel en mode sombre." />
|
||
</Frame>
|
||
|
||
<div id="rename-pages">
|
||
### Renommer des pages
|
||
</div>
|
||
|
||
Pour renommer une page, cliquez sur l’icône du menu kebab du fichier que vous souhaitez renommer. Sélectionnez **Renommer** dans le menu déroulant.
|
||
|
||
<Frame>
|
||
<img src="/images/editor/rename-light.png" className="block dark:hidden" alt="Renommer une page dans l’éditeur visuel." />
|
||
|
||
<img src="/images/editor/rename-dark.png" className="hidden dark:block" alt="Renommer une page dans l’éditeur visuel en mode sombre." />
|
||
</Frame>
|
||
|
||
<div id="delete-pages">
|
||
### Supprimer des pages
|
||
</div>
|
||
|
||
Pour supprimer une page, cliquez sur l’icône du menu kebab du fichier à supprimer. Sélectionnez **Supprimer** dans le menu déroulant.
|
||
|
||
<Frame>
|
||
<img src="/images/editor/delete-page-light.png" className="block dark:hidden" alt="Suppression d’une page dans l’éditeur visuel." />
|
||
|
||
<img src="/images/editor/delete-page-dark.png" className="hidden dark:block" alt="Suppression d’une page dans l’éditeur visuel en mode sombre." />
|
||
</Frame>
|
||
|
||
<div id="organize-your-navigation">
|
||
### Organisez votre navigation
|
||
</div>
|
||
|
||
Modifiez votre fichier `docs.json` pour ajouter de nouvelles pages et retirer de la navigation de votre site celles qui ont été supprimées. Consultez [Navigation](/fr/organize/navigation) pour plus d’informations sur l’organisation des pages.
|
||
|
||
**Exemple : ajouter une page Thèmes au groupe Profile**
|
||
|
||
Dans cet exemple, vous avez créé une nouvelle page intitulée Thèmes et vous souhaitez l’ajouter au groupe Profile dans votre documentation. Ajoutez le chemin de la nouvelle page au tableau `pages` du groupe `Profile` dans votre fichier `docs.json` pour qu’elle apparaisse dans la navigation de votre site.
|
||
|
||
```json Adding a Themes page to the Profile group {18}
|
||
{
|
||
"navigation": {
|
||
"groups": [
|
||
{
|
||
"group": "Premiers pas",
|
||
"pages": [
|
||
"index",
|
||
"quickstart",
|
||
"installation"
|
||
]
|
||
},
|
||
{
|
||
"group": "Profil",
|
||
"pages": [
|
||
"settings",
|
||
"account-types",
|
||
"dashboard",
|
||
"themes"
|
||
]
|
||
}
|
||
]
|
||
}
|
||
}
|
||
```
|
||
|
||
<div id="edit-content">
|
||
### Modifier le contenu
|
||
</div>
|
||
|
||
Apportez des modifications à vos pages à l'aide du mode visuel ou du mode Markdown dans l'éditeur.
|
||
|
||
En mode visuel, appuyez sur <kbd>/</kbd> pour ouvrir le menu des composants. Ajoutez des blocs de contenu, des encadrés, des blocs de code et d'autres composants pour personnaliser votre documentation.
|
||
|
||
<Frame>
|
||
<img src="/images/editor/component-menu-light.png" alt="Le menu des composants déplié, mis en évidence dans l'éditeur visuel Mintlify" className="block dark:hidden" />
|
||
|
||
<img src="/images/editor/component-menu-dark.png" alt="Le menu des composants déplié, mis en évidence dans l'éditeur visuel Mintlify" className="hidden dark:block" />
|
||
</Frame>
|
||
|
||
En mode Markdown, vous pouvez modifier directement le MDX de vos pages. Cela peut être utile lorsque vous devez :
|
||
|
||
* Définir des propriétés spécifiques pour les composants
|
||
* Travailler avec des composants imbriqués complexes
|
||
* Copier et coller du contenu MDX à partir d'autres sources
|
||
|
||
Consultez [Formater le texte](/fr/create/text) et [Formater le code](/fr/create/code) pour plus d'informations sur la rédaction avec la syntaxe MDX.
|
||
|
||
<div id="publish-your-changes">
|
||
## Publier vos modifications
|
||
</div>
|
||
|
||
La branche sur laquelle vous travaillez détermine comment l’éditeur publie vos modifications :
|
||
|
||
* **Branche de déploiement** : la publication met immédiatement à jour votre site en ligne.
|
||
* **Autres branches** : la publication crée une pull request (demande de fusion) pour que vous puissiez examiner les modifications avant de les déployer en production.
|
||
|
||
<Frame>
|
||
<img src="/images/editor/publish-flow-light.png" alt="Le bouton Publier mis en évidence dans l’éditeur visuel Mintlify" className="block dark:hidden" />
|
||
|
||
<img src="/images/editor/publish-flow-dark.png" alt="Le bouton Publier mis en évidence dans l’éditeur visuel Mintlify" className="hidden dark:block" />
|
||
</Frame>
|
||
|
||
Si vous autorisez Mintlify sur votre compte GitHub, vos commits seront signés comme si vous les aviez effectués vous‑même. Sinon, ils seront signés par l’application GitHub App de Mintlify.
|
||
|
||
<div id="pull-requests-and-reviewing-changes">
|
||
### Pull requests et revue des modifications
|
||
</div>
|
||
|
||
Les pull requests (demandes de fusion) vous permettent de proposer des modifications depuis votre branche afin que d’autres puissent les examiner avant de les fusionner dans votre documentation en production. Cela aide à garantir l’exactitude de vos modifications et offre à votre équipe l’occasion de collaborer sur le contenu.
|
||
|
||
<Tip>
|
||
Même si vous travaillez seul, les pull requests sont utiles pour prévisualiser les modifications et maintenir un historique des mises à jour clair.
|
||
</Tip>
|
||
|
||
<div id="create-a-pull-request">
|
||
#### Créer une pull request
|
||
</div>
|
||
|
||
<Steps>
|
||
<Step title="Enregistrer votre travail">
|
||
Sélectionnez **Enregistrer les modifications** pour enregistrer toutes les modifications sur votre branche.
|
||
</Step>
|
||
|
||
<Step title="Créer la pull request">
|
||
Sélectionnez **Publish Pull Request** dans la barre d’outils de l’éditeur.
|
||
</Step>
|
||
|
||
<Step title="Ajouter un titre et une description">
|
||
Rédigez un titre et une description clairs expliquant :
|
||
|
||
* Les modifications que vous avez apportées
|
||
* Pourquoi vous les avez apportées
|
||
* Les points spécifiques à examiner
|
||
</Step>
|
||
|
||
<Step title="Créer et partager">
|
||
Sélectionnez **Publish Pull Request**. L’éditeur fournira un lien pour afficher votre pull request.
|
||
|
||
<Frame>
|
||
<img src="/images/editor/pull-request-light.png" alt="Bouton Publish Pull Request mis en évidence dans l’éditeur visuel Mintlify" className="block dark:hidden" />
|
||
|
||
<img src="/images/editor/pull-request-dark.png" alt="Bouton Publish Pull Request mis en évidence dans l’éditeur visuel Mintlify" className="hidden dark:block" />
|
||
</Frame>
|
||
</Step>
|
||
</Steps>
|
||
|
||
<div id="review-pull-requests">
|
||
#### Examiner les pull requests
|
||
</div>
|
||
|
||
Une fois votre pull request créée :
|
||
|
||
1. **Passer en revue les modifications** : Vous et les membres de votre équipe pouvez examiner votre pull request dans votre fournisseur Git, comme GitHub ou GitLab.
|
||
2. **Laisser des commentaires** : Ajoutez des commentaires ou demandez des changements.
|
||
3. **Apporter des modifications supplémentaires** : Apportez des modifications supplémentaires dans l’éditeur visuel. Lorsque vous enregistrez les modifications, l’éditeur les envoie vers votre pull request.
|
||
4. **Approuver** : Approuvez la pull request lorsque vous êtes satisfait des changements.
|
||
5. **Fusionner** : Fusionnez la pull request lorsque vous êtes prêt à déployer vos changements en production.
|
||
|
||
<div id="keyboard-shortcuts">
|
||
## Raccourcis clavier
|
||
</div>
|
||
|
||
L’éditeur visuel prend en charge tous les raccourcis clavier courants comme copier, coller, annuler et tout sélectionner, ainsi que les raccourcis suivants :
|
||
|
||
| Commande | macOS | Windows |
|
||
| :------------------------------- | :--------------------------------------------------- | :------------------------------------------------------- |
|
||
| **Rechercher des fichiers** | <kbd>Cmd</kbd> + <kbd>P</kbd> | <kbd>Control</kbd> + <kbd>P</kbd> |
|
||
| **Ajouter un lien au texte sélectionné** | <kbd>Cmd</kbd> + <kbd>K</kbd> | <kbd>Control</kbd> + <kbd>K</kbd> |
|
||
| **Saut de ligne** | <kbd>Cmd</kbd> + <kbd>Enter</kbd> | <kbd>Control</kbd> + <kbd>Enter</kbd> |
|
||
| **Gras** | <kbd>Cmd</kbd> + <kbd>B</kbd> | <kbd>Control</kbd> + <kbd>B</kbd> |
|
||
| **Italique** | <kbd>Cmd</kbd> + <kbd>I</kbd> | <kbd>Control</kbd> + <kbd>I</kbd> |
|
||
| **Soulignement** | <kbd>Cmd</kbd> + <kbd>U</kbd> | <kbd>Control</kbd> + <kbd>U</kbd> |
|
||
| **Barré** | <kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd> | <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd> |
|
||
| **Code** | <kbd>Cmd</kbd> + <kbd>E</kbd> | <kbd>Control</kbd> + <kbd>E</kbd> |
|
||
| **Texte normal** | <kbd>Cmd</kbd> + <kbd>Alt</kbd> + <kbd>0</kbd> | <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd>0</kbd> |
|
||
| **Titre 1** | <kbd>Cmd</kbd> + <kbd>Alt</kbd> + <kbd>1</kbd> | <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd>1</kbd> |
|
||
| **Titre 2** | <kbd>Cmd</kbd> + <kbd>Alt</kbd> + <kbd>2</kbd> | <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd>2</kbd> |
|
||
| **Titre 3** | <kbd>Cmd</kbd> + <kbd>Alt</kbd> + <kbd>3</kbd> | <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd>3</kbd> |
|
||
| **Titre 4** | <kbd>Cmd</kbd> + <kbd>Alt</kbd> + <kbd>4</kbd> | <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd>4</kbd> |
|
||
| **Liste numérotée** | <kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>7</kbd> | <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>7</kbd> |
|
||
| **Liste à puces** | <kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>8</kbd> | <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>8</kbd> |
|
||
| **Bloc de citation** | <kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd> | <kbd>Control</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd> |
|
||
| **Indice** | <kbd>Cmd</kbd> + <kbd>,</kbd> | <kbd>Control</kbd> + <kbd>,</kbd> |
|
||
| **Exposant** | <kbd>Cmd</kbd> + <kbd>.</kbd> | <kbd>Control</kbd> + <kbd>.</kbd> |
|
||
|
||
<div id="troubleshooting">
|
||
## Dépannage
|
||
</div>
|
||
|
||
Trouvez des solutions aux problèmes courants que vous pouvez rencontrer lors de l’utilisation de l’éditeur visuel.
|
||
|
||
<AccordionGroup>
|
||
<Accordion title="Les modifications n’apparaissent pas après la publication">
|
||
**Causes possibles :**
|
||
|
||
* Le déploiement est toujours en cours
|
||
* Problèmes de cache du navigateur
|
||
* Erreurs de build ou de déploiement
|
||
|
||
**Solutions :**
|
||
|
||
1. Vérifiez l’état du déploiement dans votre Dashboard.
|
||
2. Forcez l’actualisation de votre navigateur (<kbd>Ctrl</kbd>
|
||
|
||
* <kbd>F5</kbd>
|
||
|
||
ou <kbd>Cmd</kbd>
|
||
|
||
* <kbd>Shift</kbd>
|
||
|
||
* <kbd>R</kbd>
|
||
|
||
)
|
||
3. Videz le cache de votre navigateur.
|
||
</Accordion>
|
||
|
||
<Accordion title="Erreurs d’autorisations lors de la publication">
|
||
**Causes possibles :**
|
||
|
||
* Autorisations insuffisantes sur le référentiel Git
|
||
* Problèmes d’authentification avec votre fournisseur Git
|
||
|
||
**Solutions :**
|
||
|
||
1. Vérifiez que vous disposez des droits d’accès nécessaires au référentiel.
|
||
2. Vérifiez que votre intégration Git est correctement configurée.
|
||
3. Consultez la documentation [Permissions de l’éditeur](/fr/dashboard/permissions).
|
||
</Accordion>
|
||
|
||
<Accordion title="Problèmes de chargement de l’éditeur">
|
||
**Causes possibles :**
|
||
|
||
* Problèmes de connectivité réseau
|
||
* Référentiels de documentation volumineux
|
||
|
||
**Solutions :**
|
||
|
||
1. Vérifiez votre connexion Internet.
|
||
2. Actualisez la page.
|
||
3. Contactez le support si le problème persiste.
|
||
</Accordion>
|
||
|
||
<Accordion title="Fichiers qui ne se chargent pas ou affichent des erreurs">
|
||
**Causes possibles :**
|
||
|
||
* Syntaxe MDX invalide dans les fichiers
|
||
* Fichiers manquants ou corrompus
|
||
* Fichiers trop volumineux entraînant des expirations
|
||
|
||
**Solutions :**
|
||
|
||
1. Vérifiez la syntaxe du fichier pour détecter des erreurs de formatage MDX.
|
||
2. Vérifiez que le fichier existe dans votre référentiel.
|
||
</Accordion>
|
||
</AccordionGroup>
|
||
|
||
<div id="next-steps">
|
||
## Prochaines étapes
|
||
</div>
|
||
|
||
* Apprenez les concepts fondamentaux de [Git](/fr/guides/git-concepts)
|
||
* Apprenez les bonnes pratiques pour collaborer avec les [branches](/fr/guides/branches) |