Aperçu des composants
Découvrez les composants MDX de Jamdesk : cartes, onglets, encadrés et blocs de code, pour trouver celui qui convient à votre documentation.
Jamdesk propose des composants MDX que vous pouvez utiliser sur n'importe quelle page. Cet aperçu vous aide à choisir le composant adapté à votre contenu.
Utilisation
Insérez les composants directement dans votre MDX :
<Card title="Quickstart" icon="rocket" href="/quickstart">
Launch your docs in minutes.
</Card>
Mise en page et navigation
Sections de contenu réductibles qui permettent aux utilisateurs de déplier uniquement ce dont ils ont besoin. Idéal pour les FAQ, les listes de fonctionnalités et les options de configuration.
Apprenez à utiliser le composant Card pour créer des conteneurs cliquables et stylisés avec des icônes, des images, des liens et des CTA dans des mises en page en grille.
Mise en page en grille responsive pour afficher des Cards, des Tiles et d'autres contenus côte à côte. S'adapte automatiquement à la taille de l'écran.
Frame encadre les images et les démonstrations dans un conteneur avec bordure et légendes optionnelles, pour une présentation visuelle cohérente de la documentation.
Utilisez Panel pour épingler du contenu personnalisé comme des avertissements ou des références rapides dans la barre latérale, en le gardant visible pendant que les lecteurs font défiler la page.
Guides étape par étape numérotés pour les flux de configuration, les tutoriels et le dépannage. Prend en charge les icônes, les blocs de code et le contenu imbriqué.
Panneaux interchangeables pour du contenu mutuellement exclusif, comme les gestionnaires de paquets ou les langages. Les titres d'onglets identiques se synchronisent sur toute la page.
Les Tiles affichent des aperçus de contenu avec un arrière-plan à motif stylisé et une zone d'image proéminente. Utilisez-les pour les intégrations, les modèles ou les galeries visuelles.
Affichez des hiérarchies de fichiers et de dossiers avec un développement/réduction interactif et une navigation au clavier. Idéal pour la documentation de la structure d'un projet.
Créez une documentation qui s'adapte au framework ou au langage choisi par le lecteur. Des sections entières changent selon la sélection de l'utilisateur.
Contenu et mise en valeur
Étiquettes en ligne pour les statuts, les catégories et les métadonnées : 11 variantes de couleur, 4 tailles, des icônes, des formes pilule/arrondie et des contours.
Apprenez à utiliser les composants Note, Tip, Warning, Danger, Check et Callout personnalisés pour mettre en évidence les informations clés de votre documentation.
Expandable crée un simple bouton d'affichage/masquage pour du contenu que les lecteurs peuvent vouloir consulter, mais qui n'est pas essentiel au flux principal.
Affichez des définitions et du contexte au survol. Définissez des termes, expliquez des acronymes ou créez des liens vers du contenu associé sans surcharger la page.
Entrées de journal des modifications sous forme de chronologie, avec dates, descriptions et étiquettes de catégorie. S'intègre à votre table des matières pour la navigation.
Affichez un contenu différent aux lecteurs humains et aux agents IA sur la même page. Contexte, instructions et définitions réservés aux agents, qui restent absents de la documentation rendue.
Code et données
Affichez des blocs de code dans une interface à onglets. Montrez la même opération dans plusieurs langages comme cURL, Python et JavaScript.
Épinglez des blocs de code dans une barre latérale droite fixe sur ordinateur, pour que les lecteurs puissent s'y référer en faisant défiler la page. Prend en charge les langages à onglets.
Documentez les paramètres d'API et les champs de réponse avec les composants ParamField et ResponseField. Prend en charge les types, les valeurs par défaut et les objets imbriqués.
Utilisez Prompt pour présenter des instructions IA réutilisables avec copie, des actions d'ouverture intégrées, des destinations personnalisées, des icônes et des options d'affichage compact.
Organisez les données en lignes et en colonnes. Prend en charge les tableaux markdown et les composants Table avec tri, mise en surbrillance et fusion de cellules.
Diagrammes et visuels
Le composant Color affiche des palettes de couleurs pour documenter des systèmes de design, des chartes graphiques ou toute spécification de couleur.
Générez des organigrammes, des diagrammes de séquence, des chronologies, des diagrammes circulaires et plus encore à partir d'une syntaxe Mermaid textuelle. Les diagrammes sont générés en SVG au moment du build.
Générez des diagrammes d'architecture, des organigrammes, des séquences et des modèles SQL à partir d'une syntaxe D2 textuelle. Les diagrammes s'affichent en SVG avec un thème clair et sombre automatique.
Engagement
Ajoutez un formulaire d'inscription à une newsletter ou à un journal des modifications sur n'importe quelle page de documentation avec le composant EmailSubscribe : capture native pour sept fournisseurs, intégrations pour les autres.
Intégrez une démo en direct du widget Nouveautés dans votre documentation avec le composant MDX Widget : un bouton déclencheur qui ouvre votre journal des modifications dans une fenêtre modale, sans balise script nécessaire.
