Aller au contenu principal

Ajouter une section au menu

Voir aussi le glossaire Docusaurus pour les notions comme sidebar, doc ID, index et slug.

Cette procédure explique comment créer une nouvelle catégorie dans la sidebar (menu de gauche), avec ses propres pages.

Étape 1 — Créer un dossier pour la section​

Dans docs/, créez un nouveau dossier. Exemple :

docs/ma-section/

Étape 2 — Créer une page d'accueil pour la section​

Créez un fichier index.md dans ce dossier. C'est la page qui s'affiche quand on clique sur le titre de la catégorie.

docs/ma-section/index.md

Contenu minimal :

---
title: Ma section
---

# Ma section

Présentation de cette section...

Étape 3 — Créer les pages de la section​

Ajoutez autant de fichiers .md que nécessaire dans le dossier :

docs/ma-section/01_premiere_page.md
docs/ma-section/02_deuxieme_page.md

Étape 4 — Ajouter la section dans sidebars.js​

C'est l'étape clé. Ouvrez sidebars.js et ajoutez un bloc category dans le tableau vcfSidebar de la sidebar :

const sidebars = {
  vcfSidebar: [

    // ─── Ma nouvelle section ───────────────────────────────────────────────
    {
      type: 'category',
      label: '🗂️ Ma section',
      collapsed: false,               // true = replié par défaut, false = ouvert
      link: { type: 'doc', id: 'ma-section/index' },
      items: [
        { type: 'doc', id: 'ma-section/premiere_page',  label: '01 — Première page' },
        { type: 'doc', id: 'ma-section/deuxieme_page',  label: '02 — Deuxième page' },
      ],
    },

    // ... reste des sections existantes
  ],
};

Règles importantes pour le doc ID​

Ce que vous voyezCe qu'il faut écrire dans id
docs/ma-section/index.mdma-section/index
docs/ma-section/01_premiere_page.mdma-section/premiere_page

Docusaurus retire automatiquement le préfixe numérique (01_, 02_, etc.) de l'ID. Il faut donc écrire premiere_page et non 01_premiere_page.

Contrôler la position de la section​

L'ordre dans vcfSidebar détermine l'ordre dans le menu. La première entrée apparaît en haut.

Étape 5 — Vérifier dans le navigateur​

Si le serveur local tourne (npm run start), vérifiez que :

  • La nouvelle catégorie apparaît dans la sidebar à la bonne position
  • Le clic sur le titre de la catégorie ouvre la page index.md
  • Chaque sous-page est accessible depuis la sidebar

En cas d'erreur au démarrage : Docusaurus liste les IDs invalides dans le message d'erreur. Comparez avec la liste des IDs disponibles pour corriger.