Criar e projetar formulários com o widget Elementor Form

Criar e projetar formulários com o widget Elementor Form

Cada site deve incluir um formulário de contato! Os formulários de contato são úteis para diversos fins, independentemente do tipo de site que você possui. Eles podem gerar leads, construir conexões e relacionamentos, permitir que os usuários relatem problemas com seu site e tudo mais.

Não é necessário ser um especialista técnico para criar formulários de contato no WordPress. O construtor de páginas Elementor torna mais fácil do que nunca criar belos sites.

Para demonstrar como criar formulários de contato com o Elementor, examinaremos as diferentes opções e tudo o que há para saber sobre os formulários de contato no Elementor.

A Elementor incluiu um widget de formulário já há algum tempo, o que significa que você não precisa mais ir a nenhum outro lugar para criar formulários para o seu site WordPress, o que é uma bênção!

No passado, você pode ter encontrado dificuldades ao criar formulários com alguns dos plugin - plugin disponíveis. O processo de criação e configuração de formulários pode ser demorado e frustrante. Felizmente para todos nós, o widget Elementor Form é simples de trabalhar com ele.

Antes de começarmos com o construtor de formulários Elementor, vamos dar uma olhada rápida em alguns de seus recursos mais essenciais.

Um dos recursos mais distintos, para começar, é que ele está totalmente integrado à interface do Elementor, o que significa que você tem acesso a muitas opções de design / estilo / layout disponíveis no Elementor. Não acredito que você encontrará um plugin formulário autônomo com um sistema de design que seja tão robusto quanto este.

A partir daí, você pode criar até 18 tipos diferentes de campos:

  • Área de texto de email de texto Área de texto
  • O URL e o número de telefone são os seguintes:
  • Os botões de opção são um tipo de botão de opção.
  • Escolha em uma lista (dropdown)
  • As caixas de seleção são usadas nas listas de verificação.
  • Existe apenas uma caixa de seleção (aceitação)
  • reCAPTCHA
  • Honeypots são um tipo de recipiente que contém mel (evita spam)

Você também pode dividir seus formulários em várias páginas para criar formulários de várias etapas, o que é benéfico para aplicativos de formato longo.

O Elementor Pro tem mais de 12 integrações com serviços populares de marketing por e-mail e sistemas de gerenciamento de relacionamento com o cliente para ajudá-lo a aproveitar ao máximo seus formulários. Há também uma integração abrangente do Zapier que permite que você se conecte a qualquer uma das milhares de ferramentas disponíveis na plataforma Zapier se sua ferramenta não estiver listada.

Existem algumas outras alternativas intrigantes também. Para ex amp le, quando alguém preenche o formulário, você pode receber notificações via Slack ou Discórdia.

Por falar em notificações, você também pode personalizar as notificações por email que recebe e as notificações por email que os remetentes recebem. Depois que eles enviarem o formulário, você poderá redirecioná-los para uma página de agradecimento personalizada criada por você.

Qual é a melhor maneira de criar um formulário no Elementor?

Começaremos abrindo o editor Elementor e, em seguida, arrastando e soltando o widget Form para o local onde queremos construir nosso Form.

Como criar um formulário elementor

Como tudo o mais no Elementor, o processo de criação de Formulários é realizado visualmente. Não é necessário usar um plugin adicional, nem é essencial atuar como back-end do seu site.

Formando Elementos ou Elementos de uma Forma Estruturada

Depois que seu formulário estiver pronto, a primeira etapa é organizar as informações nele contidas. Quais campos você precisa e que tipos de campos eles deveriam ser? O que você está procurando?

Ao trabalhar no editor Elementor, os Campos do Formulário são adicionados e editados na guia Conteúdo. Como você pode ver na ex amp le abaixo, formas incluem um padrão poucos campos. Ao selecionar Adicionar item no menu suspenso, você pode criar novos campos.

Também é possível duplicar um campo selecionando o ícone que se parece com dois documentos, um na frente do outro, e clicando nele. 

Tipos de campos em um formulário

Muitos tipos de campos de formulário estão disponíveis, desde campos de texto simples a senhas, ReCaptcha e campos de honeypot.

Para alterar o comportamento de um campo de formulário, primeiro selecione o campo e depois selecione o menu suspenso Tipo para ver os vários tipos de campo disponíveis.

Tipos de campos em um formulário de elemento

Largura de uma coluna de formulário

Este recurso permite que você use dois campos de formulário na mesma linha, ajustando a configuração Largura da coluna. Altere a largura da janela selecionando-a no seletor suspenso e selecionando 50 por cento. É importante notar que se você fizer isso com dois campos de formulário consecutivos, notará que eles aparecem na mesma linha juntos.

