Como personalizar seu design de formulário no Elementor usando widgets de formulário feliz GRATUITAMENTE!
Publicados: 2021-03-04Deseja adicionar um formulário de aparência elegante ao seu site Elementor e precisa de uma solução perfeita para isso? Seu tempo de busca finalmente acabou!
Seus complementos favoritos do Happy Elementor lançaram recentemente widgets de formulário gratuitos que permitem adicionar um formulário em diferentes páginas ou seções do seu site sem esforço. Sua integração com 7 construtores de formulários populares significa que você pode adicionar formulários de qualquer um deles e estilizar usando Happy Addons. Isso indica apenas uma coisa, e apenas uma coisa.
Com widgets de formulário Happy Addons, você obterá "Toneladas de escopos de estilo e personalização".
Neste tutorial, mostramos como usar o Happy Addons Form Widgets dentro de sua página da Web projetada pela Elementor, você também aprenderá como personalizar o design da maneira que desejar.
Mas antes disso, vamos entender porque os widgets de formulário são necessários para o seu site.
Happy Addons Form Widgets em resumo
Happy Addons é um dos melhores addons Elementor que ajudou mais de 1.00.000 usuários do WordPress a construir seu site. Ele vem com vários recursos e widgets essenciais para personalizar as postagens do seu site, páginas, produtos WooCommerce, formulários e muito mais.
Como você já deve saber, o Elementor oferece um widget de formulário padrão para exibir formulários no site. Mas não possui recursos suficientes para personalizar um formulário com seu design e estilo extensivos.
É aí que entra o Happy Addons. Os widgets de formulário do Happy Addons permitem que você integre formulários de 7 dos construtores de formulários mais populares do WordPress. Cada um dos widgets vem com vários layouts que ajudarão a tornar seus formulários mais fáceis de usar e bem projetados.
Os 7 plugins de formulário que o Happy Addons Form Widget suporta são –
- Formulário de contato 7
- Formas Ninja
- weForms
- Caldera Forms
- WPForms
- Formas de gravidade
- Formulários Fluentes
Como usar widgets de formulário Happy Addons em seu site Elementor
Usando o Happy Addons Form Widget, você pode personalizar e exibir facilmente um formulário em seu site Elementor, em alguns minutos.
No mínimo, você precisa de três plugins para fazer isso. Eles estão -
- Elementor (Gratuito)
- Happy Elementor Addons (Grátis)
- WPForms (Grátis)
Aqui, usamos um dos plugins de formulário populares WPForms.
Vamos configurar um formulário de contato.
Primeiro, instale e ative os plugins necessários que mencionamos na lista acima.
Etapa 1: criar um formulário de amostra
Depois de instalar o plugin WPForms, você deve criar seu primeiro formulário.
Para fazer isso, vá para WPForms–> Adicionar novo
Na próxima página, você terá a opção de criar seu formulário.
Então você pode editar seu formulário de acordo com sua necessidade e adicionar muitos campos. Aqui adicionamos três campos Nome, Email e Mensagem.
Após finalizar a edição do formulário, você deve clicar no botão Salvar .
Em seguida, você precisa criar uma página para configurar seu formulário. Você também pode definir o formulário em sua página de contato.
Etapa 2: criar uma página para integração de formulário
Primeiro clique em Páginas–>Adicionar Novo .
Na próxima tela, você verá a opção de adicionar o título da página.
Etapa 3: adicionar WPForms
Para projetar a página de contato, usamos o design de página de contato pré-fabricado do WPForm. Copiamos o design usando o recurso Happy Addons Pro ' Live Copy '.
O pré-design é usado em duas linhas para projetar a página de contato.
Na seção esquerda, adicionaremos widgets WPForm. E na seção direita, já inserimos uma imagem e adicionamos uma cor de fundo da seção.
Agora, encontre o widget WPForms na barra de pesquisa e selecione o widget no menu do lado esquerdo. Em seguida, arraste e solte-o na área selecionada.
Em seguida, selecionamos o nome do formulário no menu suspenso que criamos anteriormente.
Etapa 4: estilize o formulário usando complementos felizes
Agora você pode facilmente redesenhar o formulário de contato, se quiser.
Aqui mostramos a você.
Projete o título
Primeiro, adicionamos Happy Gradient Heading no menu da barra lateral esquerda.
Em seguida, você pode personalizar o título de gradiente feliz em seu próprio estilo. Você pode selecionar Presets–>Design e também editar o Title .
Depois de projetar o título, alteraremos o estilo do formulário.
Projete o formulário
Para redesenhar o formulário, você precisa ir Estilo . Aqui, você terá a opção de estilo de formulário, como Campos de formulário, Rótulo de campos de formulário e Botão Enviar .
Campos do formulário : Na configuração do campo do formulário, você alterará o espaçamento do campo, preenchimento, raio da borda, tipografia. Cor do texto do campo, cor do espaço reservado do campo, tipo de borda e muito mais.
Rótulo de Campos : O Rótulo de Campos também permite que você edite a Margem, Preenchimento, Tipografia de Rótulo, Tipografia de Subrótulo, Tipografia de Descrição e Cores.
Botão Enviar : Se precisar, você também personalizará o botão enviar alterando a largura total do botão, a largura do botão, a margem, o preenchimento, a tipografia, a borda, a cor, o raio da borda, a sombra da caixa, a cor do texto e a cor de fundo do botão.
Vamos personalizar um pouco o formulário.
Visualização final
Aqui está a prévia final da nossa página de contato.
Você também pode ver este tutorial em vídeo útil.
Confira a documentação completa do WPForm.
Widgets de formulário: o que são e por que você precisa deles?
Qual é o propósito de ter um formulário em uma página da Web?
Um formulário é usado para vários propósitos em um site. Você pode receber suas mensagens usando um formulário e se comunicar com seus usuários. Também ajuda a construir confiança com seus clientes. Portanto, pode aumentar a confiabilidade do site e permitir que os usuários do site se comuniquem melhor com você. Então, o que os widgets de formulário fazem?
Os widgets de formulário permitem exibir formulários em seu site Elementor facilmente.
Aqui estão alguns tópicos importantes que mostram claramente a importância de ter um formulário em um site –
- Reduza e-mails de spam
- Receba mensagens quando for melhor para você
- Acompanhe as consultas
- Gere mais leads
- Faça sua lista de e-mail marketing
- Oferecer suporte ao cliente
- Receba mensagens enviadas pelo usuário
Os widgets de formulário Happy Addons podem ajudá-lo a fazer todos eles através do processo intuitivo de integração do widget de formulário. Vamos saber mais sobre o widget de formulário Happy Addons.
Conclusão
Neste blog, cobrimos tudo o que você precisa saber sobre os widgets de formulário Happy Addons. Também mostramos como definir um formulário usando o Happy Addons WPForm Widget. Você pode fazer o mesmo para os outros 6 plugins de formulário, da mesma forma.
Na mesma nota, veja como você pode criar um formulário de contato do Elementor.
Se você ainda tiver alguma dúvida sobre como adicionar e personalizar formulários no site do Elementor, poderá comentar. E compartilhe a postagem em seus canais sociais e ajude seus amigos a aprender.