Menú
Crear mi primer formulario
Comercialización

Un formulario de suscripción al boletín con consentimiento claro

Recopile una dirección de correo electrónico para un boletín informativo claramente descrito manteniendo el propósito de registro separado de las solicitudes de contacto generales.

Vista previa local: los cambios permanecen en este navegador. No se envía ningún mensaje o correo electrónico.

Suscripción al boletín

Haz crecer tu lista con consentimiento claro.

1 / 1
LittleReply
Personaliza la plantilla
Etiquetas y campos obligatorios

Agregue su identidad, propósito, base aplicable, retención, contacto de derechos y enlace de privacidad. Este ejemplo no es un consejo legal.

HTML/CSS independiente
<!doctype html>
<html lang="es"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Formulario de contacto</title>
<style>form[data-littlereply]{max-width:640px;margin:2rem auto;padding:1.5rem;font:16px/1.6 system-ui,sans-serif;color:#202033;background:white;border:1px solid #e4e4ee;border-radius:16px;box-sizing:border-box}form[data-littlereply] label{display:block;margin-top:1rem;font-weight:600}form[data-littlereply] input,form[data-littlereply] textarea,form[data-littlereply] select{box-sizing:border-box;width:100%;padding:.75rem;font:inherit;border:1px solid #727285;border-radius:8px;background:white;color:#202033}form[data-littlereply] input[type=checkbox],form[data-littlereply] input[type=radio]{width:auto}form[data-littlereply] button{margin-top:1rem;padding:.8rem 1.1rem;font:inherit;font-weight:600;border:0;border-radius:8px;background:var(--form-accent,#4f46e5);color:white;cursor:pointer}form[data-littlereply] :focus-visible{outline:3px solid #f59e0b;outline-offset:3px}form[data-littlereply] button:disabled{opacity:.6}form[data-littlereply] [role=status]{min-height:1.6em}form[data-littlereply] fieldset{border:0;padding:0}form[data-littlereply] .privacy-notice{font-size:.875rem;color:#4b4b60}
form[data-littlereply]{--form-accent:#4f46e5;--form-ink:#ffffff}
form[data-littlereply] button{color:var(--form-ink)}form[data-littlereply] button[data-fq-back]{background:#eee;color:#202033}form[data-littlereply] [hidden]{display:none}</style></head><body>
<form action="https://littlereply.com/api/submit" method="POST" data-littlereply="YOUR_ACCESS_KEY" data-locale="es" data-success="Hemos recibido tu mensaje.">
  <input type="hidden" name="_fq_key" value="YOUR_ACCESS_KEY" />
  <input type="text" name="botcheck" tabindex="-1" autocomplete="off" style="display:none" aria-hidden="true" />

  <label for="newsletter-email">Correo electrónico *</label>
  <input type="email" name="email" id="newsletter-email" required />

  <label for="newsletter-consent">Acepto la política de privacidad. *</label>
  <input type="checkbox" name="consent" id="newsletter-consent" required value="true" />

  <button type="submit">Enviar mensaje</button>
  <p role="status" aria-live="polite"></p>
</form>
<!-- Errores AJAX accesibles y reintentos sin duplicados -->
<script src="https://littlereply.com/client/v1.js" data-api="https://littlereply.com" defer></script>
</body></html>

Reemplace YOUR_ACCESS_KEY con la clave pública de su formulario. El código incluye sus estilos y una mejora AJAX; el HTML POST nativo también funciona sin JavaScript.

Instalar esta plantilla

  1. Nombra el boletín y explica qué recibirán los suscriptores.
  2. Almacene la evidencia requerida por las reglas que se aplican a su audiencia y configuración de envío.
  3. Utilice una integración de lista dedicada y pruebe el comportamiento de cancelación de suscripción antes de la promoción.
  4. Select “Use this template” to carry the current configuration into signup.
  5. Verify recipients, publish the form, and replace the example key in the generated code.
  6. Send a recognizable test and inspect storage and delivery separately.

Preguntas frecuentes

¿Esta plantilla envía un envío real en vista previa?

No. La vista previa pública permanece en su navegador. Cree y publique un formulario antes de usar su clave pública en un sitio en vivo.

¿Puedo cambiar los campos y el estilo?

Sí. Personalice las etiquetas, los requisitos, los colores, el texto de confirmación y el esquema publicado antes de instalar el código generado.