Como Remover o Botão de Envio de Formulários de Cálculo

Percebe como remover o bot ildeo de envio de formul ildearios de c ildealculo para uma melhor experi ildeancia de utilizador?

Para uma estimativa de hipoteca ou um orçamento de envio, as pessoas querem que o número seja atualizado à medida que digitam, não que cliquem num botão e esperem que a página seja recarregada.

Ao remover o bot ildeo de envio de formul ildearios de c ildealculo criados pelo WPForms, pode fornecer c ildealculos instant ildeaneos aos seus visitantes.

Neste guia, irá aprender os passos simples para modificar os seus formulários para cálculos perfeitos e em tempo real, sem necessidade de uma ação de envio de formulário.

Crie o Seu Formulário Calculadora Agora

Porquê Remover o Botão de Envio de um Formulário de Cálculo?

A maioria dos formulários necessita de um botão de envio porque envia dados para algum lado, como um pedido de contacto ou uma encomenda, mas um formulário de calculadora funciona de forma diferente.

O seu visitante não lhe está a enviar nada, apenas quer uma resposta, como um pagamento mensal de hipoteca ou um custo de envio. Quando o suplemento Cálculos atualiza o total em tempo real à medida que as pessoas escrevem, o botão de envio não tem mais nada para fazer.

Pode até confundir os visitantes, fazendo-os pensar que têm de clicar nele para ver o seu resultado. Escondê-lo faz com que o formulário se comporte como uma calculadora real, onde o valor simplesmente aparece e atualiza por si só.

Portanto, se o seu formulário existe para mostrar um número em tempo real em vez de recolher um envio, remover o botão de envio é geralmente a decisão correta.

Como Remover o Botão de Envio de Formulários de Cálculo

Remover o botão de envio de formulários de cálculo com o WPForms é incrivelmente fácil. Tudo o que precisa de fazer é seguir estes passos simples abaixo:

Os Pré-requisitos

Antes de prosseguirmos com os passos para desativar o botão de envio, vamos garantir que completámos alguns passos importantes.

Se já completou estes passos, sinta-se à vontade para avançar para a secção sobre remover o botão de envio.

1. Ter uma Licença WPForms Pro

WPForms é um plugin reputado de criação de formulários e calculadoras que permite aos utilizadores criar uma vasta gama de formulários, incluindo uma calculadora de dias entre datas.

É importante que tenha a versão mais recente do WPForms instalada, juntamente com acesso à licença Pro.

A versão Pro dá-lhe acesso a integrações premium, addons e muitas funcionalidades valiosas como lógica condicional, relatórios de envio de formulários, etc.

2. Utilizar o Addon de Cálculos

Para criar calculadoras personalizadas no WordPress, provavelmente já sabe que precisa de ter o Addon de Cálculos WPForms instalado.

Pode usar este addon para inserir operadores lógicos e declarações if-then para criar orçamentos personalizados ou construir calculadoras inteligentes.

Permite até utilizar funções matemáticas integradas para arredondar números, calcular intervalos de tempo, encontrar médias e muito mais.

3. Selecionar um Modelo de Formulário Calculadora

Finalmente, precisa de ter um formulário pronto. Se precisar de criar um, o WPForms oferece mais de 2.100 modelos pré-desenhados que tornam a criação de formulários uma tarefa fácil.

Estes incluem modelos de formulários de cálculo concebidos profissionalmente que podem ser personalizados para se adequarem a uma variedade de casos de uso e indústrias, tais como:

• Modelo de Formulário de Calculadora de Hipoteca — perfeito para agências imobiliárias, pois permite aos potenciais compradores calcular a hipoteca e os seus pagamentos mensais sem esforço.
• Modelo de Formulário de Calculadora de Custos de Envio — ajuda sites de comércio eletrónico a poupar tempo e esforço, fornecendo uma calculadora de envio simples para os clientes.
• Modelo de Formulário de Calculadora de IMC — ideal para sites dedicados ao fitness físico ou saúde, que auxiliam os utilizadores a avaliar o seu estado de saúde atual.
• Modelo de Formulário de Calculadora de ROI — auxilia empresas e profissionais de marketing a avaliar eficientemente a rentabilidade das suas campanhas ou projetos.

A melhor parte de tudo: pode usar o addon de cálculos para criar calculadoras personalizadas sem qualquer conhecimento de HTML, javascript ou codificação complexa.

Obtenha o WPForms Pro para Criar a Sua Calculadora

Remover o Botão de Envio

Quando estes pré-requisitos forem cumpridos, estará pronto para modificar o seu formulário para remover o botão de envio para uma melhor experiência de utilizador.

1. Ir à Biblioteca de Snippets do WPForms

No seu painel WordPress, vá a WPForms » Ferramentas. Em seguida, navegue até ao separador Snippets de Código.

Isto exibirá uma mensagem pop-up que diz: “Por favor, instale o WPCode para usar a Biblioteca de Snippets WPForms.”

