Baixe em PDF Baixe em PDF

Você precisa fazer o debug de um site no iPhone, mas não está encontrando a opção "Inspecionar Elemento"? Embora o recurso não seja nativo no Safari do iPhone, ainda existem formas de inspecionar elementos de páginas da web sem gastar com aplicativos pagos. O jeito oficial é usar as Ferramentas de Desenvolvedor do Safari, mas para isso você vai precisar de um Mac. Caso não haja nenhum computador por perto, dá para instalar um app chamado Web Inspector ou criar um favorito no JavaScript (que também funciona no Chrome). Por fim, caso seu objetivo seja apenas mudar a aparência de uma página, basta usar um atalho chamado Editar Página da Web.

O que você precisa saber

  • Use as Ferramentas do Desenvolvedor do Safari para inspecionar elementos conectando o iPhone ao Mac.
  • Para inspecionar um elemento sem um computador, instale o aplicativo Web Inspector ou use um favorito do JavaScript.
  • Para editar textos ou remover imagens de um site, use o Editar Página da Web no aplicativo Atalhos.
Método 1
Método 1 de 4:

Usando as Ferramentas do Desenvolvedor no Safari

Baixe em PDF
  1. Caso você queira usar o recurso Inspecionar Elemento no Safari pelo iPhone sem precisar de ferramentas externas, é só acessar as Ferramentas do Desenvolvedor do Safari. O único porém é que elas só estão disponíveis no macOS — ou seja, este método envolve um computador.
    • Você tem que conectar o iPhone ao Mac usando um cabo USB , já que não é possível inspecionar elementos a partir da conexão por Wi-Fi.
  2. Faça o seguinte:
    • Acesse os Ajustes do iPhone.
    • Role a tela para baixo e toque em Safari .
    • Role a tela para baixo e toque em Avançado .
    • Toque na barrinha ao lado de "Inspetor Web" para ativá-lo (ou seja, deixá-lo verde).
  3. Você pode pular este passo se já estiver vendo o menu Desenvolvedor quando abre o Safari. Se não o vê, faça o seguinte:
    • Acesse o menu Safari .
    • Clique em Ajustes .
    • Clique em Avançado .
    • Selecione "Mostrar menu Desenvolvedor na barra de menus". [1]
  4. Use o Safari no iPhone para acessar o site em que você quer usar o recurso Inspecionar Elemento.
  5. O iPhone vai aparecer nele.
  6. Isto abre o painel Inspecionar Elemento no Mac para o site que você acessou no iPhone.
    • À medida que você seleciona itens na guia Elementos do Mac, esses elementos vão ficar realçados no iPhone. [2]
    • Se você quiser continuar usando o recurso Inspecionar Elemento sem deixar o iPhone conectado ao Mac, acesse o menu Desenvolvedor novamente e selecione Conectar via Rede .
    Publicidade
Método 2
Método 2 de 4:

Usando a extensão Web Inspector

Baixe em PDF
  1. Essa extensão gratuita para o Safari no iPhone e iPad permite que o usuário inspecione elementos sem um computador. Faça uma busca por "web inspector" e "and a dinosaur" na App Store ou baixe a extensão diretamente neste link .
    • O Web Inspector é muito útil para inspecionar elementos no Safari, já que você não precisa conectar o iPhone a um Mac. Caso queira fazer o debug no Chrome, pule para o próximo método.
    • Embora a extensão seja confiável, ela não é uma ferramenta oficial da Apple.
  2. Faça o seguinte:
    • Abra o Safari e acesse qualquer site.
    • Toque em Aa na barra de endereço.
    • Toque em Gerenciar Extensões . [3]
    • Toque na barrinha ao lado de "Web Inspector" para ativar a extensão.
    • Toque em OK .
  3. Agora que você habilitou o Web Inspector, já pode inspecionar qualquer elemento diretamente pelo Safari.
  4. Para isso, toque em Aa novamente e selecione Web Inspector .
    • Para permitir que o Web Inspector inspecione elementos no site por um único dia, selecione Permitir por Um Dia .
    • Caso você queira usar o Web Inspector por mais tempo ou em vários sites, selecione Sempre Permitir... . Em seguida, toque em Sempre Permitir Neste Site ou Sempre Permitir em Todos os Sites .
      • Se você tocar nesta última opção, não vai precisar dar permissão ao Web Inspector para acessar sites nenhuma outra vez.
  5. Você vai expandir a ferramenta Inspecionar Elemento comum no rodapé do Safari.
    • Quando você terminar, toque duas vezes em Aa para fechar o Web Inspector.
    Publicidade