Formulários no Elementor para Estilo

Estilize seus formulários no Elementor da mesma maneira que estiliza outros widgets, navegando até o painel Estilo localizado na interface de edição do Elementor.

O próprio formulário, os campos, botões, quaisquer etapas, mensagens de erro e mensagens de confirmação podem ser personalizados.

Para aqueles que já estão familiarizados com o Elementor, não há muito mais que eles precisam aprender em estilizar o Elementor Forms.

Ações em um formulário

Seguindo nossa discussão sobre a criação de um Form no Elementor, vamos ver como configurar o que acontece depois que seu Form é enviado; isso é realizado por meio de ações de formulário ou conforme são referidas em Elementor, Actions After Submit.

Quando um formulário é enviado, é comum que o sistema envie um e-mail e redirecione o usuário para uma página da web diferente. Você pode, é claro, incluir quantas ações quiser em seus formulários e combiná-las da maneira que desejar. Como você pode esperar, há um campo seletor específico sem codificação envolvida.

Cada uma das ações que você adicionar aparecerá como uma opção de guia separada no menu principal. Atualmente, temos uma opção guia para e-mail, mas se eu fosse para incluir um redirecionamento no campo Adicionar Ação, também gostaria de ver Redirect em minhas opções da guia, como mostrado na ex amp le abaixo.

Para finalizar, demonstrarei como configurar o Form para aceitar envios por e-mail, a pergunta mais frequente sobre o Forms.

Ao selecionar E-mail na guia Conteúdo do editor, será exibida a tela mostrada abaixo; aqui é onde você pode personalizar o e-mail e o e-mail de resposta, e também pode adicionar um CC ou BCC para qualquer pessoa que deva receber uma cópia dos envios do formulário.

Criando um modelo de mensagem de formulário de contato no Elementor 

Muitas pessoas ficam surpresas ao saber que o editor de formulários do Elementor é mais poderoso do que parece à primeira vista, e um dos recursos mais avançados é a capacidade de personalizar a mensagem para cada formulário.

É possível customizar as mensagens do formulário para fornecer um processo de feedback mais personalizado ao usuário final que preencheu seu formulário, em vez de soar como um robô chato. Mas, especificamente, quais mensagens você pode personalizar para seu formulário de contato Elementor são as seguintes:

Para começar, você deve primeiro ativar as mensagens personalizadas selecionando “Opções adicionais” no menu suspenso e, em seguida, alternando o botão de alternância de “Mensagens personalizadas” para “Sim”.

Personalização de widget de formulário de elemento ou contato adicionando mensagens personalizadas

Como você pode ver, existem quatro mensagens diferentes que você pode personalizar, incluindo as listadas abaixo:

Uma mensagem de sucesso é exibida para um usuário final após enviar o formulário e verificar se o formulário foi preenchido corretamente (por exemplo, nenhum campo obrigatório ausente, etc.).

Mensagem de erro - uma mensagem que é exibida ao usuário final quando ocorre um erro desconhecido durante o envio do formulário.

Mensagem obrigatória - aparece quando um campo obrigatório do formulário não é preenchido, o formulário é enviado e o formulário não é preenchido.

Quando algo no envio do formulário está incorreto e não pode ser enviado, a mensagem Mensagem inválida é exibida para o usuário final.

Ser capaz de editar as mensagens permite que você seja criativo e peculiar, ou mais formal e profissional, se você administrar um site corporativo. A melhor parte é que eles são totalmente editáveis, então você pode fazer o que quiser!

Conclusão

Elemento ou widget de formulário, é fácil construir um formulário de contato. Ele vem com um criador de formulário de contato intuitivo de arrastar e soltar e uma infinidade de opções de personalização que o distinguem de outros plugin formulário de contato disponíveis no mercado. Você pode personalizar facilmente seu estilo e esquema de cores para combinar com a aparência de sua empresa. Também estão incluídos vários outros widgets atraentes, mais de 300+ modelos profissionais e um criador de pop-up em um pacote conveniente. Este construtor de páginas WordPress com recursos completos consiste em todos os widgets e recursos necessários, para que você não precise comprar construtores de páginas adicionais para personalizar ainda mais o seu site. Além disso, permite a integração de mais de 30 serviços de marketing, razão pela qual é um dos plugin mais comprados no mercado atualmente.

Deixe um comentário

Seu endereço de e-mail não será publicado. Os campos obrigatórios estão marcados com *