2. Instalar + Ativar WPCode

Tudo o que tem de fazer agora é clicar no botão Instalar + Ativar WPCode. O plugin será agora instalado em alguns segundos.

Uma vez instalado o plugin WPCode, poderá aceder à lista completa de snippets WPForms.

3. Utilizar o Snippet Ocultar Botão de Envio

Agora, procure o snippet para ocultar o botão de envio digitando o seu nome no campo Pesquisar Snippets. Em seguida, clique no botão Instalar Snippet.

Aqui está o snippet de código que vamos importar:

Isto irá redirecioná-lo para a página de pré-visualização do snippet WPCode, onde poderá ver o código integrado automaticamente.

Agora, tudo o que precisa de fazer é ativar o código do snippet. Para o fazer, mova o interruptor de Inativo para Ativo.

O próximo passo para ativar o snippet de código em todo o site é clicar no botão Atualizar, mesmo ao lado da opção de interrutor Ativo.

Seguindo esta abordagem, só precisará de adicionar o snippet uma vez através da biblioteca de snippets WPForms.

Em seguida, para cada formulário em que o utilizador pretenda usar este snippet, terá de adicionar o nome da Classe CSS do Botão de Envio dentro do construtor.

4. Adicionar Classe CSS ao Botão de Envio

Agora, tudo o que resta fazer é adicionar a classe CSS no construtor do formulário da calculadora do qual pretende remover o botão de envio.

Para o fazer, abra o seu formulário de calculadora e navegue até ao separador Geral, depois role para baixo até ao separador Avançado.

Depois disso, cole o CSS wpf-calc-form no campo Classe CSS do Botão de Envio para ativar o snippet de código.

Pode agora pré-visualizar o seu formulário para ver que o botão de envio da sua calculadora foi removido com sucesso!

Como impedir que a tecla Enter envie o formulário

Mesmo sem um botão de envio visível, um formulário ainda pode ser enviado quando alguém pressiona a tecla Enter num campo de texto. Numa calculadora que se destina a mostrar um resultado em tempo real, esse não é o comportamento que pretende.

A solução é um segundo trecho de código que impede a tecla Enter de acionar um envio. O código exato encontra-se na nossa documentação para programadores, pelo que pode seguir o guia sobre como impedir que a tecla Enter envie o formulário e adicioná-lo da mesma forma que adicionou o primeiro.

Com ambos os trechos ativos, a sua calculadora mostra o seu total instantaneamente e permanece no lugar, sem botão e sem envios acidentais.

Perguntas Frequentes sobre Formulários Calculadora

Os formulários calculadora surgem com frequência entre os nossos leitores. Aqui ficam as respostas a algumas das perguntas mais comuns sobre a remoção do botão de envio e o trabalho com formulários calculadora no WordPress.

Como desativo o botão de envio num formulário?

Para desativar o botão de envio no WPForms Pro, oculte-o com CSS personalizado. Vá a WPForms » Ferramentas, abra o separador Trechos de Código para aceder à Biblioteca de Trechos do WPForms e instale o trecho de ocultar o botão de envio. Em seguida, adicione a classe wpf-calc-form ao campo Classe CSS do Botão de Envio do seu formulário.

Um formulário pode não ter botão de envio?

Sim. Um formulário pode funcionar sem um botão de envio, o que é comum para calculadoras que mostram um resultado instantaneamente ou formulários que enviam automaticamente. No WPForms Pro, oculta-se o botão com um pouco de CSS adicionado através da integração WPCode incorporada, pelo que não é necessário nada extra.

Ocultar o botão de envio impede que o formulário seja enviado?

Não, ocultar o botão por si só não impede os envios. O formulário ainda pode ser enviado se um visitante pressionar a tecla Enter enquanto estiver num campo de texto. Para evitar isso, adicione um segundo trecho que impeça a tecla Enter de enviar, usando o guia do programador acima mencionado.

Posso remover o botão de envio apenas de um formulário calculadora?

Sim. O trecho só tem efeito em formulários onde adicionou a classe wpf-calc-form ao campo Classe CSS do Botão de Envio. Deixe esse campo vazio nos seus outros formulários e os seus botões de envio permanecerão exatamente como estão.

Em seguida, Aprenda Como Criar uma Calculadora Online Personalizada

Uma calculadora é uma das melhores formas de manter os visitantes no seu site, pois dá-lhes uma razão para ficar e obter a resposta a uma pergunta real.

Se quiser construir uma do zero, consulte o nosso guia sobre como fazer uma calculadora personalizada no WordPress e configure-a para o que o seu site precisar.

Crie o Seu Formulário Calculadora Agora

Pronto para construir o seu formulário? Comece hoje com o plugin construtor de formulários WordPress mais fácil. O WPForms Pro inclui muitos modelos gratuitos e oferece uma garantia de devolução do dinheiro em 14 dias.

Se este artigo o ajudou, por favor siga-nos no Facebook e Twitter para mais tutoriais e guias gratuitos do WordPress.