Formulários do Carrd: envie as respostas para um backend de formulários

Os formulários do Carrd exigem um plano Pro: o Pro Standard tem formulários de contato e de inscrição, e o Pro Plus acrescenta formulários personalizados que podem enviar para qualquer URL. No Pro Plus, configure um formulário personalizado com Send to URL apontando para o seu endpoint do Ikiform, e o Carrd mantém a própria mensagem de sucesso. No Pro Standard, cole um formulário HTML num elemento Embed, o que dá campos personalizados sem fazer upgrade.

O que muda no Carrd

O Carrd não limita envios. Ele libera recursos de formulário por plano, e cada plano tem um preço anual para um certo número de sites. Em outubro de 2026, os preços e a documentação do Carrd traçam as linhas assim:

Um formulário de contato do Carrd entrega cada mensagem por e-mail a partir de @mail.carrd.site, então a sua caixa de entrada é o registro, e uma mensagem que cai no lixo eletrônico passa despercebida fácil. Esse é o motivo mais comum para migrar: você quer uma lista armazenada e pesquisável, uma exportação e alertas para a equipe toda, não uma única caixa de e-mail.

Se tudo o que você precisa é de novos inscritos no Mailchimp, no Kit ou em outra ferramenta de e-mail, o formulário Signup do Carrd já faz isso no Pro Standard e é a melhor escolha. O Ikiform não tem integrações de um clique com ferramentas de e-mail.

No Pro Plus: Send to URL

Assim você mantém o editor e o estilo de formulários do Carrd, sem código. Os campos abaixo são de um pedido de agendamento para um fotógrafo; use os seus.

1. Clique em Add Element > Form, defina Type como Custom e depois Send to URL.
2. Cole o seu endpoint como URL.
3. Defina Method como AJAX e Format como Default. O Carrd trata qualquer resposta 2xx como sucesso, e o Ikiform responde 201 quando armazena o envio.
4. Adicione os campos: Text name, Email email, Select service, Date preferred_date, Text Area details. Defina o ID de cada campo; senão o Carrd gera um a partir do rótulo.
5. Em On Success, escolha uma mensagem ou uma seção para mostrar. Em On Failure, deixe um texto genérico. O Carrd não mostra a mensagem de erro do Ikiform.
6. Publique. Os formulários só enviam a partir do site publicado.

https://ikiform.com/f/frm_xxxxxxxxxxxxxxxx

Um campo Hidden sempre envia o valor predefinido, então não funciona como honeypot aqui. A pontuação de spam, os limites de taxa e os domínios permitidos do Ikiform continuam rodando em todo envio. Deixe o Spam check do Ikiform desligado neste formulário: um envio AJAX não consegue mostrar a verificação e falharia com 403 challenge_required.

Pro Standard: um elemento Embed

No Pro Standard você não consegue montar um formulário personalizado no Carrd, mas pode colar um. Clique em Add Element > Embed, defina Type como Code e Style como Inline, e cole isto. Ele traz os próprios estilos, porque os estilos de formulário do Carrd não chegam ao código incorporado.

<form id="booking" action="https://ikiform.com/f/frm_xxxxxxxxxxxxxxxx" method="post" target="_top">
  <input name="name" placeholder="Name" autocomplete="name" required>
  <input name="email" type="email" placeholder="Email" autocomplete="email" required>
  <select name="service" required>
    <option value="" disabled selected>What do you need?</option>
    <option value="portrait">Portrait session</option>
    <option value="event">Event coverage</option>
    <option value="product">Product photos</option>
  </select>
  <input name="preferred_date" type="date" aria-label="Preferred date">
  <textarea name="details" rows="4" placeholder="Anything else?" maxlength="2000"></textarea>
  <input name="_gotcha" type="text" tabindex="-1" autocomplete="off" hidden>
  <button type="submit">Request a booking</button>
  <p id="booking-note" role="status"></p>
</form>
<style>
  #booking { display: grid; gap: 0.75rem; font: inherit; }
  #booking input, #booking select, #booking textarea { font: inherit; padding: 0.75rem; border: 1px solid #ccc; border-radius: 0.5rem; }
  #booking button { font: inherit; padding: 0.75rem; border: 0; border-radius: 0.5rem; background: #111; color: #fff; }
</style>
<script>
  const booking = document.getElementById("booking");
  booking.addEventListener("submit", async (event) => {
    event.preventDefault();
    const note = document.getElementById("booking-note");
    note.textContent = "Sending";
    try {
      const response = await fetch(booking.action, {
        method: "POST",
        headers: { Accept: "application/json" },
        body: new FormData(booking),
      });
      const result = await response.json();
      if (result.ok) {
        booking.replaceChildren("Thanks. I'll reply with availability.");
        return;
      }
      const fields = result.error.fields ?? {};
      note.textContent = fields.preferred_date?.[0] ?? fields.email?.[0] ?? result.error.message;
    } catch {
      note.textContent = "Couldn't send. Try again, or email me directly.";
    }
  });
</script>

• O script envia com fetch e troca o formulário pela frase de agradecimento, então a página não muda.
• O input oculto _gotcha é um honeypot de verdade aqui, ao contrário de um campo Hidden do Carrd.
• Se o script não carregar, o formulário ainda envia normalmente. target="_top" impede que o resultado abra dentro de um frame.
• Embeds não rodam no editor do Carrd. Publique para ver o formulário.

As duas versões enviam os mesmos campos. Defina-os no Ikiform assim que um teste chegar:

Domínios permitidos no Carrd

Adicione your-site.carrd.co, ou your-site.crd.co no Pro, e o seu domínio próprio. Não adicione carrd.co sozinho; isso permitiria que qualquer site do Carrd enviasse. O guia do Carrd na documentação lista cada configuração com o motivo.

Confira se funciona no Carrd

1. Em Allowed domains do formulário, adicione o domínio do seu site, mais localhost enquanto desenvolve. Deixe vazio para aceitar envios de qualquer lugar.
2. Publique e envie o formulário no site publicado.
3. Confirme que o Carrd mostra o On Success, ou que o embed mostra a frase de agradecimento.
4. Abra Submissions no painel. O novo envio está lá com todos os campos que você enviou.
5. Confira se os nomes são os seus IDs, se preferred_date aparece como 2026-11-14 e se nenhum campo utm_ chegou sem você esperar.
6. Confira a caixa de entrada de cada destinatário das notificações. Cada um recebe um e-mail com os campos, e Reply vai para quem enviou quando o formulário tem um campo email.

Pegadinhas

Perguntas