El complemento proporciona el [mautic_woo_subscribe] Código corto para insertar formularios de suscripción por correo electrónico en cualquier página o publicación. Cuando un visitante envía el formulario, su dirección de correo electrónico se envía a Mautic como un contacto nuevo o actualizado con etiquetas opcionales aplicadas.
El código corto [mautic_woo_subscribe]
Este código corto muestra un sencillo formulario de suscripción por correo electrónico con un campo para introducir la dirección de correo electrónico, una casilla de consentimiento opcional y un botón para enviar. El formulario se envía a través de AJAX, por lo que la página no se recarga. Tras el envío, se muestra un mensaje de éxito o de error en línea.
El código corto requiere el Formulario de suscripción Opción que se debe habilitar en la pestaña de configuración de Contact Sync. Cuando está deshabilitada, el código corto no se registra y se muestra como texto sin formato.
Atributos
El código corto acepta cuatro atributos. Todos son opcionales.
etiqueta
- Tipo: cadena
- Predeterminado:
""(cadena vacía) - Descripción: Una etiqueta de Mautic que se aplicará al contacto cuando se suscriba a través de este formulario. Esta etiqueta se aplica además de la etiqueta predeterminada configurada en los ajustes de sincronización de contactos. Si se deja en blanco, solo se aplicará la etiqueta predeterminada.
texto
- Tipo: cadena
- Predeterminado:
"Subscribe" - Descripción: El texto que aparece en el botón Enviar.
marcador de posición
- Tipo: cadena
- Predeterminado:
"Email address" - Descripción: El texto de marcador de posición que aparece dentro del campo de entrada del correo electrónico antes de que el usuario escriba algo.
consent
- Tipo: cadena
- Predeterminado:
""(cadena vacía) - Descripción: Cuando se proporciona, se muestra una casilla de consentimiento debajo del campo de correo electrónico con este texto como etiqueta. La casilla no es obligatoria por el código corto en sí, pero está disponible para sus propias necesidades de cumplimiento. Si se deja vacía, no se muestra ninguna casilla.
Ejemplos de uso
Uso básico
Renderiza un formulario de suscripción con todos los ajustes predeterminados. El botón dice «Suscribirse», el marcador de posición dice «Dirección de correo electrónico» y solo se aplica la etiqueta predeterminada de los ajustes de Sincronización de contactos.
[mautic_woo_subscribe]
Etiqueta personalizada
Aplica una etiqueta específica a los contactos que se suscriban a través de este formulario. Se aplicará la etiqueta «boletín informativo» junto con cualquier etiqueta predeterminada configurada en los ajustes.
[mautic_woo_subscribe tag="newsletter"]
Texto personalizado del botón y marcador de posición
Personaliza el texto del botón y el marcador de posición de entrada para diferentes contextos, como un imán de clientes potenciales o contenido restringido.
[mautic_woo_subscribe text="Get the Guide" placeholder="Enter your email"]
Con casilla de verificación de consentimiento
Incluye una casilla de verificación de consentimiento para el RGPD u otro cumplimiento normativo. La etiqueta de la casilla de verificación la establece el atributo consent atributo.
[mautic_woo_subscribe consent="I agree to receive marketing emails"]
Todos los atributos combinados
Utilice los cuatro atributos juntos para una personalización completa.
[mautic_woo_subscribe tag="vip" text="Join Now" placeholder="Your best email" consent="I agree to marketing emails and the privacy policy"]
Estructura HTML generada
El código corto genera la siguiente estructura HTML. El data-tag El atributo del elemento del formulario almacena el valor de la etiqueta para el controlador AJAX.
<form class="mautic-woo-subscribe-form" data-tag="newsletter" action="">
<input type="email" name="email" placeholder="Dirección de correo electrónico" required>
<label class="mautic-woo-subscribe-consent">
<input type="checkbox" name="consent" value="1"> Acepto recibir correos electrónicos de marketing.
</label>
<button type="submit">Suscríbete</button>
<span class="mautic-woo-subscribe-result"></span>
<input type="hidden" name="trp-form-language" value="es"/></form>
La etiqueta de consentimiento y la casilla de verificación solo se incluyen cuando el consent El atributo se proporciona con un valor no vacío.
Estilo
El código corto pone en cola dos activos cuando se renderiza el formulario:
mautic-woo-subscribe(JavaScript) – Gestiona el envío del formulario AJAX.mautic-woo-subscribe(CSS): proporciona el estilo predeterminado para el formulario.
Puede anular los estilos predeterminados de su tema seleccionando las clases CSS: .mautic-woo-subscribe-form, .mautic-woo-subscribe-consent, y .mautic-woo-subscribe-result.
Captura de formularios
Además del código corto, el complemento ofrece una función de captura de formularios que se puede añadir a cualquier formulario HTML existente. Para utilizarla, agregue el data-mautic-woo atribuir a cualquier <form> elemento en tu sitio. Opcionalmente, puedes agregar data-mautic-woo-tag="tagname" para aplicar una etiqueta Mautic específica cuando se envíe el formulario.
<form action="/contact" method="post" data-mautic-woo data-mautic-woo-tag="lead">
<input type="email" name="email" placeholder="Email">
<button type="submit">Submit</button>
</form>
Form Capture requiere el Captura de formularios Opción que se debe habilitar en la pestaña de configuración de Contact Sync. Cuando está habilitada, el JavaScript de captura se carga automáticamente en todas las páginas frontend.