Cette page présente les différentes façons de personnaliser les outils pour les développeurs Chrome.
Paramètres
Settings > Preferences (Paramètres > Préférences) contient de nombreuses options de personnalisation des outils de développement.
Consultez les sections Ouvrir les paramètres et Préférences.
Thème sombre
Vous pouvez activer le thème sombre dans Paramètres ou dans le menu de commande.
- Ouvrez le menu Command (Commande).
Commencez à saisir
dark, sélectionnez la commande Switch to dark theme (Passer au thème sombre), puis appuyez sur Entrée pour exécuter la commande.
Vous pouvez également définir votre thème dans Paramètres > Préférences > Apparence > Thèmes.
Thème dynamique
Les outils pour les développeurs peuvent automatiquement correspondre au thème de couleur de Chrome.
Pour définir un thème:
- Ouvrez un nouvel onglet, puis cliquez sur Personnaliser Chrome en bas à droite.
- Dans Apparence, choisissez un thème via Changer de thème ou sélectionnez une palette de couleurs.
Pour désactiver la thématisation dynamique, effacez Settings > Preferences > Appearance > Match Chrome color scheme (Paramètres > Paramètres > Préférences > Apparence > Correspondre au jeu de couleurs de Chrome) et actualisez DevTools.
Panneau
Le volet contient de nombreuses fonctionnalités masquées.
Appuyez sur Échap pour ouvrir ou fermer le panneau.
Cliquez sur Autres outils pour ouvrir d'autres onglets du volet.
Modifier l'emplacement des outils de développement
Par défaut, les outils de développement sont ancrés à droite de votre fenêtre d'affichage. Vous pouvez également l'ancrer en bas ou sur la gauche, ou le détacher dans une fenêtre distincte.
Vous pouvez modifier l'emplacement des outils de développement de deux manières:
- Menu principal: ouvrez Personnaliser et contrôler les outils de développement, puis cliquez sur :
- Détacher dans une fenêtre distincte
- Épingler à gauche
- Épingler en bas
- Épingler à droite
Menu de commande:
- Ouvrez le menu Command (Commande).
- Commencez à saisir
dock, puis sélectionnez l'une des options suggérées: ancrer en bas, gauche, droite, retirer ou restaurer la dernière position de l'ancre.
Pour activer ou désactiver l'option Restaurer la dernière position d'épinglage à l'aide d'un raccourci clavier, appuyez sur:
- Sous Linux ou Windows: Ctrl+Maj+D
- Sous macOS: Commande+Maj+D
Réorganiser les panneaux, les onglets et les volets
Pour modifier l'ordre, cliquez sur l'un des éléments suivants et faites-le glisser vers la gauche ou vers la droite:
- Panneaux en haut des outils pour les développeurs.
- Volets du panneau Éléments, tels que Styles, Compilé, Mise en page, etc.
- Volets du panneau Sources, tels que Page, Workspace, Remplacements, etc.
- Onglets du volet en bas des outils pour les développeurs.
Vous pouvez également déplacer les panneaux et les onglets vers le haut et vers le bas, entre le volet et l'écran. Pour ce faire, effectuez un clic droit sur le panneau ou l'onglet, puis sélectionnez Placer en première position ou Placer en dernière position dans le menu déroulant.
L'ordre de tabulation personnalisé persiste entre les sessions des outils de développement.
Mise en page du panneau
Par défaut, les outils de développement réorganisent automatiquement la disposition de votre panneau en fonction de la taille de la fenêtre. Vous pouvez désactiver le réarrangement automatique. Accédez à Paramètres > Préférences > Apparence et modifiez la mise en page du panneau selon vos préférences.
Par exemple, le volet Styles du panneau Éléments se déplacera du côté vers le bas lorsque la taille de l'écran est petite. Si vous souhaitez que le volet de style reste toujours sur le côté, définissez la mise en page du panneau sur verticale.
Modifier la langue de l'interface utilisateur des outils de développement
Consultez Paramètres > Préférences > Apparence > Langue.
Paramètres de synchronisation
Vous pouvez synchroniser vos paramètres DevTools sur plusieurs appareils.
Pour activer la synchronisation, commencez par activer la synchronisation Chrome. Une fois activés, les paramètres de vos outils de développement sont synchronisés par défaut.
Vous pouvez activer ou désactiver la synchronisation des paramètres des outils de développement séparément à l'aide de la case Paramètres > Synchronisation > Activer la synchronisation des paramètres.
DevTools synchronise la plupart des paramètres, à l'exception de ceux des onglets Espace de travail, Tests et Appareils, ainsi que de quelques autres paramètres généraux. L'état de la case Activer la synchronisation des paramètres est également synchronisé entre les appareils.
Par exemple, les paramètres Apparence suivants sont synchronisés. Vous bénéficiez ainsi d'une expérience cohérente sur tous les appareils et vous n'avez pas besoin de redéfinir les mêmes paramètres.
Toutefois, le paramètre Dock n'est pas synchronisé, car les développeurs ont des préférences différentes pour le dock lorsqu'ils déboguent des applications sur différents sites.
Personnaliser les raccourcis clavier
Consultez Paramètres > Raccourcis.
Activer les tests
Consultez Paramètres > Tests.