i18n(it): Modified everything in the /guides folder (#1456)

Co-authored-by: HiDeoo <494699+HiDeoo@users.noreply.github.com>
Co-authored-by: Chris Swithinbank <swithinbank@gmail.com>

9 files changed, 536 insertions, 223 deletions

diff --git a/docs/src/content/docs/it/guides/authoring-content.md b/docs/src/content/docs/it/guides/authoring-content.md
index 2a905090..01000285 100644
--- a/docs/src/content/docs/it/guides/authoring-content.md
+++ b/docs/src/content/docs/it/guides/authoring-content.md
@@ -7,6 +7,22 @@ Starlight supporta l'intera sintassi [Markdown](https://daringfireball.net/proje
 
 Assicurarsi di guardare la [documentazione MDX](https://mdxjs.com/docs/what-is-mdx/#markdown) o la [documentazione Markdoc](https://markdoc.dev/docs/syntax) se si vogliono usare questi formati, dato che il supporto Markdown può variare.
 
+## Frontmatter
+
+È possibile personalizzare le singole pagine in Starlight impostando i valori nel loro frontmatter.
+Il frontmatter è impostato nella parte superiore dei file tra i separatori `---`:
+
+```md title="src/content/docs/example.md"
+---
+title: Titolo della mia pagina
+---
+
+Il contenuto della pagina segue il secondo `---`.
+```
+
+Ogni pagina deve includere almeno un `title`.
+Consulta il [riferimento al frontmatter](/it/reference/frontmatter/) per tutti i campi disponibili e come aggiungere campi personalizzati.
+
 ## Stili in linea
 
 Il testo può essere **grassetto**, _corsivo_, o ~~barrato~~.
@@ -89,54 +105,55 @@ Posso collegarmi alla [mia conclusione](#conclusione) che si trova più in basso
 
 Titoli di livello 2 (`<h2>`) e di livello 3 (`<h3>`) verranno inclusi automaticamente nella tabella dei contenuti.
 
-## Aside
+Scopri come Astro processa gli `id` di heading nella [documentazione di Astro](https://docs.astro.build/it/guides/markdown-content/#heading-ids)
+
+## Avvisi
 
-Gli aside (conosciuti anche come "ammonizioni" o "richiami") sono utili per indicare contenuti secondari insieme ai contenuti principali.
+Gli avvisi sono utili per indicare contenuti secondari insieme ai contenuti principali.
 
-Starlight fornisce una sintassi Markdown personalizzata per indicarli. I blocchi aside sono indicati da `:::` per racchiudere i contenuti e possono essere di tipo `note`, `tip`, `caution` o `danger`.
+Starlight fornisce una sintassi Markdown personalizzata per indicarli. Gli avvisi sono indicati da `:::` per racchiudere i contenuti e possono essere di tipo `note`, `tip`, `caution` o `danger`.
 
-Dentro un "aside" puoi inserire qualsiasi altro contenuto Markdown anche se sono più indicati per contenere poche informazioni.
+Dentro un avviso puoi inserire qualsiasi altro contenuto Markdown anche se sono più indicati per contenere poche informazioni.
 
-### Note aside
+### Avviso come nota
 
 :::note
 Starlight è uno strumento per siti da documentazione con [Astro](https://astro.build/). Puoi iniziare con questo comando:
 
 ```sh
-npm run create astro@latest -- --template starlight
+npm create astro@latest -- --template starlight
 ```
 
 :::
 
 ````md
 :::note
-Starlight è uno strumento per siti da documentazione con [Astro](https://astro.build/).
-Puoi iniziare con questo comando:
+Starlight è uno strumento per siti da documentazione con [Astro](https://astro.build/). Puoi iniziare con questo comando:
 
 ```sh
-npm run create astro@latest -- --template starlight
+npm create astro@latest -- --template starlight
 ```
 
 :::
 ````
 
-### Titoli aside personalizzati
+### Avvisi con titoli personalizzati
 
-Si può specificare un titolo personalizzato per gli aside in parentesi quadre dopo aver specificato il tipo di aside, per esempio `:::tip[Lo sapevi?]`.
+Si può specificare un titolo personalizzato per gli avvisi in parentesi quadre dopo aver specificato il tipo di avviso, per esempio `:::tip[Lo sapevi?]`.
 
 :::tip[Lo sapevi?]
-Astro ti aiuta a costruire siti più veloci con ["Islands Architecture"](https://docs.astro.build/en/concepts/islands/).
+Astro ti aiuta a costruire siti più veloci con ["Islands Architecture"](https://docs.astro.build/it/concepts/islands/).
 :::
 
 ```md
 :::tip[Lo sapevi?]
-Astro ti aiuta a costruire siti più veloci con ["Islands Architecture"](https://docs.astro.build/en/concepts/islands/).
+Astro ti aiuta a costruire siti più veloci con ["Islands Architecture"](https://docs.astro.build/it/concepts/islands/).
 :::
 ```
 
-### Altri tipi di aside
+### Altri tipi di avvisi
 
-Gli aside caution e danger sono d'aiuto per richiamare l'attenzione dell'utente a dettagli che potrebbero sorprenderli.
+Gli avvisi `caution` e `danger` sono d'aiuto per richiamare l'attenzione dell'utente a dettagli che potrebbero sorprenderli.
 Se ti ritrovi ad usarli spesso, potrebbe essere segno che quelo che stai documentando potrebbe trarre beneficio da una riprogettazione.
 
 :::caution
@@ -179,7 +196,7 @@ Gli utenti potrebbero essere più produttivi e trovare il tuo prodotto più faci
 > I blockquote sono indicati da `>` all'inizio di ogni riga.
 ```
 
-## Blocchi codice
+## Blocco di codice
 
 Un blocco di codice è indicato da tre backtick <code>```</code> all'inizio e alla fine. Puoi indicare il linguaggio di programmazione dopo i primi backtick.
 
@@ -201,10 +218,153 @@ var fun = function lang(l) {
 ```
 ````
 
-```md
-I blocchi lunghi su una linea sola non vanno a capo. Se sono troppo lunghi si può scrollare orizzontalmente. Questo dovrebbe essere abbastanza lungo per dimostrarlo.
-```
+### Funzionalità di Expressive Code
+
+Starlight utilizza [Expressive Code](https://github.com/expressive-code/expressive-code/tree/main/packages/astro-expressive-code) per estendere le possibilità di formattazione dei blocchi di codice.
+I plugin di marcatori di testo e cornici per finestre di Expressive Code sono abilitati per impostazione predefinita.
+La resa dei blocchi di codice può essere configurata utilizzando [l'opzione di configurazione `expressiveCode`](/it/reference/configuration/#expressivecode) di Starlight.
+
+#### Marcatori di testo
+
+È possibile evidenziare linee specifiche o parti dei blocchi di codice utilizzando i [marcatori di testo di Expressive Code](https://github.com/expressive-code/expressive-code/blob/main/packages/%40expressive-code/plugin-text-markers/README.md#usage-in-markdown--mdx-documents) sulla riga di apertura del blocco di codice.
+Utilizzare le parentesi graffe (`{ }`) per evidenziare intere linee e virgolette per evidenziare stringhe di testo.
+
+Ci sono tre stili di evidenziazione: neutro per attirare l'attenzione sul codice, verde per indicare il codice inserito e rosso per indicare il codice eliminato.
+Sia il testo che intere linee possono essere contrassegnati utilizzando il marcatore predefinito, o in combinazione con `ins=` e `del=` per produrre l'evidenziazione desiderata.
+
+Expressive Code fornisce diverse opzioni per personalizzare l'aspetto visivo dei tuoi esempi di codice.
+Molte di queste possono essere combinate, per esempi di codice altamente illustrativi.
+Si prega di esplorare la [documentazione di Expressive Code](https://github.com/expressive-code/expressive-code/blob/main/packages/%40expressive-code/plugin-text-markers/README.md) per le numerose opzioni disponibili.
+Di seguito sono mostrati alcuni degli esempi più comuni:
+
+- [Contrassegnare linee intere e intervalli di linee utilizzando il marcatore `{ }`](https://github.com/expressive-code/expressive-code/blob/main/packages/%40expressive-code/plugin-text-markers/README.md#marking-entire-lines--line-ranges):
+
+  ```js {2-3}
+  function demo() {
+    // Questa linea (#2) e la successiva sono evidenziate
+    return 'Questa è la linea #3 di questo snippet';
+  }
+  ```
+
+  ````md
+  ```js {2-3}
+  function demo() {
+    // Questa linea (#2) e la successiva sono evidenziate
+    return 'Questa è la linea #3 di questo snippet';
+  }
+  ```
+  ````
+
+- [Contrassegnare selezioni di testo utilizzando il marcatore `" "` o espressioni regolari](https://github.com/expressive-code/expressive-code/blob/main/packages/%40expressive-code/plugin-text-markers/README.md#marking-individual-text-inside-lines):
+
+  ```js "termini individuali" /Anche.*supportate/
+  // Anche i termini individuali possono essere evidenziati
+  function demo() {
+    return 'Anche le espressioni regolari sono supportate';
+  }
+  ```
+
+  ````md
+  ```js "termini individuali" /Anche.*supportate/
+  // Anche i termini individuali possono essere evidenziati
+  function demo() {
+    return 'Anche le espressioni regolari sono supportate';
+  }
+  ```
+  ````
+
+- [Contrassegnare testi o linee come inseriti o eliminati con `ins` o `del`](https://github.com/expressive-code/expressive-code/blob/main/packages/%40expressive-code/plugin-text-markers/README.md#selecting-marker-types-mark-ins-del):
+
+  ```js "return true;" ins="inseriti" del="eliminati"
+  function demo() {
+    console.log('Questi sono tipi di marcatore inseriti ed eliminati');
+    // La dichiarazione di ritorno utilizza il tipo di marcatore predefinito
+    return true;
+  }
+  ```
+
+  ````md
+  ```js "return true;" ins="inseriti" del="eliminati"
+  function demo() {
+    console.log('Questi sono tipi di marcatore inseriti ed eliminati');
+    // La dichiarazione di ritorno utilizza il tipo di marcatore predefinito
+    return true;
+  }
+  ```
+  ````
+
+- [Combina l'evidenziazione della sintassi con una sintassi simile a `diff`](https://github.com/expressive-code/expressive-code/blob/main/packages/%40expressive-code/plugin-text-markers/README.md#combining-syntax-highlighting-with-diff-like-syntax):
+
+  ```diff lang="js"
+    function thisIsJavaScript() {
+      // Questo intero blocco viene evidenziato come JavaScript,
+      // e possiamo comunque aggiungere marcatori diff ad esso!
+  -   console.log('Vecchio codice da rimuovere')
+  +   console.log('Nuovo e splendido codice!')
+    }
+  ```
+
+  ````md
+  ```diff lang="js"
+    function thisIsJavaScript() {
+      // Questo intero blocco viene evidenziato come JavaScript,
+      // e possiamo comunque aggiungere marcatori diff ad esso!
+  -   console.log('Vecchio codice da rimuovere')
+  +   console.log('Nuovo e splendido codice!')
+    }
+  ```
+  ````
+
+#### Frame e titoli
+
+I blocchi di codice possono essere visualizzati all'interno di un frame simile a una finestra.
+Un frame che assomiglia a una finestra del terminale verrà utilizzato per i linguaggi di scripting della shell (ad esempio `bash` o `sh`).
+Altri linguaggi vengono visualizzati all'interno di un frame simile a un editor di codice se includono un titolo.
+
+Il titolo opzionale di un blocco di codice può essere impostato sia con un attributo `title="..."` che segue l'identificatore del linguaggio e le backticks di apertura del blocco di codice, sia con un commento del nome del file nelle prime righe del codice.
+
+- [Aggiungi una scheda con il nome del file con un commento](https://github.com/expressive-code/expressive-code/blob/main/packages/%40expressive-code/plugin-frames/README.md#adding-titles-open-file-tab-or-terminal-window-title)
+
+  ```js
+  // my-test-file.js
+  console.log('Ciao mondo!');
+  ```
+
+  ````md
+  ```js
+  // my-test-file.js
+  console.log('Ciao mondo!');
+  ```
+  ````
+
+- [Aggiungi un titolo a una finestra del terminale](https://github.com/expressive-code/expressive-code/blob/main/packages/%40expressive-code/plugin-frames/README.md#adding-titles-open-file-tab-or-terminal-window-title)
+
+  ```bash title="Installando dipendenze..."
+  npm install
+  ```
+
+  ````md
+  ```bash title="Installando dipendenze..."
+  npm install
+  ```
+  ````
+
+- [Disabilita i frame delle finestre con `frame="none"`](https://github.com/expressive-code/expressive-code/blob/main/packages/%40expressive-code/plugin-frames/README.md#overriding-frame-types)
+
+  ```bash frame="none"
+  echo "Questo non verrà mostrato come un terminale nonostante stia usando bash come linguaggio"
+  ```
+
+  ````md
+  ```bash frame="none"
+  echo "Questo non verrà mostrato come un terminale nonostante stia usando bash come linguaggio"
+  ```
+  ````
 
 ## Altre funzionalità Markdown utili
 
 Starlight supporta tutte le altre funzionalità Markdown, come liste e tabelle. Guarda la [Markdown Cheat Sheet da The Markdown Guide](https://www.markdownguide.org/cheat-sheet/) per una panoramica veloce su tutte le funzionalità Markdown.
+
+## Configurazione avanzata di Markdown e MDX
+
+Starlight utilizza il renderer Markdown e MDX di Astro costruito su remark e rehype. Puoi aggiungere supporto per la sintassi e il comportamento personalizzati aggiungendo `remarkPlugins` o `rehypePlugins` nel file di configurazione di Astro. Vedi [“Configuring Markdown and MDX”](https://docs.astro.build/it/guides/markdown-content/#configuring-markdown-and-mdx) nella documentazione di Astro per saperne di più.
diff --git a/docs/src/content/docs/it/guides/components.mdx b/docs/src/content/docs/it/guides/components.mdx
index 881d2271..9065664d 100644
--- a/docs/src/content/docs/it/guides/components.mdx
+++ b/docs/src/content/docs/it/guides/components.mdx
@@ -7,7 +7,7 @@ I componenti permettono di riutilizzare un elemento UI o altro ripetutamente.
 Degli esempi potrebbero essere delle sezioni di link o un video YouTube integrato.
 Starlight supporta l'utilizzo di questi nei file [MDX](https://mdxjs.com/) e fornisce dei componenti per te già pronti.
 
-[Vedi di più sulla costruzione di componenti nella documentazione Astro](https://docs.astro.build/en/core-concepts/astro-components/).
+[Vedi di più sulla costruzione di componenti nella documentazione Astro](https://docs.astro.build/it/core-concepts/astro-components/).
 
 ## Utilizzare un componente
 
@@ -16,29 +16,44 @@ Questi possono ricordare dei tag HTML ma iniziano con una maiuscola:
 
 ```mdx
 ---
-# src/content/docs/index.mdx
+# src/content/docs/example.mdx
 title: Benvenuto nella mia documentazione
 ---
 
 import SomeComponent from '../../components/SomeComponent.astro';
 import AnotherComponent from '../../components/AnotherComponent.astro';
 
-<SomeComponent prop="something" />
+<SomeComponent prop="qualcosa" />
 
 <AnotherComponent>
 	I componenti possono avere **contenuti interni**.
 </AnotherComponent>
 ```
 
-Siccome Starlight è integrato con Astro, puoi aggiungere componenti costruiti con qualsiasi [UI framework supportato (React, Preact, Svelte, Vue, Solid, Lit, and Alpine)](https://docs.astro.build/en/core-concepts/framework-components/).
-Vedi di più su come [usare componenti in MDX](https://docs.astro.build/en/guides/markdown-content/#using-components-in-mdx) nella documentazione Astro.
+Siccome Starlight è integrato con Astro, puoi aggiungere componenti costruiti con qualsiasi [UI framework supportato (React, Preact, Svelte, Vue, Solid, Lit, and Alpine)](https://docs.astro.build/it/core-concepts/framework-components/).
+Vedi di più su come [usare componenti in MDX](https://docs.astro.build/it/guides/markdown-content/#using-components-in-mdx) nella documentazione Astro.
+
+### Compatibilità con gli stili di Starlight
+
+Starlight applica stili predefiniti al tuo contenuto Markdown, ad esempio aggiungendo margini tra gli elementi.
+Se questi stili entrano in conflitto con l'aspetto del tuo componente, imposta la classe `not-content` sul tuo componente per disabilitarli.
+
+```astro 'class="not-content"'
+---
+// src/components/Example.astro
+---
+
+<div class="not-content">
+	<p>Non influenzato dallo stile predefinito del contenuto di Starlight.</p>
+</div>
+```
 
 ## Componenti integrati
 
 Starlight fornisce dei componenti per casi comuni in una documentazione.
 Questi sono disponibili nel pacchetto `@astrojs/starlight/components`.
 
-### Tabs
+### Schede
 
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 
@@ -46,6 +61,8 @@ Puoi rappresentare contenuti con un'interfaccia a schede con i componenti `<Tabs
 Ogni `<TabItem>` deve avere un `label` per indicare la scheda corrispondente.
 
 ```mdx
+# src/content/docs/example.mdx
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 
 <Tabs>
@@ -54,6 +71,8 @@ import { Tabs, TabItem } from '@astrojs/starlight/components';
 </Tabs>
 ```
 
+Il codice precedente genera quanto segue nella pagina:
+
 <Tabs>
 	<TabItem label="Stelle">Sirius, Vega, Betelgeuse</TabItem>
 	<TabItem label="Lune">Io, Europa, Ganymede</TabItem>
@@ -66,9 +85,11 @@ import { Card, CardGrid } from '@astrojs/starlight/components';
 Puoi rappresentare i contenuti in un riquadro che rispecchia il tema Starlight usando il componente `<Card>`.
 Racchiudi più card in `<CardGrid>` per visualizzarle fianco a fianco se c'è abbastanza spazio.
 
-Una `<Card>` necessita di `title` e può avere eventualmente un attributo `icon` impostato ad [una delle icone Starlight](https://github.com/withastro/starlight/blob/main/packages/starlight/components/Icons.ts).
+Una `<Card>` necessita di `title` e può avere eventualmente un attributo `icon` impostato ad [una delle icone Starlight](#tutte-le-icone).
 
 ```mdx
+# src/content/docs/example.mdx
+
 import { Card, CardGrid } from '@astrojs/starlight/components';
 
 <Card title="Guarda qui">Contenuti interessanti da evidenziare.</Card>
@@ -83,6 +104,8 @@ import { Card, CardGrid } from '@astrojs/starlight/components';
 </CardGrid>
 ```
 
+Il codice precedente genera quanto segue nella pagina:
+
 <Card title="Guarda qui">Contenuti interessanti da evidenziare.</Card>
 
 <CardGrid>
@@ -94,7 +117,7 @@ import { Card, CardGrid } from '@astrojs/starlight/components';
 	</Card>
 </CardGrid>
 
-:::tip[Suggerimento]
+:::tip
 Usa la griglia nella pagina principale per evidenziare le funzionalità chiave del progetto.
 Aggiungi l'attributo `stagger` per rappresentare la seconda colonna più in basso per rendere il tutto più interessante:
 
@@ -106,26 +129,28 @@ Aggiungi l'attributo `stagger` per rappresentare la seconda colonna più in bass
 
 :::
 
-### LinkCard
+### Card con link
 
 Utilizza il componente `<LinkCard>` per collegare in modo visibile pagine diverse.
 
-Una `<LinkCard>` richiede un `title` e un attributo [`href`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#href). Facoltativamente puoi includere una breve `description` o altri attributi del collegamento come `target`.
+Una `<LinkCard>` richiede un `title` e un attributo [`href`](https://developer.mozilla.org/it/docs/Web/HTML/Element/a#href). Facoltativamente puoi includere una breve `description` o altri attributi del collegamento come `target`.
 
 Raggruppa più componenti `<LinkCard>` in `<CardGrid>` per visualizzare le schede una accanto all'altra quando c'è spazio sufficiente.
 
 ```mdx
+# src/content/docs/example.mdx
+
 import { LinkCard, CardGrid } from '@astrojs/starlight/components';
 
 <LinkCard
-	title="Customizing Starlight"
-	description="Learn how to make your Starlight site your own with custom styles, fonts, and more."
-	href="/guides/customization/"
+	title="Personalizzazione di Starlight"
+	description="Scopri come rendere il tuo sito Starlight unico con stili personalizzati, caratteri e altro."
+	href="/it/guides/customization/"
 />
 
 <CardGrid>
-	<LinkCard title="Authoring Markdown" href="/guides/authoring-content/" />
-	<LinkCard title="Components" href="/guides/components/" />
+	<LinkCard title="Creazione di Markdown" href="/it/guides/authoring-content/" />
+	<LinkCard title="Componenti" href="/it/guides/components/" />
 </CardGrid>
 ```
 
@@ -134,37 +159,85 @@ Il codice precedente genera quanto segue nella pagina:
 import { LinkCard } from '@astrojs/starlight/components';
 
 <LinkCard
-	title="Customizing Starlight"
-	description="Learn how to make your Starlight site your own with custom styles, fonts, and more."
-	href="/guides/customization/"
+	title="Personalizzazione di Starlight"
+	description="Scopri come rendere il tuo sito Starlight unico con stili personalizzati, caratteri e altro."
+	href="/it/guides/customization/"
 />
 
 <CardGrid>
-	<LinkCard title="Authoring Markdown" href="/guides/authoring-content/" />
-	<LinkCard title="Components" href="/guides/components/" />
+	<LinkCard title="Creazione di Markdown" href="/it/guides/authoring-content/" />
+	<LinkCard title="Componenti" href="/it/guides/components/" />
 </CardGrid>
 
-### Icon
+### Icone
 
 import { Icon } from '@astrojs/starlight/components';
 import IconsList from '~/components/icons-list.astro';
 
 Starlight fornisce una serie di icone comuni che puoi visualizzare nei tuoi contenuti utilizzando il componente `<Icon>`.
 
-Ogni `<Icon>` richiede un [`name`](#all-icons) e può facoltativamente includere un attributo `label`, `size` e `color`.
+Ogni `<Icon>` richiede un [`name`](#tutte-le-icone) e può facoltativamente includere un attributo `label`, `size` e `color`.
 
 ```mdx
+# src/content/docs/example.mdx
+
 import { Icon } from '@astrojs/starlight/components';
 
 <Icon name="star" color="goldenrod" size="2rem" />
 ```
 
-Il codice sopra genera quanto segue nella pagina:
+Il codice precedente genera quanto segue nella pagina:
 
 <Icon name="star" color="goldenrod" size="2rem" />
 
-#### All icons
+#### Tutte le icone
 
 Di seguito è riportato un elenco di tutte le icone disponibili con i nomi associati. Fare clic su un'icona per copiarne il codice componente.
 
 <IconsList />
+
+### Codice
+
+Utilizza il componente `<Code>` per visualizzare il codice sintatticamente evidenziato quando l'utilizzo di un [blocco di codice Markdown](/it/guides/authoring-content/#blocco-di-codice) non è possibile, ad esempio, per visualizzare dati provenienti da fonti esterne come file, database o API.
+
+Consulta la documentazione completa del componente ["Code Component" di Expressive Code](https://expressive-code.com/key-features/code-component/) per maggiori informazioni sulle proprietà supportate da `<Code>`.
+
+```mdx
+# src/content/docs/example.mdx
+
+import { Code } from '@astrojs/starlight/components';
+
+export const exampleCode = `console.log('Questo potrebbe provenire da un file o da un CMS!');`;
+export const fileName = 'example.js';
+export const highlights = ['file', 'CMS'];
+
+<Code code={exampleCode} lang="js" title={fileName} mark={highlights} />
+```
+
+Il codice sopra genera quanto segue nella pagina:
+
+import { Code } from '@astrojs/starlight/components';
+
+export const exampleCode = `console.log('Questo potrebbe provenire da un file o da un CMS!');`;
+export const fileName = 'example.js';
+export const highlights = ['file', 'CMS'];
+
+<Code code={exampleCode} lang="js" title={fileName} mark={highlights} />
+
+#### Codice Importato
+
+Utilizza il [suffisso `?raw` dell'importazione con Vite](https://vitejs.dev/guide/assets#importing-asset-as-string) per importare qualsiasi file di codice come stringa.
+Poi puoi passare questa stringa importata al componente `<Code>` per includerla nella tua pagina.
+
+```mdx title="src/content/docs/example.mdx" "?raw"
+import { Code } from '@astrojs/starlight/components';
+import importedCode from '/src/env.d.ts?raw';
+
+<Code code={importedCode} lang="ts" title="src/env.d.ts" />
+```
+
+Il codice sopra genera quanto segue nella pagina:
+
+import importedCode from '/src/env.d.ts?raw';
+
+<Code code={importedCode} lang="ts" title="src/env.d.ts" />
diff --git a/docs/src/content/docs/it/guides/css-and-tailwind.mdx b/docs/src/content/docs/it/guides/css-and-tailwind.mdx
index 05b8285f..12477b7f 100644
--- a/docs/src/content/docs/it/guides/css-and-tailwind.mdx
+++ b/docs/src/content/docs/it/guides/css-and-tailwind.mdx
@@ -22,7 +22,7 @@ Personalizza gli stili applicati al tuo sito Starlight fornendo file CSS aggiunt
 
 2. Aggiungi il percorso del tuo file CSS all'array `customCss` di Starlight in `astro.config.mjs`:
 
-   ```js
+   ```diff lang="js"
    // astro.config.mjs
    import { defineConfig } from 'astro/config';
    import starlight from '@astrojs/starlight';
@@ -30,10 +30,10 @@ Personalizza gli stili applicati al tuo sito Starlight fornendo file CSS aggiunt
    export default defineConfig({
    	integrations: [
    		starlight({
-   			title: 'Docs With Custom CSS',
+   			title: 'Docs con CSS personalizzato',
    			customCss: [
-   				// Percorso relativo al tuo file CSS personalizzato
-   				'./src/styles/custom.css',
+   +				// Percorso relativo al tuo file CSS personalizzato
+   +				'./src/styles/custom.css',
    			],
    		}),
    	],
@@ -44,7 +44,7 @@ Puoi vedere tutte le proprietà personalizzate CSS utilizzate da Starlight che p
 
 ## CSS Tailwind
 
-Il supporto CSS Tailwind nei progetti Astro è fornito dall'[integrazione Astro Tailwind](https://docs.astro.build/en/guides/integrations-guide/tailwind/).
+Il supporto CSS Tailwind nei progetti Astro è fornito dall'[integrazione Astro Tailwind](https://docs.astro.build/it/guides/integrations-guide/tailwind/).
 Starlight fornisce un plug-in Tailwind complementare per aiutare a configurare Tailwind per la compatibilità con gli stili di Starlight.
 
 Il plugin Starlight Tailwind applica la seguente configurazione:
@@ -89,110 +89,110 @@ Se hai già un sito Starlight e desideri aggiungere Tailwind CSS, segui questi p
 
 1. Aggiungi l'integrazione Tailwind di Astro:
 
-   <Tabs>
+    <Tabs>
 
-   <TabItem label="npm">
+    <TabItem label="npm">
 
-   ```sh
-   npx astro add tailwind
-   ```
+    ```sh
+    npx astro add tailwind
+    ```
 
-   </TabItem>
+    </TabItem>
 
-   <TabItem label="pnpm">
+    <TabItem label="pnpm">
 
-   ```sh
-   pnpm astro add tailwind
-   ```
+    ```sh
+    pnpm astro add tailwind
+    ```
 
-   </TabItem>
+    </TabItem>
 
-   <TabItem label="Yarn">
+    <TabItem label="Yarn">
 
-   ```sh
-   yarn astro add tailwind
-   ```
+    ```sh
+    yarn astro add tailwind
+    ```
 
-   </TabItem>
+    </TabItem>
 
-   </Tabs>
+    </Tabs>
 
 2. Installa il plugin Starlight Tailwind:
 
-   <Tabs>
+    <Tabs>
 
-   <TabItem label="npm">
+    <TabItem label="npm">
 
-   ```sh
-   npm install @astrojs/starlight-tailwind
-   ```
+    ```sh
+    npm install @astrojs/starlight-tailwind
+    ```
 
-   </TabItem>
+    </TabItem>
 
-   <TabItem label="pnpm">
+    <TabItem label="pnpm">
 
-   ```sh
-   pnpm add @astrojs/starlight-tailwind
-   ```
+    ```sh
+    pnpm add @astrojs/starlight-tailwind
+    ```
 
-   </TabItem>
+    </TabItem>
 
-   <TabItem label="Yarn">
+    <TabItem label="Yarn">
 
-   ```sh
-   yarn add @astrojs/starlight-tailwind
-   ```
+    ```sh
+    yarn add @astrojs/starlight-tailwind
+    ```
 
-   </TabItem>
+    </TabItem>
 
-   </Tabs>
+    </Tabs>
 
 3. Crea un file CSS per gli stili di base di Tailwind, ad esempio in `src/tailwind.css`:
 
-   ```css
-   /* src/tailwind.css */
-   @tailwind base;
-   @tailwind components;
-   @tailwind utilities;
-   ```
+    ```css
+    /* src/tailwind.css */
+    @tailwind base;
+    @tailwind components;
+    @tailwind utilities;
+    ```
 
 4. Aggiorna il file di configurazione Astro per utilizzare gli stili di base Tailwind e disabilitare gli stili di base predefiniti:
 
-   ```js {11-12,16-17}
-   // astro.config.mjs
-   import { defineConfig } from 'astro/config';
-   import starlight from '@astrojs/starlight';
-   import tailwind from '@astrojs/tailwind';
-
-   export default defineConfig({
-   	integrations: [
-   		starlight({
-   			title: 'Docs with Tailwind',
-   			customCss: [
-   				// Percorso per gli stili di base di Tailwind
-   				'./src/tailwind.css',
-   			],
-   		}),
-   		tailwind({
-   			// Disattiva gli stili di base predefiniti
-   			applyBaseStyles: false,
-   		}),
-   	],
-   });
-   ```
+    ```js {11-12,16-17}
+    // astro.config.mjs
+    import { defineConfig } from 'astro/config';
+    import starlight from '@astrojs/starlight';
+    import tailwind from '@astrojs/tailwind';
+
+    export default defineConfig({
+    	integrations: [
+    		starlight({
+    			title: 'Docs con Tailwind',
+    			customCss: [
+    				// Percorso per gli stili di base di Tailwind
+    				'./src/tailwind.css',
+    			],
+    		}),
+    		tailwind({
+    			// Disattiva gli stili di base predefiniti
+    			applyBaseStyles: false,
+    		}),
+    	],
+    });
+    ```
 
 5. Aggiungi il plugin Starlight Tailwind a `tailwind.config.cjs`:
 
-   ```js ins={2,7}
-   // tailwind.config.cjs
-   const starlightPlugin = require('@astrojs/starlight-tailwind');
+    ```js ins={2,7}
+    // tailwind.config.mjs
+    import starlightPlugin from '@astrojs/starlight-tailwind';
 
-   /** @type {import('tailwindcss').Config} */
-   module.exports = {
-   	content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
-   	plugins: [starlightPlugin()],
-   };
-   ```
+    /** @type {import('tailwindcss').Config} */
+    export default {
+    	content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
+    	plugins: [starlightPlugin()],
+    };
+    ```
 
 ### Styling di Starlight con Tailwind
 
@@ -206,26 +206,25 @@ Se impostate, le seguenti opzioni sovrascriveranno gli stili predefiniti di Star
 - `fontFamily.mono` — utilizzato per esempi di codice
 
 ```js {12,14,18,20}
-// tailwind.config.cjs
-const starlightPlugin = require('@astrojs/starlight-tailwind');
-const colors = require('tailwindcss/colors');
+// tailwind.config.mjs
+import starlightPlugin from '@astrojs/starlight-tailwind';
+import colors from 'tailwindcss/colors';
 
 /** @type {import('tailwindcss').Config} */
-module.exports = {
+export default {
 	content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
 	theme: {
 		extend: {
 			colors: {
-				// Il tuo colore preferito. Indigo è il più vicino alle impostazioni predefinite di Starlight.
+				// Il tuo colore accent preferito. Indigo è il più vicino ai valori predefiniti di Starlight.
 				accent: colors.indigo,
-				// La tua scala di grigi preferita. Lo zinco è il più vicino ai valori predefiniti di Starlight.
+				// La tua scala di grigi preferita. Zinc è la più vicina ai valori predefiniti di Starlight.
 				gray: colors.zinc,
 			},
 			fontFamily: {
+				// Il tuo font di testo preferito. Starlight utilizza di default una pila di font di sistema.
 				sans: ['"Atkinson Hyperlegible"'],
-				// Il tuo carattere di testo preferito. Starlight utilizza uno stack di caratteri di sistema per impostazione predefinita.
-				sans: ['"Atkinson Hyperlegible"'],
-				// Il tuo carattere di codice preferito. Starlight utilizza i caratteri di sistema a spaziatura fissa per impostazione predefinita.
+				// Il tuo font di codice preferito. Starlight utilizza di default font monospace di sistema.
 				mono: ['"IBM Plex Mono"'],
 			},
 		},
@@ -282,9 +281,8 @@ import ThemeDesigner from '~/components/theme-designer.astro';
 		CSS](#stili-css-personalizzati) per applicare questo tema al tuo sito.
 	</Fragment>
 	<Fragment slot="tailwind-docs">
-		L'esempio [file di configurazione di
-		Tailwind](#styling-di-starlight-con-tailwind) di seguito include tavolozze
-		di colori `accent` e `gray` generate da utilizzare in Oggetto di
-		configurazione `theme.extend.colors`.
+		L'esempio [file di configurazione di Tailwind](#styling-di-starlight-con-tailwind) di seguito
+		include tavolozze di colori `accent` e `gray` generate da utilizzare in
+		Oggetto di configurazione `theme.extend.colors`.
 	</Fragment>
 </ThemeDesigner>
diff --git a/docs/src/content/docs/it/guides/customization.mdx b/docs/src/content/docs/it/guides/customization.mdx
index 5cca655e..50961013 100644
--- a/docs/src/content/docs/it/guides/customization.mdx
+++ b/docs/src/content/docs/it/guides/customization.mdx
@@ -27,7 +27,7 @@ L'aggiunta di un logo personalizzato all'intestazione del sito è un modo rapido
 
 2. Aggiungi il percorso del tuo logo come opzione [`logo.src`](/it/reference/configuration/#logo) di Starlight in `astro.config.mjs`:
 
-   ```js
+   ```diff lang="js"
    // astro.config.mjs
    import { defineConfig } from 'astro/config';
    import starlight from '@astrojs/starlight';
@@ -37,7 +37,7 @@ L'aggiunta di un logo personalizzato all'intestazione del sito è un modo rapido
    		starlight({
    			title: 'Documentazione con il mio logo',
    			logo: {
-   				src: './src/assets/my-logo.svg',
+   +				src: './src/assets/my-logo.svg',
    			},
    		}),
    	],
@@ -48,7 +48,7 @@ Per impostazione predefinita, il logo verrà visualizzato accanto al `title` del
 Se l'immagine del tuo logo include già il titolo del sito, puoi nascondere visivamente il testo del titolo impostando l'opzione `replacesTitle`.
 Il testo del `title` verrà comunque incluso per gli screen reader in modo che l'intestazione rimanga accessibile.
 
-```js
+```js {5}
 starlight({
   title: 'Documentazione con il mio logo',
   logo: {
@@ -77,21 +77,21 @@ Puoi visualizzare diverse versioni del tuo logo in modalità chiara e scura.
 
 2. Aggiungi il percorso alle varianti del tuo logo come opzioni `light` e `dark` invece di `src` in `astro.config.mjs`:
 
-   ```js
+   ```diff lang="js"
    starlight({
      title: 'Documentazione con il mio logo',
      logo: {
-       light: './src/assets/light-logo.svg',
-       dark: './src/assets/dark-logo.svg',
+   +    light: './src/assets/light-logo.svg',
+   +    dark: './src/assets/dark-logo.svg',
      },
    }),
    ```
 
-## Enable sitemap
+## Abilita la mappa del sito
 
 Starlight ha il supporto integrato per la generazione di una mappa del sito. Abilita la generazione della mappa del sito impostando il tuo URL come `site` in `astro.config.mjs`:
 
-```js
+```js {4}
 // astro.config.mjs
 
 export default defineConfig({
@@ -107,7 +107,7 @@ Per impostazione predefinita, le pagine Starlight utilizzano un layout con una b
 Puoi applicare un layout di pagina più ampio senza barre laterali impostando [`template: splash`](/it/reference/frontmatter/#template) nel frontmatter di una pagina.
 Funziona particolarmente bene per le pagine di destinazione e puoi vederlo in azione sulla [home page di questo sito](/it/).
 
-```md
+```md {5}
 ---
 # src/content/docs/index.md
 
@@ -126,7 +126,7 @@ Per impostazione predefinita, le intestazioni `<h2>` e `<h3>` sono incluse nell'
 <Tabs>
   <TabItem label="Frontmatter">
 
-```md
+```md {4-6}
 ---
 # src/content/docs/example.md
 title: Pagina con solo H2 nell'indice dei contenuti
@@ -139,63 +139,62 @@ summary:
   </TabItem>
   <TabItem label="Configurazione globale">
 
-```js
+```js {7}
 // astro.config.mjs
 
 defineConfig({
 	integrations: [
 		starlight({
-			title: '',
+			title: 'Documentazione con configurazione personalizzata dell\'indice',
 			tableOfContents: { minHeadingLevel: 2, maxHeadingLevel: 2 },
 		}),
 	],
 });
 ```
 
-   </TabItem>
+  </TabItem>
 </Tabs>
 
 Disabilita completamente l'indice dei contenuti impostando l'opzione `tableOfContents` su `false`:
 
 <Tabs>
-   <TabItem label="Frontmatter">
+  <TabItem label="Frontmatter">
 
-```md
+```md {4}
 ---
-# src/content/docs/esempio.md
+# src/content/docs/example.md
 title: Pagina senza indice dei contenuti
 tableOfContents: false
 ---
 ```
 
-   </TabItem>
-   <TabItem label="Configurazione globale">
+  </TabItem>
+  <TabItem label="Configurazione globale">
 
-```js
+```js {7}
 // astro.config.mjs
 
 defineConfig({
 	integrations: [
 		starlight({
-			title:
-				'Documentazione con indice dei contenuti disabilitato a livello globale',
+			title: 'Documentazione con indice dei contenuti disabilitato a livello globale',
 			tableOfContents: false,
 		}),
 	],
 });
 ```
 
-   </TabItem>
+  </TabItem>
 </Tabs>
 
 ## Collegamenti social
 
 Starlight dispone del supporto integrato per aggiungere collegamenti ai tuoi account di social media all'intestazione del sito tramite l'opzione [`social`](/it/reference/configuration/#social) nell'integrazione Starlight.
 
-Attualmente sono supportati i collegamenti a Bitbucket, Codeberg, CodePen, Discord, Email, Facebook, GitHub, GitLab, Gitter, Instagram, LinkedIn, Mastodon, Microsoft Teams, Stack Overflow, Threads, Twitch, Twitter e Youtube.
+Puoi trovare un elenco completo delle icone dei link supportate nella [Referenza della Configurazione](/it/reference/configuration/#social).
 Facci sapere su GitHub o Discord se hai bisogno di supporto per un altro servizio!
 
-```js
+```js {9-12}
 // astro.config.mjs
 import { defineConfig } from 'astro/config';
 import starlight from '@astrojs/starlight';
@@ -231,7 +230,7 @@ Se il tuo progetto Starlight non è nella radice del tuo repository, includi il
 
 Questo esempio mostra il collegamento di modifica configurato per i documenti Starlight, che si trovano nella sottodirectory `docs/` sul ramo `main` del repository `withastro/starlight` su GitHub:
 
-```js
+```js {9-11}
 // astro.config.mjs
 import { defineConfig } from 'astro/config';
 import starlight from '@astrojs/starlight';
@@ -266,8 +265,9 @@ Puoi personalizzarlo aggiungendo un file `404.md` (o `404.mdx`) alla tua directo
 
 Puoi utilizzare tutto il layout di pagina e le tecniche di personalizzazione di Starlight nella tua pagina 404. Ad esempio, la pagina 404 predefinita utilizza il componente [`splash` template](#layout-della-pagina) e [`hero`](/it/reference/frontmatter/#hero) in frontmatter:
 
-```md
+```md {4,6-8}
 ---
+# src/content/docs/404.md
 title: '404'
 template: splash
 editUrl: false
@@ -277,6 +277,25 @@ hero:
 ---
 ```
 
+### Disabilitare la pagina 404 predefinita
+
+Se il tuo progetto richiede un layout della pagina 404 completamente personalizzato, puoi creare `src/pages/404.astro` e impostare l'opzione di configurazione [`disable404Route`](/it/reference/configuration/#disable404route) per disabilitare la route predefinita di Starlight:
+
+```js {9}
+// astro.config.mjs
+import { defineConfig } from 'astro/config';
+import starlight from '@astrojs/starlight';
+
+export default defineConfig({
+	integrations: [
+		starlight({
+			title: 'Documentazione con una pagina 404 personalizzata',
+			disable404Route: true,
+		}),
+	],
+});
+```
+
 ## Caratteri personalizzati
 
 Per impostazione predefinita, Starlight utilizza i caratteri sans-serif disponibili sul dispositivo locale dell'utente per tutto il testo.
@@ -304,7 +323,7 @@ Per utilizzare Google Fonts, segui la [guida alla configurazione di Fontsource](
 
    </FileTree>
 
-2. Aggiungi una [dichiarazione `@font-face`](https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face) per ciascuno dei tuoi caratteri in `src/fonts/font-face.css`.
+2. Aggiungi una [dichiarazione `@font-face`](https://developer.mozilla.org/it/docs/Web/CSS/@font-face) per ciascuno dei tuoi caratteri in `src/fonts/font-face.css`.
    Utilizza un percorso relativo al file del font nella funzione `url()`.
 
    ```css
@@ -322,7 +341,7 @@ Per utilizzare Google Fonts, segui la [guida alla configurazione di Fontsource](
 
 3. Aggiungi il percorso del tuo file `font-face.css` all'array `customCss` di Starlight in `astro.config.mjs`:
 
-   ```js
+   ```diff lang="js"
    // astro.config.mjs
    import { defineConfig } from 'astro/config';
    import starlight from '@astrojs/starlight';
@@ -330,10 +349,10 @@ Per utilizzare Google Fonts, segui la [guida alla configurazione di Fontsource](
    export default defineConfig({
    	integrations: [
    		starlight({
-   			title: 'Documentazione con font personalizzato',
+   			title: 'Docs con un font personalizzato',
    			customCss: [
-   				// Percorso relativo al file CSS @font-face.
-   				'./src/fonts/font-face.css',
+   +				// Percorso relativo al file CSS @font-face.
+   +				'./src/fonts/font-face.css',
    			],
    		}),
    	],
@@ -381,7 +400,7 @@ Fornisce moduli npm che puoi installare per i caratteri che desideri utilizzare
 
 3.  Aggiungi i file CSS Fontsource all'array `customCss` di Starlight in `astro.config.mjs`:
 
-    ```js
+    ```diff lang="js"
     // astro.config.mjs
     import { defineConfig } from 'astro/config';
     import starlight from '@astrojs/starlight';
@@ -389,11 +408,11 @@ Fornisce moduli npm che puoi installare per i caratteri che desideri utilizzare
     export default defineConfig({
     	integrations: [
     		starlight({
-    			title: 'Docs With a Custom Typeface',
+    			title: 'Docs con un font personalizzato',
     			customCss: [
-    				// File Fontsource per pesi di font regolari e semi-grassetto.
-    				'@fontsource/ibm-plex-serif/400.css',
-    				'@fontsource/ibm-plex-serif/600.css',
+    +				// File Fontsource per font regolari e semi-grassetto.
+    +				'@fontsource/ibm-plex-serif/400.css',
+    +				'@fontsource/ibm-plex-serif/600.css',
     			],
     		}),
     	],
diff --git a/docs/src/content/docs/it/guides/i18n.mdx b/docs/src/content/docs/it/guides/i18n.mdx
index 7b7f36de..d8adac62 100644
--- a/docs/src/content/docs/it/guides/i18n.mdx
+++ b/docs/src/content/docs/it/guides/i18n.mdx
@@ -11,7 +11,7 @@ Starlight offre il supporto per siti multilingua, compreso di indirizzamento, co
 
 1. Indicare a Starlight le lingue che si vuole supportare passando [`locales`](/it/reference/configuration/#locales) e [`defaultLocale`](/it/reference/configuration/#defaultlocale) all'integrazione Starlight:
 
-   ```js
+   ```js {9-26}
    // astro.config.mjs
    import { defineConfig } from 'astro/config';
    import starlight from '@astrojs/starlight';
@@ -82,7 +82,7 @@ export default defineConfig({
 			locales: {
 				root: {
 					label: 'English',
-					lang: 'en', // necessario per root
+					lang: 'en', // necessario per la lingua principale
 				},
 				'zh-cn': {
 					label: '简体中文',
@@ -111,7 +111,7 @@ Quando si usa una lingua `root`, metti le pagine direttamente in `src/content/do
 
 Per default, Starlight è un sito monolingua (inglese). Per creare un sito monolingua in un'altra, impostala come `root` in `locales`:
 
-```js
+```diff lang="js" {10-13}
 // astro.config.mjs
 import { defineConfig } from 'astro/config';
 import starlight from '@astrojs/starlight';
@@ -141,22 +141,25 @@ Se una traduzione non è ancora disponibile per una lingua, Starlight mostrerà
 
 ## Tradurre l'interfaccia Starlight
 
+import LanguagesList from '~/components/languages-list.astro';
+
 In aggiunta alla possibilità di avere pagine multilingua, Starlight permette di tradurre le scritte dell'interfaccia (per esempio l'intestazione "In questa pagina" nella tabella dei contenuti) in modo che i lettori possano vedere il sito interamente nella lingua selezionata.
 
-Le stringhe dell'interfaccia utente tradotte in inglese, ceco, francese, tedesco, italiano, giapponese, portoghese, olandese, danese, spagnolo, turco, arabo, norvegese, farsi, ebraico, cinese semplificato, coreano, indonesiano, russo, svedese e vietnamese sono disponibili di default e accettiamo [contributi per aggiungere altre lingue predefinite](https://github.com/withastro/starlight/blob/main/CONTRIBUTING.md).
+Le stringhe dell'interfaccia utente tradotte in <LanguagesList /> sono disponibili di default
+e accettiamo [contributi per aggiungere altre lingue predefinite](https://github.com/withastro/starlight/blob/main/CONTRIBUTING.md).
 
 Puoi fornire traduzioni per lingue aggiuntive — o sovrascrivere i valori predefiniti — con la collezione `i18n`.
 
 1. Configura la collezione `i18n` in `src/content/config.ts` se non lo è già:
 
-   ```js
+   ```diff lang="js" ins=/, (i18nSchema)/
    // src/content/config.ts
    import { defineCollection } from 'astro:content';
    import { docsSchema, i18nSchema } from '@astrojs/starlight/schema';
 
    export const collections = {
    	docs: defineCollection({ schema: docsSchema() }),
-   	i18n: defineCollection({ type: 'data', schema: i18nSchema() }),
+   +	i18n: defineCollection({ type: 'data', schema: i18nSchema() }),
    };
    ```
 
@@ -206,8 +209,19 @@ Puoi fornire traduzioni per lingue aggiuntive — o sovrascrivere i valori prede
    }
    ```
 
-   Il pannello di ricerca di Starlight è basato sulla libreria [Pagefind](https://pagefind.app/).
-   Puoi impostare le traduzioni per l'interfaccia utente di Pagefind nello stesso file JSON utilizzando le chiavi pagefind":
+	 I blocchi di codice di Starlight sono gestiti dalla libreria [Expressive Code](https://github.com/expressive-code/expressive-code).
+	 Puoi impostare le traduzioni per le stringhe dell'interfaccia utente nella stessa file JSON utilizzando le chiavi `expressiveCode`:
+
+   ```json
+   {
+   	"expressiveCode.copyButtonCopied": "Copied!",
+   	"expressiveCode.copyButtonTooltip": "Copy to clipboard",
+   	"expressiveCode.terminalWindowFallbackTitle": "Terminal window"
+   }
+   ```
+
+   Il modulo di ricerca di Starlight è gestito dalla libreria [Pagefind](https://pagefind.app/).
+   Puoi impostare le traduzioni per l'interfaccia utente di Pagefind nel medesimo file JSON utilizzando le chiavi `pagefind`:
 
    ```json
    {
@@ -223,3 +237,28 @@ Puoi fornire traduzioni per lingue aggiuntive — o sovrascrivere i valori prede
    	"pagefind.searching": "Searching for [SEARCH_TERM]..."
    }
    ```
+
+### Estendere lo schema di traduzione
+
+Aggiungi chiavi personalizzate ai dizionari di traduzione del tuo sito impostando `extend` nelle opzioni di `i18nSchema()`.
+Nell'esempio seguente, viene aggiunta una nuova chiave opzionale `custom.label` alle chiavi predefinite:
+
+```diff lang="js"
+// src/content/config.ts
+import { defineCollection, z } from 'astro:content';
+import { docsSchema, i18nSchema } from '@astrojs/starlight/schema';
+
+export const collections = {
+	docs: defineCollection({ schema: docsSchema() }),
+	i18n: defineCollection({
+		type: 'data',
+		schema: i18nSchema({
++			extend: z.object({
++				'custom.label': z.string().optional(),
++			}),
+		}),
+	}),
+};
+```
+
+Per saperne di più sugli schemi di raccolta dei contenuti, consulta [ "Definire uno schema di raccolta"](https://docs.astro.build/it/guides/content-collections/#defining-a-collection-schema) nella documentazione di Astro.
diff --git a/docs/src/content/docs/it/guides/overriding-components.md b/docs/src/content/docs/it/guides/overriding-components.md
index c9a7d820..5e96721e 100644
--- a/docs/src/content/docs/it/guides/overriding-components.md
+++ b/docs/src/content/docs/it/guides/overriding-components.md
@@ -1,8 +1,6 @@
 ---
 title: Sostituzione dei componenti
 description: Scopri come sovrascrivere i componenti integrati di Starlight per aggiungere elementi personalizzati all'interfaccia utente del tuo sito di documentazione.
-sidebar:
-  badge: Nuovo
 ---
 
 L'interfaccia utente predefinita e le opzioni di configurazione di Starlight sono progettate per essere flessibili e funzionare con una vasta gamma di contenuti. Gran parte dell'aspetto predefinito di Starlight può essere personalizzato con [CSS](/it/guides/css-and-tailwind/) e [opzioni di configurazione](/it/guides/customization/).
@@ -46,7 +44,7 @@ Sostituire i componenti predefiniti di Starlight può essere utile quando:
    export default defineConfig({
      integrations: [
        starlight({
-         title: 'La Mia Documentazione con Sostituzioni',
+         title: 'La Mia Documentazione con le sostituzioni',
          components: {
            // Sostituisce il componente `SocialIcons` predefinito.
            SocialIcons: './src/components/EmailLink.astro',
diff --git a/docs/src/content/docs/it/guides/project-structure.mdx b/docs/src/content/docs/it/guides/project-structure.mdx
index 3deded4d..115965e2 100644
--- a/docs/src/content/docs/it/guides/project-structure.mdx
+++ b/docs/src/content/docs/it/guides/project-structure.mdx
@@ -5,7 +5,7 @@ description: Impara come organizzare i file nel tuo progetto Starlight.
 
 Questa guida ti mostrerà come un progetto Starlight è organizzato e cosa i file nel progetto fanno.
 
-I progetti Starlight seguono generalmente la stessa struttura di file e cartelle come altri progetti Astro. Vedi [la documentazione sulla struttura dei progetti Astro](https://docs.astro.build/en/core-concepts/project-structure/) per più dettagli.
+I progetti Starlight seguono generalmente la stessa struttura di file e cartelle come altri progetti Astro. Vedi [la documentazione sulla struttura dei progetti Astro](https://docs.astro.build/it/core-concepts/project-structure/) per più dettagli.
 
 ## File e cartelle
 
diff --git a/docs/src/content/docs/it/guides/sidebar.mdx b/docs/src/content/docs/it/guides/sidebar.mdx
index 6f8b380f..5c0703b3 100644
--- a/docs/src/content/docs/it/guides/sidebar.mdx
+++ b/docs/src/content/docs/it/guides/sidebar.mdx
@@ -59,7 +59,7 @@ Combinando collegamenti e gruppi, puoi creare un'ampia varietà di layout della
 
 Aggiungi un collegamento a una pagina interna o esterna utilizzando un oggetto con le proprietà `label` e `link`.
 
-```js
+```js "label:" "link:"
 starlight({
 	sidebar: [
 		// Un collegamento alla guida CSS e stile.
@@ -88,7 +88,7 @@ Aggiungi un gruppo utilizzando un oggetto con le proprietà `label` e `items`.
 `label` verrà utilizzato come intestazione del gruppo.
 Aggiungi collegamenti o sottogruppi all'array `items`.
 
-```js
+```js /^\s*(label:|items:)/
 starlight({
 	sidebar: [
 		// Un gruppo di collegamenti etichettati "Guide".
@@ -138,11 +138,12 @@ La configurazione sopra genera la seguente barra laterale:
 
 Starlight può generare automaticamente un gruppo nella barra laterale in base a una directory dei tuoi documenti.
 Ciò è utile quando non desideri inserire manualmente ciascun elemento della barra laterale in un gruppo.
-Per impostazione predefinita, le pagine verranno ordinate alfabeticamente in base al nome del file.
+
+Di default, le pagine sono ordinate in ordine alfabetico secondo lo [`slug`](/it/reference/overrides/#slug) del file.
 
 Aggiungi un gruppo generato automaticamente utilizzando un oggetto con le proprietà `label` e `autogenerate`. La tua configurazione di `autogenerate` deve specificare quale `directory` da utilizzare per le voci della barra laterale. Ad esempio, con la seguente configurazione:
 
-```js
+```js "label:" "autogenerate:"
 starlight({
 	sidebar: [
 		{
@@ -195,8 +196,9 @@ Utilizza il [campo frontmatter `sidebar`](/it/reference/frontmatter/#sidebar) ne
 
 Le opzioni frontmatter della barra laterale ti consentono di impostare un'[etichetta personalizzata](/it/reference/frontmatter/#label) o aggiungere un [badge](/it/reference/frontmatter/#badge) a un collegamento, [nascondi](/it/reference/frontmatter/#hidden) un collegamento dalla barra laterale o definire un [ponderazione dell'ordinamento personalizzato](/it/reference/frontmatter/#order).
 
-```md
+```md "sidebar:"
 ---
+# src/content/docs/example.md
 title: La mia pagina
 sidebar:
   # Imposta un'etichetta personalizzata per il collegamento
@@ -235,15 +237,15 @@ La configurazione del frontmatter `sidebar` viene utilizzata solo per i collegam
 
 ## Badge
 
-I collegamenti possono anche includere una proprietà `badge` per visualizzare un badge accanto all'etichetta del collegamento.
+I collegamenti, i gruppi e i gruppi generati automaticamente possono anche includere una proprietà `badge` per visualizzare un badge accanto all'etichetta del collegamento.
 
-```js
+```js {10,17}
 starlight({
 	sidebar: [
 		{
 			label: 'Guide',
 			items: [
-				// Un collegamento con un badge "Nuovo".
+				// Un link con il badge "Nuovo".
 				{
 					label: 'Componenti',
 					link: '/guides/components/',
@@ -251,6 +253,12 @@ starlight({
 				},
 			],
 		},
+		// Un gruppo autogenerato con il badge "Deprecato".
+		{
+			label: 'Riferimento',
+			badge: 'Deprecato',
+			autogenerate: { directory: 'reference' },
+		},
 	],
 });
 ```
@@ -269,6 +277,24 @@ La configurazione sopra genera la seguente barra laterale:
 				},
 			],
 		},
+		{
+			label: 'Riferimento',
+			badge: { text: 'Deprecato', variant: 'default' },
+			items: [
+				{
+					label: 'Riferimento Configurazione',
+					link: '/reference/configuration/',
+				},
+				{
+					label: 'Riferimento Frontmatter',
+					link: '/reference/frontmatter/',
+				},
+				{
+					label: 'Riferimento Overrides',
+					link: '/reference/overrides/',
+				},
+			],
+		},
 	]}
 />
 
@@ -279,7 +305,7 @@ Personalizza lo stile del badge utilizzando un oggetto con proprietà `text` e `
 Il `text` rappresenta il contenuto da visualizzare (ad esempio "Nuovo").
 Sostituisci lo stile `default`, che utilizza il colore in risalto del tuo sito, impostando la proprietà `variant` su uno dei seguenti valori: `note`, `tip`, `danger`, `caution` o `success`.
 
-```js
+```js {10}
 starlight({
 	sidebar: [
 		{
@@ -320,7 +346,7 @@ I collegamenti possono anche includere una proprietà `attrs` per aggiungere att
 
 Nell'esempio seguente, `attrs` viene utilizzato per aggiungere un attributo `target="_blank"`, in modo che il collegamento si apra in una nuova scheda e per applicare un attributo personalizzato `style` per scrivere in corsivo l'etichetta del collegamento:
 
-```js
+```js {10}
 starlight({
 	sidebar: [
 		{
@@ -360,29 +386,29 @@ La configurazione sopra genera la seguente barra laterale:
 
 ## Internazionalizzazione
 
-Utilizza la proprietà `translations` sulle voci dei collegamenti e dei gruppi per tradurre il collegamento o l'etichetta del gruppo per ciascuna lingua supportata.
-La proprietà `label` verrà utilizzata per la locale predefinita e per le lingue senza traduzione.
+Utilizza la proprietà `translations` su voci di link e gruppi per tradurre l'etichetta del link o del gruppo per ogni lingua supportata specificando un tag di lingua [BCP-47](https://www.w3.org/International/questions/qa-choosing-language-tags), ad esempio `"en"`, `"ar"`, o `"zh-CN"`, come chiave e l'etichetta tradotta come valore.
+La proprietà `label` sarà utilizzata per la lingua predefinita e per le lingue senza traduzione.
 
-```js
+```js {5-7,11-13,18-20}
 starlight({
 	sidebar: [
 		{
-			label: 'Guide',
+			label: 'Guides',
 			translations: {
-				es: 'Guías',
+				'pt-BR': 'Guias',
 			},
 			items: [
 				{
-					label: 'Componenti',
+					label: 'Components',
 					translations: {
-						es: 'Componentes',
+						'pt-BR': 'Componentes',
 					},
 					link: '/guides/components/',
 				},
 				{
-					label: 'Internazionalizzazione (i18n)',
+					label: 'Internationalization (i18n)',
 					translations: {
-						es: 'Internacionalización (i18n)',
+						'pt-BR': 'Internacionalização (i18n)',
 					},
 					link: '/guides/i18n/',
 				},
@@ -392,25 +418,31 @@ starlight({
 });
 ```
 
-La navigazione della documentazione in spagnolo genererà la seguente barra laterale:
+La navigazione della documentazione in Portoghese (Brasile) genererà la seguente barra laterale:
 
 <SidebarPreview
 	config={[
 		{
-			label: 'Guías',
+			label: 'Guias',
 			items: [
-				{ label: 'Componentes', link: '/es/guides/components/' },
-				{ label: 'Internacionalización (i18n)', link: '/es/guides/i18n/' },
+				{ label: 'Componentes', link: '/pt-br/guides/components/' },
+				{ label: 'Internacionalização (i18n)', link: '/pt-br/guides/i18n/' },
 			],
 		},
 	]}
 />
 
-## Gruppi che si riducono
+
+
+
+
+
+
+## Gruppi compressi
 
 I gruppi di collegamenti possono essere compressi per impostazione predefinita impostando la proprietà `collapsed` su `true`.
 
-```js
+```js {5-6}
 starlight({
 	sidebar: [
 		{
@@ -418,8 +450,8 @@ starlight({
 			// Comprimi il gruppo per impostazione predefinita.
 			collapsed: true,
 			items: [
-				{ label: 'Componenti', link: '/guides/components/' },
-				{ label: 'Internazionalizzazione (i18n)', link: '/guides/i18n/' },
+				{ label: 'Componenti', link: '/it/guides/components/' },
+				{ label: 'Internazionalizzazione (i18n)', link: '/it/guides/i18n/' },
 			],
 		},
 	],
@@ -434,8 +466,8 @@ La configurazione sopra genera la seguente barra laterale:
 			label: 'Guide',
 			collapsed: true,
 			items: [
-				{ label: 'Componenti', link: '/guides/components/' },
-				{ label: 'Internazionalizzazione (i18n)', link: '/guides/i18n/' },
+				{ label: 'Componenti', link: '/it/guides/components/' },
+				{ label: 'Internazionalizzazione (i18n)', link: '/it/guides/i18n/' },
 			],
 		},
 	]}
@@ -443,7 +475,7 @@ La configurazione sopra genera la seguente barra laterale:
 
 [I gruppi generati automaticamente](#gruppi-generati-automaticamente) rispettano il valore `collapsed` del gruppo principale:
 
-```js
+```js {5-6}
 starlight({
 	sidebar: [
 		{
@@ -465,15 +497,12 @@ La configurazione sopra genera la seguente barra laterale:
 			collapsed: true,
 			items: [
 				{ label: 'Componenti', link: '/guides/components/' },
-				{ label: 'Internazionalizzazione (i18n)', link: '/guides/i18n/' },
+				{ label: 'Internazionalizzazione (i18n)', link: '/it/guides/i18n/' },
 				{
-					label: 'avanzato',
+					label: 'advanced',
 					collapsed: true,
 					items: [
-						{
-							label: 'Struttura del progetto',
-							link: '/guides/project-structure/',
-						},
+						{ label: 'Struttura del progetto', link: '/it/guides/project-structure/' },
 					],
 				},
 			],
@@ -483,7 +512,7 @@ La configurazione sopra genera la seguente barra laterale:
 
 Questo comportamento può essere ignorato definendo la proprietà `autogenerate.collapsed`.
 
-```js
+```js {5-7} "collapsed: true"
 starlight({
 	sidebar: [
 		{
@@ -505,15 +534,12 @@ La configurazione sopra genera la seguente barra laterale:
 			label: 'Guide',
 			items: [
 				{ label: 'Componenti', link: '/guides/components/' },
-				{ label: 'Internazionalizzazione (i18n)', link: '/guides/i18n/' },
+				{ label: 'Internazionalizzazione (i18n)', link: '/it/guides/i18n/' },
 				{
 					label: 'advanced',
 					collapsed: true,
 					items: [
-						{
-							label: 'Struttura del progetto',
-							link: '/guides/project-structure/',
-						},
+						{ label: 'Struttura del progetto', link: '/it/guides/project-structure/' },
 					],
 				},
 			],
diff --git a/docs/src/content/docs/it/reference/configuration.mdx b/docs/src/content/docs/it/reference/configuration.mdx
index 7b3e584e..fce73406 100644
--- a/docs/src/content/docs/it/reference/configuration.mdx
+++ b/docs/src/content/docs/it/reference/configuration.mdx
@@ -351,7 +351,7 @@ starlight({
 **predefinito:** `true`
 
 Starlight utilizza [Expressive Code](https://github.com/expressive-code/expressive-code/tree/main/packages/astro-expressive-code) per rendere i blocchi di codice e aggiungere il supporto per evidenziare parti di esempi di codice, aggiungere nomi di file ai blocchi di codice e altro ancora.
-Consulta la guida ["Blocchi codice"](/it/guides/authoring-content/#blocchi-codice) per scoprire come utilizzare la sintassi Expressive Code nel tuo contenuto Markdown e MDX.
+Consulta la guida ["Blocchi codice"](/it/guides/authoring-content/#blocco-di-codice) per scoprire come utilizzare la sintassi Expressive Code nel tuo contenuto Markdown e MDX.
 
 Puoi utilizzare tutte le opzioni di configurazione standard di [Expressive Code](https://github.com/expressive-code/expressive-code/blob/main/packages/astro-expressive-code/README.md#configuration) nonché alcune proprietà specifiche di Starlight, impostandole nell'opzione `expressiveCode` di Starlight.
 Ad esempio, imposta l'opzione `styleOverrides` di Expressive Code per sovrascrivere il CSS predefinito. Ciò consente personalizzazioni come dare ai tuoi blocchi di codice angoli arrotondati: