Cómo conectar tu formulario HTML

Formulario de contacto para Hugo

Hugo genera páginas estáticas, así que no hay ningún servidor que pueda recibir un formulario enviado. De esa parte se encarga FormPost – su formulario nos envía los datos y nosotros se los reenviamos por correo electrónico.

Preparación: cree un formulario en FormPost

Regístrese en FormPost, cree un formulario e indique el dominio en el que está su sitio. A continuación le mostramos la dirección de su formulario. Sustituye a https://www.formpost.eu/f/abc123 en el código de abajo; no hay que cambiar nada más.

1. Crear el shortcode

El formulario va en un shortcode. Así puede insertarlo desde cualquier página Markdown sin escribir HTML en el contenido.

layouts/shortcodes/contact-form.html
<form action="https://www.formpost.eu/f/abc123" method="POST">
  <label for="email">Correo</label>
  <input type="email" id="email" name="email" required>

  <label for="message">Mensaje</label>
  <textarea id="message" name="message" required></textarea>

  <input type="text" name="_gotcha" style="display:none;" tabindex="-1" autocomplete="off">

  <button type="submit">Enviar</button>
</form>

2. Insertar el shortcode en una página

Escriba el shortcode en el lugar de su página de contacto donde deba aparecer el formulario. Si prefiere usarlo en una plantilla, guarde el mismo archivo en layouts/partials/ e insértelo con {{ partial "contact-form.html" . }}.

content/contact.md
{{< contact-form >}}

Conviene saber

  • Por defecto, Hugo no muestra el HTML escrito directamente en Markdown. El shortcode lo evita sin tener que cambiar el ajuste markup.goldmark.renderer.unsafe.
  • Solo aceptamos envíos desde el dominio indicado. Los envíos desde el servidor de desarrollo local (hugo server en localhost) se rechazan; para probar, utilice el formulario de prueba de su área de cliente.
  • El formulario no trae CSS propio y adopta el estilo de su tema. Puede añadir clases y más campos en el shortcode como quiera.

Lo que FormPost todavía no hace

  • Los formularios se envían de forma clásica, es decir, cambiando de página. De momento no admitimos el envío en segundo plano con JavaScript.
  • No aceptamos archivos adjuntos.
  • FormPost no recoge el consentimiento de tus visitantes. El aviso en tu propia política de privacidad sigue siendo cosa tuya; el texto para ello lo tienes ya redactado junto a tu formulario.

Más guías y comparativas

Crea un formulario y pruébalo

El plan Free cubre un formulario con diez avisos al día y no cuesta nada, de forma permanente.