Principais Elementos e Atributos:
https://formspree.io/account >>>> Servidor de Envio de Formulários
- Faça login na sua conta em formspree.io.
- No painel, clique no formulário que você criou.
- Vá para a aba “Integration” (Integração) na parte superior.
- O ID/endpoint do seu formulário estará listado logo abaixo de: “Your form’s endpoint is:”.
- O formato será algo como
https://formspree.io/f/{seu-id-aqui}
<form>: A tag principal que envolve todo o formulário.action: URL para onde os dados serão enviados.method: Define como enviar (oPOSTé mais seguro para dados confidenciais,GETé usado para buscas).<label>: Define um rótulo para o campo, melhorando a acessibilidade (atributofordeve coincidir com oiddo input).<input>: Campo de entrada versátil. Usetype="text",type="email",type="password",type="number", etc..placeholder: Texto de dica exibido dentro do campo.required: Atributo booleano que torna o preenchimento obrigatório.
Os dados coletados pelo Formspree são enviados para o servidor da plataforma Formspree, que os processa e encaminha por e-mail para o endereço cadastrado. Além do e-mail, os dados ficam armazenados no painel do Formspree e podem ser integrados a serviços de terceiros, como Mailchimp ou Google Sheets.
Formspree +4
Detalhes do processo:
- Destino Principal: E-mail configurado na conta Formspree.
- Armazenamento: Os envios ficam salvos no seu dashboard no site formspree.io.
- Segurança: A plataforma valida os dados (incluindo reCAPTCHA), e envia apenas formulários legítimos, filtrando spam.
- Integrações: Os dados podem ser encaminhados automaticamente para outras ferramentas usando webhooks ou integrações nativas.
<form action="https://formspree.io/f/seu-id-aqui" method="POST">
<form action=”/enviar-dados” method=”POST”>
<!– Campo Nome –>
<label for=”nome”>Nome:</label><br>
<input type=”text” id=”nome” name=”nome” placeholder=”Digite seu nome” required><br><br>
<!– Campo Email –>
<label for=”email”>Email:</label><br>
<input type=”email” id=”email” name=”email” placeholder=”seu@email.com” required><br><br>
<!– Campo de Mensagem –>
<label for=”mensagem”>Mensagem:</label><br>
<textarea id=”mensagem” name=”mensagem”></textarea><br><br>
<!– Botão de Envio –>
<button type=”submit”>Enviar</button>
</form>