docs.json
consente di trasformare una raccolta di file Markdown in un sito di documentazione navigabile e personalizzato. Questo file di configurazione obbligatorio controlla stile, navigazione, integrazioni e altro ancora. Consideralo come il blueprint della tua documentazione.
Le impostazioni in docs.json
si applicano globalmente a tutte le pagine.
Configurazione del file docs.json
theme
, name
, colors.primary
e navigation
. Gli altri campi sono facoltativi e puoi aggiungerli man mano che aumentano le esigenze della tua documentazione.
Per la migliore esperienza di editing, includi il riferimento allo schema all’inizio del file docs.json
. Questo abilita il completamento automatico, la validazione e utili suggerimenti contestuali nella maggior parte degli editor di codice:
Copy
Ask AI
{
"$schema": "https://mintlify.com/docs.json",
"theme": "mint",
"name": "Your Docs",
"colors": {
"primary": "#ff0000"
},
"navigation": {
// Struttura di navigazione
}
// Resto della configurazione
}
Riferimento
docs.json
.
Personalizzazione
Il tema del layout del tuo sito.Una delle seguenti opzioni:
mint
, maple
, palm
, willow
, linden
, almond
, aspen
.Consulta Temi per ulteriori informazioni.Il nome del tuo progetto, organizzazione o prodotto.
I colori utilizzati nella documentazione. L’applicazione dei colori varia a seconda del tema. Se fornisci solo un colore primario, verrà usato per tutti gli elementi cromatici.
Show Colors
Show Colors
Il colore primario della documentazione. In genere usato per l’enfasi in modalità chiara, con alcune variazioni in base al tema.Deve essere un codice esadecimale che inizia con
#
.Il colore usato per l’enfasi in modalità scura.Deve essere un codice esadecimale che inizia con
#
.Il colore usato per pulsanti e stati hover sia in modalità chiara che scura, con alcune variazioni in base al tema.Deve essere un codice esadecimale che inizia con
#
.Descrizione del sito per SEO e indicizzazione AI.
Il logo per le modalità chiara e scura.
Show Logo
Show Logo
Percorso del file del logo per la modalità chiara. Includi l’estensione del file. Esempio:
/logo.png
Percorso del file del logo per la modalità scura. Includi l’estensione del file. Esempio:
/logo-dark.png
L’URL a cui reindirizzare quando si clicca sul logo. Se non specificato, il logo rimanderà alla homepage. Esempio:
https://mintlify.com
Percorso del file favicon, inclusa l’estensione. Ridimensionata automaticamente alle dimensioni appropriate.
Può essere un singolo file o file separati per le modalità chiara e scura. Esempio:
/favicon.png
Personalizzazione delle miniature per i social media e le anteprime delle pagine.
Configurazioni di stile visivo.
Show Styling
Show Styling
Lo stile della page eyebrow. Scegli
section
per mostrare il nome della sezione o breadcrumbs
per mostrare l’intero percorso di navigazione. Predefinito: section
.Il tema dei blocchi di codice. Scegli
system
per allinearlo al tema del sito o dark
per blocchi di codice sempre scuri. Predefinito: system
.Impostazioni della libreria di icone.
Show Icons
Show Icons
Libreria di icone da usare in tutta la documentazione. Il valore predefinito è
fontawesome
.Puoi specificare l’URL di un’icona ospitata esternamente, il percorso a un file di icona nel tuo progetto oppure codice SVG compatibile con JSX per qualsiasi icona, indipendentemente dall’impostazione della libreria.
Configurazione dei font per la documentazione. Il font predefinito è Inter.
Show Fonts
Show Fonts
Famiglia di font, ad esempio “Open Sans”, “Playfair Display”.
Spessore del font, ad esempio 400 o 700. I font variabili supportano pesi precisi come 550.
URL della sorgente del font, ad esempio https://mintlify-assets.b-cdn.net/fonts/Hubot-Sans.woff2. Google Fonts viene caricato automaticamente quando specifichi il nome della
family
di un Google Font, quindi non serve indicare un URL della sorgente.Formato del file del font.
Sovrascrivi le impostazioni dei font specificamente per i titoli.
Show Heading
Show Heading
Famiglia di font, ad esempio “Open Sans”, “Playfair Display”.
Spessore del font, ad esempio 400 o 700. I font variabili supportano pesi precisi come 550.
URL della sorgente del font, ad esempio https://mintlify-assets.b-cdn.net/fonts/Hubot-Sans.woff2. Google Fonts viene caricato automaticamente quando specifichi il nome della
family
di un Google Font, quindi non serve indicare un URL della sorgente.Formato del file del font.
Sovrascrivi le impostazioni dei font specificamente per il testo del corpo.
Show Body
Show Body
Famiglia di font, ad esempio “Open Sans”, “Playfair Display”.
Spessore del font, ad esempio 400 o 700. I font variabili supportano pesi precisi come 550.
URL della sorgente del font, ad esempio https://mintlify-assets.b-cdn.net/fonts/Hubot-Sans.woff2. Google Fonts viene caricato automaticamente quando specifichi il nome della
family
di un Google Font, quindi non serve indicare un URL della sorgente.Formato del file del font.
Impostazioni dell’interruttore modalità chiara/scura.
Show Appearance
Show Appearance
Modalità tema predefinita. Scegli
system
per allinearti alle impostazioni del sistema operativo dell’utente, oppure light
o dark
per forzare una modalità specifica. Il valore predefinito è system
.Se nascondere l’interruttore della modalità chiara/scura. Il valore predefinito è
true
.Impostazioni del colore e delle decorazioni dello sfondo.
Show Background
Show Background
Immagine di sfondo del sito. Può essere un singolo file o file separati per le modalità chiara e scura.
Decorazione di sfondo del tema.
Colori di sfondo personalizzati per modalità chiara e scura.
Show Color
Show Color
Struttura
Elementi della barra di navigazione.
Show Navbar
Show Navbar
Link da mostrare nella barra di navigazione
Show Links
Show Links
Testo del link.
URL o percorso della destinazione del link.
L’icona da visualizzare.Opzioni:
- Nome dell’icona Font Awesome
- Nome dell’icona Lucide
- Codice SVG compatibile con JSX racchiuso tra parentesi graffe
- URL di un’icona ospitata esternamente
- Percorso di un file icona nel tuo progetto
- Converti il tuo SVG con il convertitore SVGR.
- Incolla il tuo codice SVG nel campo di input SVG.
- Copia l’elemento completo
<svg>...</svg>
dal campo di output JSX. - Racchiudi il codice SVG compatibile con JSX tra parentesi graffe:
icon={<svg ...> ... </svg>}
. - Regola
height
ewidth
secondo necessità.
Lo stile dell’icona Font Awesome. Utilizzato solo con le icone Font Awesome.Opzioni:
regular
, solid
, light
, thin
, sharp-solid
, duotone
, brands
.Pulsante principale nella barra di navigazione.
Show Primary
Show Primary
Stile del pulsante. Scegli
button
per un pulsante standard con etichetta oppure github
per un link a un repository GitHub con icona.Testo del pulsante. Valido solo quando
type
è button
.Destinazione del pulsante. Deve essere un percorso valido o un URL esterno. Se
type
è github
, deve essere l’URL di un repository GitHub.La struttura di navigazione dei contenuti.
Show Navigation
Show Navigation
Elementi di navigazione globali che compaiono in tutte le pagine e sezioni.
Show Global
Show Global
Configurazione del selettore della lingua per siti localizzati.
Show Lingue
Show Lingue
language
"en" | "cn" | "zh" | "zh-Hans" | "zh-Hant" | "es" | "fr" | "ja" | "jp" | "pt" | "pt-BR" | "de" | "ko" | "it" | "ru" | "id" | "ar" | "tr"
required
Codice della lingua in formato ISO 639-1
Indica se questa è la lingua predefinita.
Indica se nascondere questa opzione di lingua per impostazione predefinita.
Un percorso valido o un collegamento esterno alla versione in questa lingua della documentazione.
Configurazione del selettore di versione per siti con più versioni.
Show Versions
Show Versions
Nome visualizzato della versione.Lunghezza minima: 1
Indica se questa è la versione predefinita.
Indica se nascondere questa opzione di versione per impostazione predefinita.
URL o percorso di questa versione della documentazione.
Schede di navigazione di livello superiore per organizzare le sezioni principali.
Show Schede
Show Schede
Nome visualizzato della scheda.Lunghezza minima: 1
L’icona da visualizzare.Opzioni:
- Nome dell’icona Font Awesome
- Nome dell’icona Lucide
- Codice SVG compatibile con JSX racchiuso tra parentesi graffe
- URL di un’icona ospitata esternamente
- Percorso di un file icona nel tuo progetto
- Converti il tuo SVG con il convertitore SVGR.
- Incolla il tuo codice SVG nel campo di input SVG.
- Copia l’elemento completo
<svg>...</svg>
dal campo di output JSX. - Racchiudi il codice SVG compatibile con JSX tra parentesi graffe:
icon={<svg ...> ... </svg>}
. - Regola
height
ewidth
secondo necessità.
Lo stile dell’icona Font Awesome. Utilizzato solo con le icone Font Awesome.Opzioni:
regular
, solid
, light
, thin
, sharp-solid
, duotone
, brands
.Indica se nascondere questa scheda per impostazione predefinita.
URL o percorso di destinazione della scheda.
Link ancorati che compaiono in evidenza nella navigazione della barra laterale.
Show Anchors
Show Anchors
Nome visualizzato dell’ancora.Lunghezza minima: 1
L’icona da visualizzare.Opzioni:
- Nome dell’icona Font Awesome
- Nome dell’icona Lucide
- Codice SVG compatibile con JSX racchiuso tra parentesi graffe
- URL di un’icona ospitata esternamente
- Percorso di un file icona nel tuo progetto
- Converti il tuo SVG con il convertitore SVGR.
- Incolla il tuo codice SVG nel campo di input SVG.
- Copia l’elemento completo
<svg>...</svg>
dal campo di output JSX. - Racchiudi il codice SVG compatibile con JSX tra parentesi graffe:
icon={<svg ...> ... </svg>}
. - Regola
height
ewidth
secondo necessità.
Lo stile dell’icona Font Awesome. Utilizzato solo con le icone Font Awesome.Opzioni:
regular
, solid
, light
, thin
, sharp-solid
, duotone
, brands
.Colori personalizzati per l’ancora.
Se nascondere questa ancora per impostazione predefinita.
URL o percorso della destinazione dell’ancora.
Menu a discesa per organizzare contenuti correlati.
Show Menu a discesa
Show Menu a discesa
Nome visualizzato del menu a discesa.Lunghezza minima: 1
L’icona da visualizzare.Opzioni:
- Nome dell’icona Font Awesome
- Nome dell’icona Lucide
- Codice SVG compatibile con JSX racchiuso tra parentesi graffe
- URL di un’icona ospitata esternamente
- Percorso di un file icona nel tuo progetto
- Converti il tuo SVG con il convertitore SVGR.
- Incolla il tuo codice SVG nel campo di input SVG.
- Copia l’elemento completo
<svg>...</svg>
dal campo di output JSX. - Racchiudi il codice SVG compatibile con JSX tra parentesi graffe:
icon={<svg ...> ... </svg>}
. - Regola
height
ewidth
secondo necessità.
Lo stile dell’icona Font Awesome. Utilizzato solo con le icone Font Awesome.Opzioni:
regular
, solid
, light
, thin
, sharp-solid
, duotone
, brands
.Se nascondere questo menu a discesa per impostazione predefinita.
URL o percorso della destinazione del menu a discesa.
Selettore della lingua per siti multilingue.
Menu a discesa per raggruppare contenuti correlati.
Impostazioni di interazione utente per gli elementi di navigazione.
Show Interaction
Show Interaction
Controlla il comportamento di navigazione automatica quando si selezionano i gruppi di navigazione. Imposta su
true
per forzare la navigazione alla prima pagina quando un gruppo di navigazione viene espanso. Imposta su false
per evitare la navigazione ed espandere o comprimere soltanto il gruppo. Lascia non impostato per usare il comportamento predefinito del tema.Contenuto del footer e link ai social.
Show Footer
Show Footer
Profili social da mostrare nel footer. Ogni chiave è il nome della piattaforma e ogni valore è l’URL del tuo profilo. Ad esempio:Nomi di proprietà validi:
Copy
Ask AI
{
"x": "https://x.com/mintlify"
}
x
, website
, facebook
, youtube
, discord
, slack
, github
, linkedin
, instagram
, hacker-news
, medium
, telegram
, twitter
, x-twitter
, earth-americas
, bluesky
, threads
, reddit
, podcast
Banner a livello di sito visualizzato in cima alle pagine.
Reindirizzamenti per pagine spostate, rinominate o eliminate.
Menu contestuale per contenuti e integrazioni ottimizzati con l’IA.
Show Contextual
Show Contextual
options
array of "copy" | "view" | "chatgpt" | "claude" | "perplexity" | "mcp" | "cursor" | "vscode"
required
Azioni disponibili nel menu contestuale. La prima opzione appare come predefinita.
copy
: Copia la pagina corrente come Markdown negli appunti.view
: Visualizza la pagina corrente come Markdown in una nuova scheda.chatgpt
: Invia il contenuto della pagina corrente a ChatGPT.claude
: Invia il contenuto della pagina corrente a Claude.perplexity
: Invia il contenuto della pagina corrente a Perplexity.mcp
: Copia negli appunti l’URL del tuo server MCP.cursor
: Installa il tuo server MCP ospitato in Cursor.vscode
: Installa il tuo server MCP ospitato in VSCode.

