Personalizar DevTools

Esta página lista as maneiras de personalizar o Microsoft Edge DevTools.

Configurações

Configurações>As preferências contêm muitas opções para personalizar DevTools.

Para abrir Configurações, em DevTools, clique no ícone Personalizar e controlar DevTools (Personalizar e controlar o ícone DevTools) e clique em Configurações (ícone Configurações). Ou, enquanto DevTools tem foco, pressione F1.

Configurações

Exibição Rápida

Na barra de ferramentas DevTools, na parte inferior do DevTools, você pode selecionar quais ferramentas exibir.

Para abrir (ou fechar) o painel Exibição Rápida , pressione Esc quando o foco estiver em DevTools.

A Gaveta

Você pode mover ferramentas entre a Barra de Atividades (na parte superior) e a barra de ferramentas Modo de Exibição Rápida (na parte inferior).

  • Para mover uma ferramenta da barra de ferramentas do Modo de Exibição Rápida para a Barra de Atividades, clique com o botão direito do mouse em uma ferramenta e selecione Mover para a Barra de Atividades superior:

    Mover uma ferramenta da barra de ferramentas de Exibição Rápida para a Barra de Atividades

  • Para mover uma ferramenta da Barra de Atividades para a barra de ferramentas do Modo de Exibição Rápida , clique com o botão direito do mouse em uma ferramenta e selecione Mover para a exibição rápida inferior:

    Mover uma ferramenta da Barra de Atividades para a barra de ferramentas do Modo de Exibição Rápida

Ferramentas de reordenação

Para alterar a ordenação de guias em uma barra de ferramentas, arraste a guia de uma ferramenta para o local desejado. Sua ordem de ferramenta personalizada persiste em sessões de DevTools.

Por exemplo, por padrão, a ferramenta Rede é a quinta guia na Barra de Atividades. Você pode arrastar a guia Rede para se tornar a primeira guia:

Ordem personalizada de DevTools em uma barra de ferramentas

As guias adicionadas pelas extensões DevTools são sempre adicionadas ao final da Barra de Atividades. Você pode reordená-los durante uma sessão do DevTools, mas eles sempre estarão no final da Barra de Atividades novamente quando o DevTools for aberto.

Abrir e fechar ferramentas

Para manter a interface DevTools simplificada, muitas das ferramentas não são abertas por padrão. Para abrir uma ferramenta na Barra de Atividades ou na barra de ferramentas de Exibição Rápida , clique no botão Mais Ferramentas (Mais Ferramentas) à direita das guias e selecione uma ferramenta na lista:

O botão Mais Ferramentas (+) para abrir uma nova ferramenta

Para fechar uma ferramenta, clique com o botão direito do mouse na guia de uma ferramenta e selecione Remover da Barra de Atividades ou Remover da Exibição Rápida:

Botão Fechar da guia

Alterar onde DevTools está encaixado no navegador

Para alterar onde o DevTools está encaixado no navegador, clique no ícone Personalizar e controlar DevTools (Personalizar e controlar o ícone DevTools) e escolha uma das opções no submenu local do Dock :

O menu Local do Dock, com quatro ícones, representando os quatro possíveis locais de encaixe

Para saber mais, consulte Alterar a colocação de DevTools (Undock, Dock to bottom, Dock to left).

Zoom DevTools dentro ou fora

Consulte Zoom DevTools dentro ou fora em Visão geral de DevTools.

Temas coloridos

Consulte Aplicar um tema de cor ao DevTools.

Selecionando um tema de cor diferente

Restaurar configurações padrão

Para restaurar o tema padrão, posicionamento, ordem de ferramentas e quaisquer outras configurações personalizadas, selecione Configurações Preferências>, role para baixo e clique em Restaurar padrões e atualizar:

Restaurando configurações padrão

Personalizar atalhos do teclado

Consulte Personalizar atalhos de teclado.

Vídeos sobre como personalizar a interface do usuário de DevTools

Personalizar ferramentas de desenvolvedor do Microsoft Edge e acesso rápido a recursos

Publicado em 5 de maio de 2022.

Imagem de miniatura para o vídeo de personalização de DevTools

Saiba como personalizar o DevTools para atender às suas necessidades.

Este vídeo aborda como encaixar ou desencaixar DevTools, abrir novas ferramentas e fechar as que você não precisa. Ele descreve como mover ferramentas na gaveta inferior e personalizar o tamanho e o tema do texto. O vídeo também explica como você pode usar os atalhos de teclado menu de comando para personalizar rapidamente DevTools.

Entender a interface do usuário de DevTools

Publicado em 1º de setembro de 2022.

Imagem da miniatura do vídeo Entender a interface do usuário do DevTools

Entenda como a interface do usuário do Microsoft Edge DevTools é organizada. Se você estiver confuso sobre quais ferramentas estão disponíveis e o que as partes main da interface DevTools fazem, este vídeo ajudará a ficar mais confortável.

Neste vídeo, passamos por cima da estrutura da interface do usuário, com sua main barra de ferramentas e painel e sua área de gaveta. Também abordamos como localizar, abrir e fechar ferramentas, restaurar as configurações padrão e examinar a lista de ferramentas disponíveis.

Confira este vídeo para saber mais sobre as main partes da interface do usuário de DevTools, como personalizá-lo para atender às suas necessidades, saiba mais sobre as diferentes ferramentas disponíveis e para onde procurar ajuda.

Consulte também

Observação

Partes desta página são modificações baseadas no trabalho criado e compartilhado pelo Google e usadas de acordo com os termos descritos na Licença Pública Creative Commons Atribuição 4.0 Internacional. A página original é encontrada aqui e é de autoria de Kayce Basques (Technical Writer, Chrome DevTools & Lighthouse).

Licença Creative Commons Este trabalho é licenciado sob uma Licença Internacional de Atribuição do Creative Commons 4.0.