Quando você tem um site de negócios, os formulários são um grampo. Eles facilitam o contato dos clientes com você, além de fornecer informações importantes e feedback. No entanto, descobrir como criá-los pode ser um desafio.
Se você está procurando por uma estratégia simples e direta, nós recomendamos o uso dos formulários do Elementor. Este popular construtor de páginas fornece soluções para construir uma variedade de formulários que são tanto esteticamente agradáveis quanto fáceis de usar.
Neste artigo, vamos começar discutindo porque você pode querer criar formulários Elementor. Então, o acompanharemos no processo de fazer isso, e cobriremos algumas dicas úteis e dicas de solução de problemas. Vamos começar!
Por que criar formulários Elementor
Há muitas vantagens em criar formulários para o seu site WordPress. Para começar, você pode fornecer aos seus visitantes um método rápido e simples de comunicação com você. Além disso, você pode usá-los para gerar leads e adquirir informações importantes do seu público.
Os formulários também podem ser ferramentas úteis para registrar seus usuários e aceitar pagamentos. No entanto, se você quiser adicionar um formulário ao seu site WordPress, você precisará usar um plugin. Alternativamente, você pode usar um construtor de páginas como o Elementor.
O Elementor permite que você construa formulários impressionantes sem tocar em uma linha de código. Você pode usar o editor de arrastar e soltar para criar formulários responsivos que combinem com sua marca e estética do site.
Você também pode escolher entre vários tipos de formulários, inclusive:
- Elementor Contact Forms: você pode usar este recurso para construir um formulário simples para que os usuários entrem em contato com você.
- Elementor Gravity Forms: este widget de Gravity Forms lhe dá mais flexibilidade em termos de customização e estilo de seus formulários.
- Elementor Register Forms: este recurso permite que você crie formulários de registro de usuário em seu site.
Como você pode ver, cada um desses formulários tem seu próprio caso de uso específico e pode ajudar a melhorar a funcionalidade do seu site. A seguir, mostraremos como construir um formulário de contato usando o Elementor.
Como criar um site WordPress usando o Elementor (6 passos)
Agora que entendemos mais sobre porque você pode querer usar os formulários Elementor, vamos dar uma olhada em como você pode criar um em alguns passos simples. Note que para este tutorial, nós vamos assumir que você já tem o Elementor instalada e ativada em seu site.
Há uma ferramenta gratuita e um plugin pago. Para acessar os recursos do formulário, você vai precisar da versão premium.
Passo 1: Adicione o widget de contato Elementor
Para começar, navegue até a página ou artigo onde você quer inserir seu formulário de contato. Depois, clique no botão Edit with Elementor na parte superior da tela:
Isto irá abrir a interface do editor do Elementor. A partir dos widgets da esquerda, procure e selecione o widget Form:
Então, você pode arrastar e soltar o widget em sua página. Isto irá inserir um formulário de contato padrão.
Passo 2: Configure os campos do seu formulário de contato
Uma vez que você coloque seu formulário de contato na página, há um punhado de configurações para você configurar. Por enquanto, vamos nos concentrar na configuração dos campos do formulário.
Você pode editar os campos básicos do formulário clicando no widget e customizando o texto (se você quiser mudar qualquer uma das opções padrão). Se você quiser adicionar campos adicionais, você pode fazer isso selecionando Add Item:
Você pode selecionar o tipo de campo que deseja adicionar a partir da lista suspensa. Em seguida, você pode adicionar um rótulo, que é o nome do campo do formulário. Isto mostra aos seus visitantes qual é a entrada esperada.
Para a opção Placeholder, você pode personalizar o texto que aparece no campo do formulário antes de o usuário inserir suas informações. Você pode usar isto para dar aos visitantes exemplos dos dados que você quer que eles forneçam.
Além disso, você pode escolher ativar a configuração Required e modificar a largura da coluna. Você também pode clicar no painel de Buttons para personalizar a aparência dos botões do seu formulário. Você pode mudar o tamanho, assim como a fonte e as cores.
Passo 3: Configure o envio do seu formulário
Após você terminar de criar os campos do formulário, o próximo passo é configurar as configurações de envio do seu formulário. Você pode navegar para o e-mail dentro do editor do Elementor para acessar a variedade de opções.
Por exemplo, você pode inserir seu endereço de e-mail no campo To onde você quer que as submissões sejam entregues. Você pode digitar vários endereços de e-mail se desejar:
Você também pode personalizar o assunto do e-mail e da mensagem. Quando você terminar de configurar todas as opções, certifique-se de salvar suas alterações.
Passo 4: Personalize o seu formulário de contato de mensagens
Se você quiser personalizar ainda mais o seu formulário de contato, você pode fazer isso habilitando o envio de mensagens personalizadas. Selecione Additional Options, então mova a chave de alternância para Custom Messaging para Yes:
Existem quatro tipos de mensagens que você pode modificar:
- Success Message: isto aparece quando um usuário submete o formulário
- Error Message: isto surgirá se houver algum problema durante o processo de envio
- Required Message: para informar aos usuários que um determinado campo não foi preenchido
- Invalid Message: para que os usuários saibam que algo com o envio do formulário está desligado
Você pode personalizar estas mensagens para combinar com a voz e estilo da sua marca. Por exemplo, você pode modificar a redação para adicionar um pouco de personalidade.
Passo 5: Estilizando o seu formulário de contato Elementor
Uma vez que você tenha o texto básico e os campos do seu formulário tratados, você pode começar a modelar o design do seu formulário de contato do Elementor. Por exemplo, você pode querer ter certeza de que ele combina com a sua marca.
Para começar, você pode clicar na aba Style na parte superior do editor de widgets:
Aqui, você encontrará uma grande variedade de opções e configurações que você pode usar para personalizar o design do seu formulário de contato. Por exemplo, você pode ajustar o espaçamento e preenchimento, assim como mudar as cores, tamanho, etiquetas e botões.
Passo 6: Salve e publique o seu formulário
Quando você estiver satisfeito com a aparência e o conteúdo do seu formulário de contato do Elementor, a única coisa que falta fazer é salvá-lo e publicá-lo. Você pode fazer isso selecionando o botão Publish no lado inferior esquerdo da tela.
É isso aí! Então você pode visualizar seu formulário de contato no frontend para confirmar que ele está com a aparência que você deseja.
Melhore complementos para formulários do Elementor
Fora da caixa, o construtor de páginas do Elementor vem com muitas opções para construir formulários para o seu site WordPress. Entretanto, você também pode considerar a adição de plugins para ajudar a ampliar a funcionalidade de seus formulários. Vamos dar uma olhada em algumas opções.
Master Addons for Elementor
O plugin Master Addons for Elementor é uma ferramenta freemium que fornece uma coleção de ferramentas úteis para melhorar o construtor de páginas e, por sua vez, o seu site. Ele inclui as seguintes características:
- Cabeçalho, rodapé, e construtor de formulários de comentários
- Construtor Mega Menu
- Efeitos de pairar sobre a imagem
- Condições de exibição
Também é compatível com uma grande variedade de plugins de formulário. Isto inclui o Formulário de Contato 7, Formulários Ninja, Formulários WP, e Formulários Caldera. Para acessar todas as funcionalidades do plugin, você precisará comprar a versão pro, que está disponível por $39 por ano.
The Plus Addons
Outra ferramenta útil que você pode usar com o Elementor é o Plus Addons. Este plugin está repleto de mais de 8.000 opções de personalização e mais de 300 blocos de Interface de Usuário (UI) que podem ajudá-lo a criar e projetar suas páginas e formulários com facilidade.
Suas características incluem:
- Caixas de Ícones
- Seções do mapa
- Formulários
- Tabelas de preços
Há também mais de 18 modelos que você pode escolher. Estes foram projetados especificamente para certos tipos de negócios, incluindo agências, restaurantes, salões e mais.
Há uma versão gratuita disponível. Entretanto, para aproveitar todo o conjunto de recursos úteis, nós recomendamos a compra de uma licença premium, disponível por $39 por ano.
Dicas e truques adicionais para a criação de formulários Elementor
Se você quiser criar formulários de contato do Elementor para seu site WordPress sem pagar por uma licença premium, há maneiras de você fazer isso. Fazendo isso, você terá que emparelhar o construtor da página com outro plugin de formulário WordPress, como WPForms ou Formidable Forms.
Digamos que você opte por Formidable Forms. Depois de instalar e ativar o plugin em seu site, você pode navegar para Formidable > Forms > Add New:
Em seguida, você pode selecionar Contact Form a partir da lista de opções, e escolher entre um punhado de modelos pré-fabricados. Quando você terminar de construir seu formulário, navegue até a página na qual você quer colocá-lo e inicie a interface do editor Elementor.
No painel à esquerda, procure e selecione o widget Formidable Forms . Você pode ajustar o formato, cores, botões, texto, etc…:
Quando você terminar, você pode salvar e publicar suas mudanças. Este método requer um pouco mais de tempo e esforço do que seria necessário com o plugin Elementor Pro. No entanto, ele pode ajudá-lo a economizar algum dinheiro se você não quiser comprar um plano premium.
Solucionando problemas com os formulários do Elementor
Os formulários de contato do Elementor são bastante simples e fáceis de usar. No entanto, você pode ter problemas ao usá-lo. Um dos problemas mais comuns que as pessoas relatam são os e-mails não entregues.
O Elementor usa a função wp_mail para distribuir seus e-mails. Isto significa que seu provedor de hospedagem pega o e-mail enviado e o entrega.
No entanto, alguns hosts desabilitam a função PHP que é tipicamente usada para enviar e-mails, e é por isso que este problema pode ocorrer. Para resolver este erro, nós recomendamos entrar em contato com seu provedor de hospedagem e pedir a ele que habilite a função send_mail.
Alternativamente, você pode usar um servidor SMTP (Simple Mail Transfer Protocol). Este é um servidor de e-mail que encaminhará seu e-mail em formulários para a caixa de entrada de seus clientes, usando uma fonte externa como o Gmail. Isto pode reduzir as chances dos seus e-mails terminarem em pastas de spam. Para configurar o SMTP, você pode usar um plugin como o WP MAIL SMTP.
Resumo
Os formulários desempenham um papel fundamental nos sites. Eles permitem aos clientes entrar em contato com você, registrar uma conta, enviar informações de pagamento, e muito mais. No entanto, descobrir como criar formulários esteticamente agradáveis para o seu site pode ser um desafio. Felizmente, o Elementor torna isso fácil.
Assim que você adicionar o widget do formulário Elementor à sua página, você pode configurar seus campos e ajustar as configurações do formulário. Você também pode personalizar o design do seu formulário para que ele se alinhe com a sua marca.
Você tem alguma pergunta sobre a criação de formulários do Elementor no WordPress? Informe-nos na seção de comentários abaixo!
Salman Ravoof é um desenvolvedor web autodidata, escritor, criador e grande admirador de Software Livre e de Código Aberto (FOSS). Além de tecnologia, ele se entusiasma com ciência, filosofia, fotografia, artes, gatos e comida. Saiba mais sobre ele em seu site e conecte-se com Salman no X.
Deixe um comentário