Il menu contestuale è disponibile solo sui deployment di anteprima e di produzione.
Configurazioni API
Impostazioni per la documentazione API e per l’API playground interattivo.
Show Api
Show Api
File di specifica OpenAPI per generare la documentazione API. Può essere un singolo URL/percorso o un array di URL/percorsi.
File di specifica AsyncAPI per generare la documentazione API. Può essere un singolo URL/percorso o un array di URL/percorsi.
Impostazioni di visualizzazione per i parametri API.
Show Params
Show Params
Se espandere tutti i parametri per impostazione predefinita. Predefinito:
closed
.Configurazioni per le pagine API generate da file MDX.
Show Mdx
Show Mdx
Configurazione del server per le richieste API.
SEO e ricerca
Configurazioni di indicizzazione SEO.
Show SEO
Show SEO
Meta tag aggiunti a ogni pagina. Devono essere coppie chiave-valore valide. Consulta la guida ai meta tag comuni per le opzioni.
Specifica quali pagine i motori di ricerca devono indicizzare. Scegli
navigable
per indicizzare solo le pagine presenti nella navigazione definita in docs.json
, oppure scegli all
per indicizzare tutte le pagine. Valore predefinito: navigable
.Impostazioni di visualizzazione della ricerca.
Show Search
Show Search
Testo segnaposto da mostrare nella barra di ricerca.
Integrazioni
Integrazioni di terze parti.
Show Integrations
Show Integrations
Integrazione con Amplitude Analytics.
Show Amplitude
Show Amplitude
La tua API key di Amplitude.
Integrazione di arricchimento dei dati Clearbit.
Show Clearbit
Show Clearbit
La tua chiave API di Clearbit.
Integrazione con Fathom Analytics.
Show Fathom
Show Fathom
L’ID del tuo sito Fathom.
Integrazione con Front Chat.
Show Front Chat
Show Front Chat
Il tuo ID dello snippet di Front Chat.Lunghezza minima: 6
Integrazione con Google Analytics 4.
Show GA4
Show GA4
Il tuo ID di misurazione di Google Analytics 4.Deve corrispondere al modello: ^G
Integrazione con Google Tag Manager.
Show Gtm
Show Gtm
L’ID del tag di Google Tag Manager.Deve corrispondere al pattern: ^G
Integrazione Intercom.
Show Intercom
Show Intercom
ID dell’app Intercom.Lunghezza minima: 6
Integrazione con Koala.
Show Koala
Show Koala
La tua chiave API pubblica di Koala.Lunghezza minima: 2
Integrazione con LogRocket.
Show LogRocket
Show LogRocket
L’ID dell’app LogRocket.
Integrazione con Mixpanel.
Show Mixpanel
Show Mixpanel
Il token del tuo progetto Mixpanel.
Impostazioni della telemetria.
Show Telemetry
Show Telemetry
Specifica se attivare la telemetria.
Errori
Impostazioni per la gestione degli errori.
Show Errors
Show Errors
Gestione dell’errore 404 “Pagina non trovata”.
Esempi
docs.json
Copy
Ask AI
{
"$schema": "https://mintlify.com/docs.json",
"theme": "maple",
"name": "Example Co.",
"description": "Example Co. è un'azienda che fornisce contenuti di esempio e testo segnaposto.",
"colors": {
"primary": "#3B82F6",
"light": "#F8FAFC",
"dark": "#0F172A"
},
"navigation": {
"dropdowns": [
{
"dropdown": "Documentazione",
"icon": "book",
"description": "Guida all'uso del prodotto Example Co.",
"groups": [
{
"group": "Per iniziare",
"pages": [
"index",
"quickstart"
]
},
{
"group": "Personalizzazione",
"pages": [
"settings",
"users",
"features"
]
},
{
"group": "Fatturazione",
"pages": [
"billing/overview",
"billing/payments",
"billing/subscriptions"
]
}
]
},
{
"dropdown": "Changelog",
"icon": "history",
"description": "Aggiornamenti e modifiche",
"pages": [
"changelog"
]
}
]
},
"logo": {
"light": "/logo-light.svg",
"dark": "/logo-dark.svg",
"href": "https://example.com"
},
"navbar": {
"links": [
{
"label": "Community",
"href": "https://example.com/community"
}
],
"primary": {
"type": "button",
"label": "Inizia",
"href": "https://example.com/start"
}
},
"footer": {
"socials": {
"x": "https://x.com/example",
"linkedin": "https://www.linkedin.com/company/example",
"github": "https://github.com/example",
"slack": "https://example.com/community"
},
"links": [
{
"header": "Risorse",
"items": [
{
"label": "Clienti",
"href": "https://example.com/customers"
},
{
"label": "Enterprise",
"href": "https://example.com/enterprise"
},
{
"label": "Richiedi anteprima",
"href": "https://example.com/preview"
}
]
},
{
"header": "Azienda",
"items": [
{
"label": "Posizioni aperte",
"href": "https://example.com/careers"
},
{
"label": "Blog",
"href": "https://example.com/blog"
},
{
"label": "Informativa sulla privacy",
"href": "https://example.com/legal/privacy"
}
]
}
]
},
"integrations": {
"ga4": {
"measurementId": "G-XXXXXXXXXX"
},
"koala": {
"publicApiKey": "pk_example_key_123"
},
"telemetry": {
"enabled": true
},
"cookies": {
"key": "example_cookie_key",
"value": "example_cookie_value"
}
},
"contextual": {
"options": [
"copy",
"view",
"chatgpt",
"claude"
]
},
"errors": {
"404": {
"redirect": false,
"title": "Impossibile trovare la pagina",
"description": "Che fine ha **fatto** questa _pagina_?"
}
}
}
Aggiornamento da mint.json
mint.json
, segui questi passaggi per passare a docs.json
.
1
Installa o aggiorna la CLI
Se non hai ancora installato la CLI, installala ora:Se la CLI è già installata, assicurati che sia aggiornata:
Copy
Ask AI
npm i -g mint
Copy
Ask AI
mint update
2
Crea il file docs.json
Nel repository della tua documentazione, esegui:Questo comando creerà un file
Copy
Ask AI
mint upgrade
docs.json
a partire dal mint.json
esistente. Controlla il file generato per assicurarti che tutte le impostazioni siano corrette.3
Elimina il file mint.json
Dopo aver verificato che
docs.json
è configurato correttamente, puoi eliminare in sicurezza il vecchio file mint.json
.