Estilização de formulários
O Construtor Automático de Formulários oferece controle total sobre o estilo dos formulários. Combine as cores da sua marca, use suas fontes, ajuste o espaçamento e crie formulários que se integrem naturalmente ao seu site.
Por que o estilo da forma é importante
Seu site tem uma identidade visual. Seus formulários devem refletir isso.
Quando os formulários têm uma aparência diferente do restante do site, os visitantes hesitam. Eles se perguntam se ainda estão no mesmo site. Essa hesitação custa conversões.
Formulários bem formatados também transmitem profissionalismo. Um formulário refinado mostra aos visitantes que você se importa com os detalhes — e se você se importa com o design do formulário, provavelmente também se importa com os dados deles.
Como funciona a estilização de formulários
O Auto Form Builder inclui um editor de estilo visual integrado à interface do construtor de formulários.
- Selecione o que estilizarEscolha entre contêiner de formulário, rótulos de campo, campos de entrada, botões ou mensagens de erro.
- Ajustar configuraçõesUse seletores de cores, controles deslizantes e menus suspensos para alterar valores. Sem necessidade de aprender ou memorizar sintaxe CSS.
- Visualize instantaneamenteCada alteração aparece imediatamente na pré-visualização ao vivo. Veja exatamente como seu formulário ficará antes de publicar.
- Salvar como padrãoAplique seu estilo a novos formulários automaticamente. Crie uma vez, reutilize em todos os lugares.
O que você pode personalizar
Cor
Controle todas as cores do seu formulário. Cores de fundo para o contêiner do formulário e campos individuais. Cores de texto para rótulos, espaços reservados e campos de entrada. Cores de borda para os estados padrão, de foco e de erro. Cores de botão para fundo, texto e efeitos de foco.
Tipografia
Escolha as fontes para rótulos e campos de entrada. Ajuste os tamanhos das fontes independentemente — rótulos maiores para dar ênfase, texto auxiliar menor para informações secundárias. Controle a espessura da fonte para rótulos em negrito ou texto de entrada mais leve.
Espaçamento e layout
Defina o espaçamento entre os campos para criar espaço suficiente. Ajuste o preenchimento dentro dos campos para uma digitação confortável. Controle as margens ao redor de todo o formulário para posicioná-lo perfeitamente no layout da sua página.
Fronteiras e Cantos
Defina a largura, o estilo e a cor da borda. Arredonde os cantos para um visual moderno ou mantenha-os retos para um design minimalista. Aplique diferentes estilos de borda a diferentes estados do formulário — bordas sutis por padrão, bordas proeminentes quando o foco estiver no elemento.
botões
Crie botões de envio que combinem com a sua marca. Defina a cor de fundo, a cor do texto, o raio da borda, o espaçamento interno, o tamanho e a espessura da fonte. Personalize os estados de foco e ativo para que os botões sejam responsivos e clicáveis.
FormContainer
Personalize o estilo do formulário. Adicione uma cor de fundo ou mantenha-o transparente. Aplique sombras para dar profundidade. Defina o raio da borda para formulários com cantos arredondados. Controle a largura máxima para evitar que os formulários fiquem muito largos.
Cenários comuns de estilização de formulários
Diretrizes da marca
Sua empresa possui cores específicas — #0F2D5F para a cor primária e #F59E0B para as cores de destaque. Insira esses valores no editor de estilos. Os botões do formulário usarão a cor de destaque. Os rótulos do formulário usarão a cor primária. Consistência perfeita da marca.
Criar formulários de alto contraste
Site com fundo escuro? Crie formulários claros que se destaquem. Fundo claro? Use formulários com bordas e sombras sutis para definir a área do formulário sem competir visualmente.
Design de Formas Minimalistas
Remova as bordas, reduza o espaçamento e use fundos transparentes. Crie formulários que pareçam integrados à página, em vez de estarem isolados em uma caixa.
Crie formulários de chamada à ação impactantes
Botões grandes, cores vibrantes, espaçamento generoso. Crie formulários que chamem a atenção para as suas páginas de geração de leads mais importantes.
Formulários que combinam com qualquer tema
O Auto Form Builder funciona com todos os temas do WordPress. Seus formulários estilizados se adaptam a qualquer contexto de design.
Utiliza Woodmart, Astra, GeneratePress, Divi ou qualquer outro tema? Os seus formulários terão um aspeto nativo. O editor de estilos oferece-lhe controlo suficiente para se adaptar a qualquer sistema de design.
Sem conflitos de tema. Sem problemas de herança de estilo. Apenas formulários com a aparência exata que você deseja.
Não é necessário CSS
Você não precisa escrever CSS personalizado para estilizar seus formulários. O editor visual cuida de tudo.
Mas se você deseja controle de CSS, o Auto Form Builder oferece suporte a CSS personalizado para cada formulário. Adicione sobreposições para casos específicos ou aplique estilos avançados não disponíveis no editor visual. Usuários avançados obtêm a flexibilidade de que precisam.
