Wix

O Wix Forms guarda os envios no Wix e não tem configuração para uma URL de action externa. Para usar o Ikiform, coloque seu próprio formulário em um elemento Embed HTML. O Wix roda esse código dentro de um iframe isolado (sandbox), servido a partir de um host separado filesusr.com, e isso define tudo o que vem abaixo.

Por que o formulário envia com fetch

• O frame do Wix permite formulários, scripts, popups e acesso same-origin, mas não navegação no nível superior. target="_top" não consegue levar o visitante a uma página de agradecimento.
• Um envio de formulário normal carregaria o resultado dentro do pequeno frame, e as páginas de agradecimento, de erro e de verificação do Ikiform se recusam a renderizar dentro de frames. Os visitantes veriam um frame vazio ou recusado.
• Enviar com fetch e Accept: application/json mantém o visitante no lugar e mostra o resultado dentro do embed.

Adicione o embed

1. Adicione um elemento Embed HTML

   No Wix Editor, abra Add Elements > Embed Code > Embed HTML. No Wix Studio, fica em Embed & Social. Escolha Code em vez de Website address.

2. Cole o formulário

   <form id="contact" action="https://ikiform.com/f/frm_xxxxxxxxxxxxxxxx" method="post" novalidate>
     <label>Email <input name="email" type="email" autocomplete="email" required /></label>
     <p class="error" data-error-for="email"></p>
     <label>Message <textarea name="message" rows="4"></textarea></label>
     <p class="error" data-error-for="message"></p>
     <input name="_gotcha" type="text" tabindex="-1" autocomplete="off" hidden />
     <button>Send</button>
     <p role="status" data-status></p>
   </form>
   
   <script>
     const form = document.querySelector("#contact");
     const button = form.querySelector("button");
     const status = form.querySelector("[data-status]");
   
     form.addEventListener("submit", async (event) => {
       event.preventDefault();
       button.disabled = true;
       status.textContent = "Sending";
       try {
         const response = await fetch(form.action, {
           method: "POST",
           headers: { Accept: "application/json" },
           body: new FormData(form),
         });
         const result = await response.json();
         const fields = result.ok ? {} : result.error.fields ?? {};
         for (const slot of form.querySelectorAll("[data-error-for]")) {
           slot.textContent = fields[slot.dataset.errorFor]?.[0] ?? "";
         }
         status.textContent = result.ok ? "Thanks, we got it." : result.error.message;
         if (result.ok) form.reset();
       } catch {
         status.textContent = "Couldn't reach the server. Try again.";
       } finally {
         button.disabled = false;
       }
     });
   </script>
   
   <style>
     body { margin: 0; font: 15px/1.5 system-ui, sans-serif; }
     form { display: grid; gap: 8px; }
     label { display: grid; gap: 4px; }
     input, textarea, button { font: inherit; padding: 8px 10px; border: 1px solid #d4d4d4; border-radius: 6px; }
     button { background: #111; color: #fff; border: 0; }
     .error { margin: 0; color: #b42318; font-size: 13px; }
   </style>

   O frame não herda as fontes nem as cores do seu site, então o bloco <style> as define. Ajuste para combinar com o seu site.

3. Dimensione e publique

   Arraste o elemento até ele ficar alto o bastante para caber os erros de campo e a linha de status, depois publique. O editor só mostra um placeholder para código personalizado, então teste no site publicado.

Configurações de spam

Deixe a verificação de spam do formulário desativada. A verificação humana do Ikiform precisa da página de verificação ou de um pequeno frame de ikiform.com, e nenhum dos dois roda dentro do sandbox do Wix. O honeypot e a pontuação de spam continuam rodando em todo envio.

Domínios permitidos

O Ikiform vê o host do frame, não o seu domínio do Wix, porque o envio sai de dentro do iframe. Para descobri-lo, abra a página publicada, inspecione o embed e leia o src do iframe.

• Nunca adicione filesusr.com sozinho. Todo site naquele host corresponderia, inclusive os de outras pessoas.
• O host do frame é derivado do endereço do seu site, então muda se você conectar um domínio novo. Confira de novo depois de trocar de domínio.

Checklist de teste

1. Publique e abra a página no ar em uma janela anônima.
2. Com campos definidos, envie com o e-mail vazio. O formulário tem novalidate, então a mensagem do Ikiform deve aparecer abaixo do campo.
3. Envie uma mensagem real e confirme que a linha de status mostra "Thanks, we got it." e que o envio aparece no Ikiform.
4. Ative os domínios permitidos com o host do frame e envie de novo. O envio deve continuar chegando como recebido.

Solução de problemas

Relacionados

• JavaScript purofetch com erros inline.
• Criadores de sitesO embed que funciona em qualquer criador.
• Domínios permitidosComo as origens são comparadas e o que acontece quando não correspondem.
• Proteção contra spamHoneypot, pontuação e a verificação humana.