🛠️ Cómo crear un formulario de suscripción a tu newsletter con Sagicc

¿Quieres captar correos electrónicos desde tu página web y que lleguen directamente a Sagicc? Aquí te explicamos cómo hacerlo paso a paso con un formulario conectado a una campaña tipo newsletter. Es ideal para enviar boletines, automatizaciones o promociones desde Sagicc Academy o cualquier unidad de tu negocio.

Perfecto. A continuación te dejo el contenido listo para pegar en WordPress usando Gutenberg (editor por bloques). Está dividido con títulos, listas, botones y resaltados para una lectura fluida y profesional, ideal para Sagicc Academy.

🛠️ Cómo crear un formulario de suscripción a tu newsletter con Sagicc #

¿Quieres captar correos electrónicos desde tu página web y que lleguen directamente a Sagicc? Aquí te explicamos cómo hacerlo paso a paso con un formulario conectado a una campaña tipo newsletter. Es ideal para enviar boletines, automatizaciones o promociones desde Sagicc Academy o cualquier unidad de tu negocio.

📌 ¿Qué vas a necesitar? #

• Acceso a tu cuenta de Sagicc.
• Un sitio web donde incrustar el formulario (por ejemplo, tu página en WordPress).
• Tener creada una campaña en Sagicc.
• Crear un canal tipo Website.

🧩 Paso 1: Crea tu campaña en Sagicc #

1. Ve a la sección Campañas.
2. Crea una nueva llamada, por ejemplo:
   Sagicc Academy Newsletter
3. Esta campaña debe estar separada de tu operación principal.
4. Solo se registrará el correo electrónico del usuario. Campos como nombre o teléfono estarán vacíos con valor "-".

⚠️ Recomendación: Evita usar este tipo de formularios en campañas activas de atención o marketing complejo. Al no tener nombres ni teléfonos reales, puede afectar tus flujos de segmentación.

🌐 Paso 2: Crea un canal tipo Website #

1. Ve a Canales → Crear nuevo canal.
2. Selecciona Tipo: Website.
3. Nómbralo como:
   Sagicc Academy Newsletter
4. Deja en blanco el campo Canal de salida.
5. Asocia la campaña que acabas de crear.

⚙️ Paso 3: Configura el Token y el Dominio #

En la configuración del canal Website:

• Token: Esta clave enlazará tu formulario con Sagicc. Cópialo, lo necesitas en el HTML.
• Dominio: Es la URL donde estará embebido el formulario, por ejemplo:
  https://tusitio.com/newsletter

🧑‍💻 Paso 4: Usa este formulario HTML #

Este formulario está listo para copiar y pegar en tu sitio web. Solo reemplaza dos valores

🔄 Reemplaza: #

<form id="sagicc-form-captcha" enctype="multipart/form-data" onsubmit="submitSagiccForm(event)">
  <!-- Token personalizado -->
  <input type="hidden" id="sagicc_token" name="sagicc_token" value="TU_TOKEN_AQUÍ"> 

  <!-- Campos obligatorios vacíos -->
  <input type="hidden" name="nombre" value="-">
  <input type="hidden" name="apellido" value="-">
  <input type="hidden" name="telefono" value="-">

  <!-- Campo visible -->
  <div style="display: flex; gap: 0.5rem; align-items: center;">
    <input type="email" id="email" name="email" placeholder="Ingresa tu correo" required
      style="flex: 1; height: 40px; padding: 10px; font-size: 1rem; border: 1px solid #ccc; border-radius: 20px;" />

    <button type="submit"
      style="height: 40px; padding: 0 20px; background-color: white; border: 2px solid #5370FF; color: #5370FF; font-weight: normal; border-radius: 20px; cursor: pointer; font-size: 1rem; transition: background-color 0.3s ease, color 0.3s ease;"
      onmouseover="this.style.backgroundColor='#5370FF'; this.style.color='white';"
      onmouseout="this.style.backgroundColor='white'; this.style.color='#5370FF';">
      Suscribirse
    </button>
  </div>
</form>

<script>
  function submitSagiccForm(event) {
    event.preventDefault();

    const endpoint = 'https://TU_SUBDOMINIO.sagicc.co/api/v2/canal-website/website-callback';

    fetch(endpoint, {
      method: 'POST',
      body: new FormData(document.getElementById('sagicc-form-captcha')),
    }).then(function (response) {
      if (response.status === 200) {
        alert('Gracias por suscribirte.');
        document.getElementById('email').value = '';
      } else {
        alert('Ocurrió un error. Inténtalo nuevamente.');
      }
    }).catch(function (err) {
      alert('Error en el envío: ' + err);
    });
  }
</script>

🧠 Consejo extra #

Puedes embeber este formulario en cualquier página de WordPress usando el bloque “HTML personalizado” en Gutenberg.

• Abre la página donde quieres insertarlo.
• Agrega un nuevo bloque → HTML personalizado.
• Pega allí el código del formulario.
• ¡Publica y prueba!

📨 ¿Y luego qué? #

Una vez el formulario esté en línea:

• Los correos que ingresen llegarán a tu campaña.
• Desde allí puedes activar respuestas automáticas, flujos de bienvenida o campañas de email marketing desde Sagicc.

🎯 ¿Quieres probarlo? #

👉 Suscríbete tú mismo al newsletter y revisa si llega a tu campaña.
Así verificas que esté todo bien conectado.