header-logo
Confira como usar o Wix para construir seu site e negócio.
Personalize e gerencie seu site com os recursos do Wix.
Gerencie assinaturas, planos e faturas.
Administre seu negócio e conecte-se com os membros.
Compre, conecte ou transfira um domínio para o seu site.
Expanda seu negócio e presença online.
Aumente sua visibilidade com recursos de SEO e marketing.
Acesse recursos avançados e otimize sua produtividade.
Encontre soluções, problemas conhecidos ou contate-nos.
placeholder-preview-image
Domine novas habilidades com nossos cursos e tutoriais.
Confira nossas dicas de web design, marketing e mais.
Aumente o tráfego orgânico vindo dos motores de busca.
Desenvolva um site único com a nossa plataforma full-stack.
Alcance seus objetivos com a ajuda de um especialista.
placeholder-preview-image

Editor do Wix Studio: trabalhar com camadas

6 min
Neste artigo
  • A estrutura do painel Camadas
  • Selecionar e gerenciar camadas
  • Gerenciar uma camada
  • Definir uma preferência de seleção de camada
  • Renomear camadas
  • Reordenar camadas
  • Ocultar e mostrar elementos
Gerencie as camadas de uma página enquanto você trabalha nela no Editor do Wix Studio. Aqui você vê todas as seções e elementos, para entender melhor sua hierarquia. O painel Camadas também é útil quando você precisa selecionar um elemento que não consegue encontrar na tela. 
Uma captura de tela do painel Camadas mostrando um elemento específico selecionado em uma página

A estrutura do painel Camadas

O painel Camadas exibe todas as seções na página atual, em uma hierarquia de cima para baixo. Se a página tiver um cabeçalho na parte superior, por exemplo, ela aparece no topo da lista.
Ao aninhar elementos dentro de outros elementos, ele cria uma relação pai/filho entre eles. Por exemplo, elementos de texto dentro de um contêiner são seus elementos filhos. Por sua vez, esse contêiner é filho da seção que o exibe. 
O painel Camadas é organizado de acordo com essa lógica de herança, para que você possa clicar em um elemento pai para ver seus elementos filhos. Se a sua página tiver seções master, elas são destacadas em verde. 
Use a barra de busca para encontrar rapidamente a camada que você precisa. Você pode digitar o nome ou o ID do elemento.

Uma captura de tela da barra de busca no painel Camadas no Editor do Wix Studio

Selecionar e gerenciar camadas

O painel Camadas é uma maneira útil e rápida de navegar para um determinado elemento na página. Também é uma ótima maneira de encontrar um elemento. Por exemplo, se você tiver elementos sobrepostos e não conseguir localizar ou selecionar o que precisa.
Quando você passa o mouse sobre uma camada, ela é destacada na página. Se você clicar na camada, o Editor leva você diretamente para esse elemento. Mesmo se você fechar o painel nesse momento, sua seleção ainda será salva. 
Um GIF mostrando como a página vai até o elemento da barra de login quando selecionado no painel Camadas
Dica:
Selecione vários elementos mantendo a tecla Shift pressionada enquanto clica neles. 

Gerenciar uma camada

Encontrou a camada que você precisa? Nesse painel, você pode executar ações como copiar a camada, movê-la para cima ou para baixo, escolher em quais páginas mostrá-la e muito mais. 
Gerencie uma camada com alguma das seguintes opções:
  • Clique com o botão direito do mouse no nome da camada.
  • Passe o mouse sobre o nome da camada e clique no ícone Mais ações .
Uma captura de tela do menu de ações disponível para cada camada selecionada no painel

Definir uma preferência de seleção de camada

O Editor do Wix Studio permite que você escolha um caminho padrão para pegar camadas na sua tela. Decida qual elemento é "selecionado" quando você clica em um contêiner pai que tem elementos filho.
  • Contêiner pai primeiro: o contêiner pai (por exemplo: caixa contêiner, pilha, etc.) é selecionado quando você clica nele. Em seguida, você pode clicar novamente em qualquer elemento para editá-lo.
  • Elemento filho primeiro: o elemento filho específico em que você clica é selecionado, não seu contêiner pai.

Para definir uma preferência de seleção de camada:

  1. Clique no ícone Wix Studio no canto superior esquerdo.
  2. Passe o mouse sobre Visualização.
  3. Passe o mouse sobre Seleção de camada.
  4. Selecione a opção relevante: Contêiner pai primeiro ou Elemento filho primeiro.
Definindo uma preferência de seleção de camada no Editor do Wix Studio

Renomear camadas

Ao adicionar muitas seções, contêineres e elementos a uma página, pode ser difícil diferenciá-los no painel Camadas. Renomeie as camadas para que elas sejam fáceis de reconhecer. Clique duas vezes na camada relevante para dar um novo nome a ela. 
Um GIF mostrando como renomear uma camada clicando duas vezes sobre ela no painel
Usando o modo avançado?
Exiba IDs de elemento no painel Camadas para identificar facilmente os elementos em seu código. Ative a alavanca Exibir IDs para ver os IDs conforme definido no painel Propriedades.

Reordenar camadas

Com o recurso de arrastar e soltar, você pode reordenar facilmente elementos e seções na página atual. Como o painel Camadas é organizado de cima para baixo, mover elementos também afeta sua localização na página. 
Ao trabalhar com elementos sobrepostos, reordená-los também afeta a ordem Z. Por exemplo, se você quiser que o texto apareça na parte superior de uma forma, o texto deve estar acima da forma no painel Camadas. 
Você só pode arrastar e soltar elementos dentro de seu "pai". Não é possível arrastar um elemento para um pai diferente. 
Um GIF mostrando a funcionalidade de arrastar e soltar no painel Camadas
Alterou a ordem das seções em breakpoints menores?
Você pode aplicar novamente a ordem que tem atualmente no desktop. Vá para o painel Camadas , clique no ícone Mais ações ao lado de Página e selecione Usar ordem das seções em todos os breakpoints.

O painel Camadas, selecionando uma página e clicando para aplicar a ordem dos breakpoints do desktop a todos os outros breakpoints

Ocultar e mostrar elementos

Você pode ocultar rapidamente um elemento do breakpoint atual, diretamente na tela, ao clicar no ícone Mais ações  no elemento e selecionando Ocultar
Ocultando um botão do breakpoint para tablet no Editor do Wix Studio
No entanto, se você precisar mostrar o elemento, você deve fazer isso no painel Camadas. Um elemento oculto aparece com um ícone Oculto para que você possa localizá-lo facilmente na lista.
Dica:
Ao adicionar um elemento a um breakpoint menor (por exemplo: mobile), ele é sempre oculto em breakpoints maiores (por exemplo: desktop). Seguindo essas etapas, você pode fazer com que o elemento apareça nos breakpoints maiores.

Para mostrar um elemento:

  1. Clique em Camadas  no lado esquerdo do editor.
  2. Localize o elemento oculto na lista.
  3. Clique no ícone Mostrar .
Uma captura de tela da opção de mostrar um elemento oculto ao selecioná-lo no painel Camadas