Como criar um formulário de contato no Elementor
Ao criar um formulário de contato usando o widget Form do Elementor, você pode definir para onde os dados do formulário serão enviados. Seja na sua conta de e-mail ou no gerenciador de envio de formulários padrão do Elementor.
Neste artigo, vamos pular direto para adicionar o widget Form à caixa de edição do Elementor. Basta adicionar o widget Form do painel do widget à caixa de edição da seguinte maneira:
Como você pode ver, o widget Form cria automaticamente um formulário que consiste em três campos.
Para editar um campo existente, você pode simplesmente abri-lo. Você pode alterar o tipo de campo, substituir o rótulo padrão e o espaço reservado e defini-lo como um campo obrigatório, se desejar.
Para excluir um campo existente, você pode simplesmente clicar no X do campo que você deseja excluir.
Para adicionar um novo campo, você pode simplesmente clicar no botão ADICIONE UM ELEMENTO. O próprio widget de formulário oferece suporte a vinte tipos de campos.
Definindo a ação do formulário
Como mencionamos anteriormente, você pode enviar os dados do formulário (envios) para sua conta de e-mail ou para o envio de formulário embutido do Elementor. Para definir o destino, você pode abrir o bloco Após enviar ações sob a guia Conteúdo no painel de configurações.
Crie facilmente seu site com Elementor
Elementor permite que você crie Facilmente e Gratuito qualquer site ou blog com um visual profissional. Pare de pagar muito por um site que você pode fazer sozinho.
Selecione uma ação que você deseja definir no campo disponível (você pode adicionar várias ações). Neste exemplo, selecionamos Email.
Se você também definir a ação do formulário no e-mail, você pode abrir o bloco Email para definir o endereço de e-mail para recebimento dos dados do formulário. Como você pode ver, você também pode definir o assunto se quiser.
Por padrão, Elementor inclui o conteúdo de todos os campos do formulário. Se quiser incluir apenas conteúdo de campos específicos, você pode colar os códigos de acesso de seus campos preferidos no campo. Mensagem.
Por exemplo, a configuração abaixo enviará apenas o conteúdo do campo da mensagem.
Para obter o código de acesso de um campo, você pode clicar na guia AVANÇADO no campo associado do bloco Campos do formulário.
Definição de mensagens
Quando os dados do formulário forem enviados com sucesso, seus visitantes verão uma mensagem de sucesso abaixo do formulário. Da mesma forma, eles também verão uma mensagem de erro quando os dados do formulário não forem enviados.
Quer vender seus produtos na internet?
Baixe WooCommerce grátis, os melhores plugins de e-commerce para vender seus produtos físicos e digitais no WordPress e criar facilmente sua loja online. Perfeito para iniciantes.
Você pode substituir essas mensagens padrão, bem como duas outras mensagens, a partir do bloco Opções adicionais sob a guia Conteúdo no painel de configurações. Ative o Mensagens personalizadas para substituir as mensagens padrão.
Personalizando o formulário
Assim que terminar de fazer as configurações básicas em a guia Conteúdo no painel de configurações, você pode alternar para o Style para personalizar o formulário. Existem cinco blocos que você pode abrir aqui.
Você pode abrir este bloco para definir o espaço entre as colunas e as linhas do formulário, o espaçamento do rótulo, a tipografia (família da fonte, tamanho da fonte, estilo da fonte, etc.) do rótulo do formulário e a cor do texto deste último.
- Campo
Você pode abrir este bloco para definir a tipografia do texto do campo, bem como a cor, a cor de fundo dos campos do formulário, o tamanho, a cor da borda e o raio da borda dos campos do formulário.
- botões
Você pode abrir este bloco para personalizar o botão de envio. Você pode definir coisas como a tipografia do texto do botão, bem como cor, cor de fundo, raio da borda, tamanho da borda, cor da borda e preenchimento do texto. Para definir o tamanho do botão, você pode fazê-lo a partir do bloco botões em a guia Conteúdo.
- Mensagens
Você pode abrir este bloco para definir a tipografia, bem como a cor do texto das mensagens.
- Passos
Você pode abrir este bloco apenas se quiser criar um formulário de várias etapas.
Depois de personalizar o formulário, assim como a página, você pode publicar sua página.
Erro potencial
Um dos erros comuns quando você define a ação do formulário como Email é que o formulário não é enviado. Em vez disso, você verá a seguinte mensagem.
Elementor e a maioria dos plug-ins de formulário de contato – incluindo o Formulário de Contato 7 – usam o recurso de entrega de correio padrão do WordPress chamado wp_mail. Esta função depende da função enviar correio que depende do PHP para funcionar.
Infelizmente, nem todos os provedores de hospedagem na web habilitam o recurso enviar correio do PHP. Em caso afirmativo, seu formulário não será enviado. Em vez disso, você receberá uma mensagem de erro como a acima.
Para resolver o problema, você pode instalar e configurar um serviço de entrega de correio personalizado em seu WordPress. Como alternativa, se possível, você pode pedir ao seu provedor de hospedagem para habilitar o recurso enviar correio do PHP.
No final
Elementor é um dos plug-ins de construtor de páginas mais abrangentes. Ele vem com vários elementos de design (chamados de widgets) para você adicionar facilmente elementos à página, incluindo um formulário de contato.
Embora para construir um formulário de contato do zero com seu próprio design, o Elementor também possui alguns modelos de formulário que você pode usar. Você pode até criar uma página de contato (completa com o formulário de contato, é claro)