Central de Ajuda Wix
  1. Início
  2. Crie o seu site
  3. Use o Editor Wix
  4. Adicione e personalize elementos
  5. Botão
  6. Editor Wix: personalizar o design dos botões

Editor Wix: personalizar o design dos botões

7 min de leitura
Neste artigo
  • Fazer o design do botão
  • Glossário de design
  • Opções de design do botão
  • Opções de formatação de texto
  • Opções de design do ícone
Crie botões lindos e atraentes que combinam perfeitamente com o seu site e atraem os visitantes do site para interagir com ele. 
Clique no ícone Design no seu botão para começar a personalizar.
Captura de tela de um botão após ser selecionado. Ícone do design em destaque.
Observação:
As opções para os estados do botão variam dependendo do tipo de botão selecionado.

Fazer o design do botão

Há uma variedade de opções de personalização disponíveis. Dependendo do tipo de botão, você pode ajustar o background, o texto e o ícone. Escolha as cores, preenchimentos, cantos, sombras e muito mais.
Personalize cada estado do botão individualmente para criar efeitos chamativos enquanto os visitantes navegam no seu site. Use cores vibrantes e diferentes para os estados Normal, Interativo e Ativo de cada botão para melhorar o engajamento e destacar cada um.
captura de tela de vários tipos de botão.
Observação:
As opções de personalização disponíveis dependem do que você escolhe exibir no seu botão (texto, ícone ou ambos).

Para fazer o design do seu botão:

  1. Vá para o seu editor.
  2. Clique no tipo de botão que deseja personalizar entre as opções abaixo:
Saiba mais sobre como personalizar outros tipos de botões:

Glossário de design

Opções de design do botão

Opção
Explicação
Como usar
Preenchimentos
Adicione preenchimentos como cores, imagens, estampas e gradientes para criar efeitos incríveis e coloridos no seu botão. 
  • Clique na caixa de cores para cada camada e escolha o tipo de preenchimento, e então arraste o slider para alterar a opacidade do preenchimento da camada.
  • Reordene as camadas de preenchimento arrastando-as para cima e para baixo na lista. 
Bordas
Personalize a borda do botão para destacá-lo. Personalize todos os lados dos botões juntos, ou cada lado separadamente, clicando nos ícones de bloqueio e desbloqueio. 
  • Clique no campo Largura para adicionar a largura em pixels, ou ajuste o slider.
  • Clique no meu dropdown de Estilo e selecione o estilo da borda.
  • Clique na caixa de cores Preenchimento para selecionar a cor da borda e use o slider para ajustar a opacidade. 
Cantos
Altere os cantos do seu botão para torná-lo mais arredondado ou mais quadrado. Altere o tamanho de todos os cantos juntos, ou personalize cada canto separadamente, clicando nos ícones de bloqueio ou desbloqueio. 
Clique no campo de pixel em um canto e insira o número de pixels que deseja aplicar a ele.
Sombras
Adicione camadas de sombra ao seu botão e personalize a cor, tamanho e mais.
  • Clique na caixa de cores para cada camada de sombra e personalize a cor, tipo, ângulo, tamanho, distância e desfoque. Em seguida, arraste o slider para alterar a opacidade da sombra.
  • Reordene as camadas de sombra arrastando-as para cima e para baixo na lista.
Se estiver usando um botão de upload:
  • Clique na alavanca para ativar as sombras.
  • Utilize os sliders para editar o ângulo, a distância, o tamanho e o desfoque. Em seguida, use o slider e a caixa de cores para editar a opacidade e a cor.
Layout

Altere o layout do seu botão.
  • Clique no dropdown Exibir e escolha se deseja exibir apenas texto, apenas ícone ou ambos.
  • Selecione o alinhamento, posição e espaçamento do texto e/ou ícone (se relevante).
  • Defina o preenchimento em torno do texto e/ou ícone.

Opções de formatação de texto

Opção
Explicação
Como usar
Mostrar texto
Mostre ou oculte texto no seu botão.
Clique na alavanca para mostrar ou ocultar texto no seu botão.
Estilo
Selecione o tema para o texto do botão.
Selecione um tema de texto no menu dropdown.
Fontes
Escolha a fonte para o texto do botão.
Clique no menu dropdown e selecione uma fonte.
Tamanho da fonte
Altere o tamanho do texto no botão.
Arraste o slider para aumentar ou diminuir o tamanho da fonte ou insira um valor.
Formatação de texto
Aplique formatação ao seu texto.
  • Formate seu texto usando as opções: negrito, itálico, sublinhado, riscado, cores, letras maiúsculas e direção e alinhamento do texto.
Espaçamento de caracteres
Altere o espaçamento entre os caracteres de texto.
Arraste o slider para aumentar ou diminuir o espaçamento ou insira um valor.
Sombras
Crie sombras para o seu texto. Você pode colocar mais de uma sombra.
Clique em Adicionar uma sombra para adicionar uma nova. Clique no ícone Personalizar Sombra para fazer seu design.

Opções de design do ícone

Opção
Explicação
Como usar
Mostrar ícone
Mostre ou oculte um ícone em seu botão.
Clique na alavanca para mostrar ou ocultar o ícone no botão.
Tamanho
Altere o tamanho do seu ícone
Arraste o slider para aumentar ou diminuir o tamanho do ícone ou insira um valor.
Cor
Altere a cor do ícone.
Clique na caixa de cor e selecione uma cor.
Rotação
Ajuste a rotação do ícone.
Arraste a alça para personalizar a rotação do ícone ou insira os graus na caixa de texto.

Esse artigo foi útil?

|
Contrate um profissionalEncontre um Parceiro Wix que pode ajudar você a alcançar os objetivos do seu site.
Começar
Neste artigo
  • Fazer o design do botão
  • Glossário de design
  • Opções de design do botão
  • Opções de formatação de texto
  • Opções de design do ícone

Esse artigo foi útil?

|