Un formulario HTML para tu web estática, sin backend propio

La web es estática; la recepción necesita un servicio

HTML muestra los campos, pero no guarda mensajes ni envía correos por sí solo. Formgong asume esas tareas. Este enfoque sirve para portfolios, páginas de servicios y formularios de texto.

Si ya tienes un backend con reglas específicas, puedes utilizarlo. El ejemplo evita añadir uno nuevo solo para recibir consultas.

Antes de copiar el ejemplo

Crea el formulario en Formgong, verifica tu correo y copia su clave desde la conexión de la web. Reemplaza fk_your_access_key. La clave puede quedar en HTML porque es pública; un correo sin verificar puede retener los avisos.

Añade el formulario a la página

Coloca el código en la sección de contacto y añade tus clases CSS. Puedes cambiar las etiquetas visibles, manteniendo los nombres de los campos. Esta versión envía texto, no archivos.

<form action="https://formgong.com/submit" method="POST">
  <input type="hidden" name="access_key" value="fk_your_access_key">
  <label>Name <input type="text" name="name" required></label>
  <label>Email <input type="email" name="email" required></label>
  <label>Message <textarea name="message" required></textarea></label>
  <div aria-hidden="true" style="position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden">
  <label>Leave this field empty<input type="text" name="botcheck" tabindex="-1" autocomplete="off"></label>
</div>
  <button type="submit">Send</button>
</form>

Los atributos que hacen posible el envío

action indica el destino, method="POST" el método y name identifica cada dato. Un id por sí solo no basta. Para un teléfono puedes añadir name="phone".

El campo botcheck debe estar fuera de la pantalla y vacío. Es una trampa para bots, no un campo que deba completar el visitante.

Elige qué ocurre después

Sin ajustes adicionales se abre la página de resultado de Formgong. Para una página propia, configura su URL HTTPS completa. También puedes usar _redirect; si el panel ignora direcciones enviadas por el formulario, prevalece el ajuste del panel.

Para permanecer en la misma página, necesitas fetch y estados de interfaz. La guía de diagnóstico incluye un ejemplo.

Comprueba la web publicada

Envía una consulta reconocible desde el dominio real. Búscala en el formulario correcto, el correo y el spam. Revisa en el móvil los campos, el botón y el agradecimiento. Puedes sumar un canal con la conexión de Telegram.

Si activas protección, actualiza el código

Turnstile requiere un widget y cf-turnstile-response; el honeypot del ejemplo no lo sustituye. Obtén el código actualizado del panel. Si usas una lista de dominios permitidos, incluye el dominio publicado; el editor puede tener otro.