Método 3
Método 3 de 4:

Usando um favorito do JavaScript

Baixe em PDF
  1. 1
    Acesse o site que você quer inspecionar. Neste método, você vai criar um favorito que contenha uma linha de código do JavaScript para permitir o recurso Inspecionar Elemento em qualquer navegador do iPhone. O truque funciona no Safari e no Chrome, embora os passos exatos para criar o favorito variem um pouco.
    • No Chrome: toque no menu dos três pontos e selecione Adicionar aos Favoritos .
    • No Safari: toque no ícone de compartilhamento e em Adicionar Favorito .
  2. Agora que você criou o favorito, é hora de editá-lo.
    • No Chrome: toque no menu dos três pontos e selecione Favoritos no topo. Em seguida, toque no novo favorito por alguns segundos e selecione Editar Favorito .
    • No Safari: toque no ícone do livro aberto e selecione Favoritos . Em seguida, toque no favorito por alguns segundos e em Editar .
  3. Renomeie o favorito como "Inspecionar", cole o seguinte código no campo URL ou Link (sem alterar nada) e salve tudo.
     javascript 
     : 
     ( 
     function 
     () 
     { 
     var 
     script 
     = 
     document 
     . 
     createElement 
     ( 
     'script' 
     ); 
     script 
     . 
     src 
     = 
     "//cdn.jsdelivr.net/npm/eruda" 
     ; 
     document 
     . 
     body 
     . 
     appendChild 
     ( 
     script 
     ); 
     script 
     . 
     onload 
     = 
     function 
     () 
     { 
     eruda 
     . 
     init 
     () 
     } 
     })(); 
    
  4. Para abrir o favorito no Chrome, toque nos três pontos e selecione Favoritos e Inspecionar . No Safari, o favorito Inspecionar fica na lista com outros sites especificados. Dentro de alguns segundos, você vai ver o ícone de uma engrenagem na página que deseja inspecionar.
  5. A partir de agora, você pode usar a guia Elementos (no topo do painel) para inspecionar certos pontos da página que está aberta.
    Publicidade
Método 4
Método 4 de 4:

Usando o atalho Editar Página da Web

Baixe em PDF
  1. Se seu objetivo é editar a aparência de um site usando o recurso Inspecionar Elemento, dá para conseguir o mesmo efeito usando o atalho do iPhone chamado Editar Página da Web. Embora ele não leve à tela tradicional do recurso, ainda é possível fazer alterações em qualquer página.
    • O aplicativo Atalhos fica na Biblioteca de Apps.
    • Este método é útil se você quiser editar textos ou remover imagens e outros objetos de um site que está visualizando.
  2. A opção fica no canto inferior direito da página.
  3. Digite editar página da web na barra de pesquisa e toque no atalho quando ele aparecer na lista.
  4. A opção é azul e fica no rodapé da página.
  5. Você precisa fazer uma alteração rápida nos ajustes do Atalhos para que o Editar Página da Web funcione:
    • Acesse os Ajustes do iPhone.
    • Role a tela para baixo e toque em Atalhos .
    • Toque em Avançado .
    • Ative a opção "Permitir a Execução de Scripts".
  6. Qualquer site serve aqui.
  7. O ícone de compartilhamento é um quadrado azul com uma seta para baixo e fica no rodapé da tela.
  8. Isto vai dar permissão ao atalho para "editar" o site na janela do navegador.
  9. Você vai voltar ao site. A partir de agora, já é possível editar o visual dele.
    • Toque em qualquer elemento que você queira editar. A partir de agora, você pode editar textos e imagens do site sem precisar do recurso Inspecionar Elemento no Safari.
    Publicidade

Dicas

  • Existem opções de apps pagos que permitem a inspeção de elementos no iPhone, incluindo o Achoo HTML Viewer & Inspector e o Inspect Browser.
  • O Adobe Edge Inspect era uma ferramenta popular para inspecionar elementos de sites, mas ele já não está em desenvolvimento e nem recebe atualizações. [4]
Publicidade

Sobre este guia wikiHow

Esta página foi acessada 5 375 vezes.

Este artigo foi útil?

Publicidade