Como fazer um formulário que envia e‑mails automaticamente usando n8n no seu site Hostinger

Introdução Se você tem um site na Hostinger e quer automatizar o envio de e‑mails sempre que um visitante preenche um formulário, o n8n é a solução ideal. Neste artigo, vamos mostrar passo a passo como criar o formulário, conectar ao n8n e configurá‑lo para disparar mensagens de forma rápida, segura e sem necessidade de programação avançada, personalizada, flexível e total.

Preparando o ambiente na Hostinger

Antes de tocar no n8n, é preciso garantir que seu site esteja pronto para receber requisições externas. Siga estas etapas:

• Crie ou acesse sua conta na Hostinger e escolha o plano que inclui acesso SSH e cron jobs (recomendado).
• Ative HTTPS para garantir a segurança dos dados enviados pelo formulário.
• Instale o Node.js (versão 18 ou superior) via apt-get ou usando o gerenciador de pacotes da Hostinger.
• Configure o n8n:
  1. Abra o terminal SSH e execute npm install n8n -g.
  2. Crie um arquivo .env com a variável N8N_HOST=seusite.com e N8N_PORT=5678.
  3. Inicie o n8n em segundo plano: nohup n8n start &.
• Teste a instalação acessando https://seusite.com:5678. A interface visual do n8n deve aparecer.

Com o n8n rodando, você já pode criar webhooks que receberão os dados do formulário.

Construindo o formulário e integrando ao n8n

O próximo passo é criar um formulário simples em HTML e enviá‑lo para um webhook criado no n8n.

1. Crie um webhook no n8n:
   • Na interface do n8n, clique em New Workflow.
   • Adicione o nó Webhook e copie a URL gerada (ex.: https://seusite.com:5678/webhook/12345).
   • Conecte um nó Send Email, configure o servidor SMTP (Hostinger oferece SMTP gratuito) e defina os campos To, Subject e HTML usando as variáveis do webhook.
2. Insira o formulário no seu site (arquivo contato.html ou dentro do seu CMS):

   <form action="https://seusite.com:5678/webhook/12345" method="POST">
       <label for="nome">Nome:</label>
       <input type="text" id="nome" name="nome" required><br>
       <label for="email">E‑mail:</label>
       <input type="email" id="email" name="email" required><br>
       <label for="mensagem">Mensagem:</label>
       <textarea id="mensagem" name="mensagem" required></textarea><br>
       <button type="submit">Enviar</button>
   </form>
       

3. Mapeie os campos no nó Send Email usando a sintaxe {{$json["campo"]}}. Por exemplo, {{$json["nome"]}} para inserir o nome do remetente no corpo do e‑mail.
4. Salve e ative o workflow. A partir de agora, toda submissão disparará o e‑mail automaticamente.

Testando, monitorando e otimizando seu formulário

Após a configuração, é fundamental garantir que tudo funciona como esperado.

• Teste manual: preencha o formulário com dados fictícios e verifique a caixa de entrada do e‑mail configurado.
• Verifique os logs do n8n na aba Executions. Caso haja erros, ajuste
  
  Passo a passo para criar um formulário de contato automático usando n8n e Hostinger