Personalizza DevTools

Sofia Emelianova
Sofia Emelianova

In questa pagina sono elencati i modi in cui puoi personalizzare Chrome DevTools.

Impostazioni

Impostazioni > Preferenze contiene molte opzioni per la personalizzazione di DevTools.

Vedi Apri Impostazioni e Preferenze.

Tema scuro

Puoi attivare il tema scuro nelle Impostazioni o nel menu dei comandi.

Il tema scuro.

  1. Apri il menu dei comandi.
  2. Inizia a digitare dark, seleziona il comando Passa al tema scuro e premi Invio per eseguirlo.

    Il comando tema scuro.

  3. In alternativa, imposta il tema in Impostazioni > Preferenze > Aspetto > Temi.

Tema dinamico

DevTools può abbinare automaticamente il tema a colori di Chrome.

Per impostare un tema:

  1. Apri una nuova scheda e fai clic su Personalizza Chrome nell'angolo in basso a destra.
  2. In Aspetto, scegli un tema nello Cambia temi o seleziona una tavolozza dei colori.

DevTools corrisponde al tema a colori selezionato in Aspetto.

Riquadro a scomparsa

Il riquadro contiene molte funzionalità nascoste.

Premi Esc per aprire o chiudere il riquadro a scomparsa.

La Cassetta.

Fai clic su Altri strumenti per aprire altre schede del riquadro laterale.

Il pulsante Altri strumenti che apre altre schede del riquadro a scomparsa.

Modificare il posizionamento di DevTools

Per impostazione predefinita, DevTools è agganciato a destra dell'area visibile. Puoi anche agganciarlo ai lati inferiore o sinistro oppure sganciare DevTools in una finestra separata.

Puoi modificare il posizionamento di DevTools in due modi:

  • Menu principale: apri Personalizza e controlla DevTools e fai clic su:
    • Sgancia in una finestra separata
    • Ancoraggio a sinistra
    • Aggancia in basso
    • Aggancia a destra
  • Menu dei comandi:

    1. Apri il menu dei comandi.
    2. Inizia a digitare dock e seleziona una delle opzioni suggerite: aggancia in basso, a sinistra, destra, sgancia dalla base o ripristina l'ultima posizione del dock.

Opzione di agganciamento suggerita nel menu dei comandi.

Per attivare/disattivare l'opzione Ripristina l'ultima posizione del dock con una scorciatoia da tastiera, premi:

  • Su Linux o Windows: Ctrl+Maiusc+D
  • Su macOS: Comando+Maiusc+D

Riordinare riquadri, schede e riquadri

Per modificare l'ordine, fai clic e trascina verso sinistra o verso destra uno dei seguenti elementi:

  • Riquadri nella parte superiore di DevTools.
  • Riquadri nel riquadro Elementi, ad esempio Stili, Calcolato, Layout e altri.
  • Riquadri nel riquadro Origini, ad esempio Pagina, Spazio di lavoro, Sostituzioni e altri.
  • Schede del riquadro laterale nella parte inferiore di DevTools.

Inoltre, puoi spostare riquadri e schede in alto e in basso da e verso il riquadro a scomparsa. Per farlo, fai clic con il tasto destro del mouse sul riquadro o sulla scheda e seleziona Sposta in cima o Sposta in fondo dal menu a discesa.

L'ordine delle schede personalizzate viene mantenuto nelle sessioni di DevTools.

Layout del riquadro

Per impostazione predefinita, DevTools riorganizzerà automaticamente il layout dei riquadri in base alle dimensioni della finestra. Puoi disattivare la riorganizzazione automatica. Vai alle Impostazioni > Preferenze > Aspetto e aggiorna il layout del riquadro in base alle tue preferenze.

Ad esempio, il riquadro Stili nel riquadro Elementi si sposta dal lato verso il basso quando le dimensioni dello schermo sono ridotte. Se vuoi che il riquadro Stile rimanga sempre laterale, imposta il layout del riquadro su verticale.

Modificare il layout del riquadro

Cambia la lingua dell'interfaccia utente di DevTools

Vedi le Impostazioni > Preferenze > Aspetto > Lingua:

Cambia lingua andando su Impostazioni e poi su Preferenze

Impostazioni sincronizzazione

Puoi sincronizzare le impostazioni di DevTools su più dispositivi.

Per attivare la sincronizzazione, attiva innanzitutto Sincronizzazione Chrome. Una volta attivate, le impostazioni di DevTools vengono sincronizzate per impostazione predefinita.

Sincronizzazione del profilo Chrome.

Puoi attivare o disattivare la sincronizzazione delle impostazioni di DevTools separatamente utilizzando la casella di controllo Impostazioni > Sincronizza > Attiva la sincronizzazione delle impostazioni.

Impostazioni di sincronizzazione di DevTools

DevTools sincronizza la maggior parte delle impostazioni, ad eccezione di quelle nelle schede Spazio di lavoro, Esperimenti e Dispositivi e di alcune altre impostazioni generali. Lo stato della casella di controllo Attiva la sincronizzazione delle impostazioni viene sincronizzato anche su tutti i dispositivi.

Ad esempio, le seguenti impostazioni di Aspetto vengono sincronizzate, in modo da avere un'esperienza coerente su tutti i dispositivi e non dover ridefinire le stesse impostazioni.

Le impostazioni dell'aspetto.

Tuttavia, l'impostazione dock non viene sincronizzata perché gli sviluppatori hanno preferenze di ancoraggio diverse quando eseguono il debug su siti diversi.

La base.

Personalizzare le scorciatoie da tastiera

Consulta Impostazioni > Scorciatoie.

Attiva esperimenti

Vedi Impostazioni > Esperimenti.