Logo Marieu Corp
Tutorial

🥇¡La mejor estrategia para tu Formulario con Elementor, MailerLite, Gmail y WordPress!

Formulario en WordPress. Instalación Plugin MailerLite. Con vídeo paso a paso.

 

ELEMENTOR

FORMULARIO

Ene 06, 2024

Montoya A.

20min de lectura

Reproducir video acerca de Formulario en Elementor

Hola amigos de Marieú Technology Corporation, ¡la mejor mejor estrategia para tu formulario con Elementor, MailerLite, Gmail y WordPress! De hecho, en esta guía, paso a paso, aprenderás cómo configurar el plugin de MailerLite en Elementor y WordPress.

MailerLite es una plataforma de sevicios de marketing digital por correo electrónico. Entre algunas herramientas que proporciona son las campañas de emails, segmentación de suscriptores, formularios integrados, entre otros. La instalación del formulario de registro del plugin de MailerLite se realiza por medio de WordPress. Donde, podrás integrar un formulario en tu página y almacenar suscriptores.

¿Cuál es la estrategia para integrar un formulario de MailerLite con Elementor, Gmail y WordPress?

Entonces, aquí tenemos el diagrama de arquitectura de html, Gmail, WordPress y MailerLite. Tenemos dos opciones para hacer esta conexión, la primera, vemos por aquí, si nosotros integramos dentro de elementor, incluimos un widget de editar form o editar formulario. Dentro de eso te aparece la opción de incluir MailerLite, ¡aquí está! Podemos agregar la opción de MailerLite e, internamente, podemos agregar el API Key. Con el API Key, que nosotros generamos en MailerLite, podemos encontrar todos los fields o los campos dentro del formulario.

Entonces, si nosotros hemos agregado campos importantes como nombre, emails, DNI, edad, fecha de nacimiento, si estos campos hacen un match y si coinciden o concuerdan, con los campos que están dentro de mailer, se habilita, ¡ahí está! En este caso, simplemente el formulario es de nombre, email y ambos se han activado. Lamentablemente, ¿porqué hemos descartado esta alternativa? dado que, solamente almacena subscriber o suscriptores, pero no nos permite enviar de forma segura a nuestro correo. Salvo que, instalemos un SMTP o protocolo de transferencia simple de correo.

Diagrama de Arquitectura HTML Gmail WordPress MailerLite scaled

Diagrama de Arquitectura: HTML, Gmail, Wordpress y Mailerlite.
Fuente: Propia, mediante software Miro.

Si nosotros instalamos el protocolo, fácilmente podríamos recepcionar los correos en nuestro Gmail, sin alguna alerta. ¿Cuál sería esa alerta si no instalamos ese protocolo?, tendríamos lo siguiente, este mensaje. Entonces nosotros lo queremos, de repente, enviar al cliente y tengamos una alerta de este mensaje: «tenga cuidado de este mensaje». La idea es que sea de confianza y no nos brinde este mensaje, cuando nosotros enviamos este correo al cliente. Entonces, por eso es que hemos descartado esta opción, porque se tiene que instalar un plugin adicional. Solo almacenan suscriptores, pero no insertar html con funcionalidad de unsubscribe. De hecho, podemos insertar un html, pero no habría la posibilidad de funcionalidad de poner un unsubscribe.

¿Cuál sería la otra alternativa que nosotros estamos, que nosotros ya lo hemos implementado? es mediante el plugins de MailerLite. Cuando instalamos el plugin ya hay una autenticación del dominio, porque viene desde la misma plataforma. Lo incluimos dentro de elemento con el shortcodes, este es el código, súper sencillo. Este es el código genérico para todos. De repente si hay un segundo formulario, simplemente cambia el ID igual a 2. De momento solamente es el ID igual a 1.

Entonces, una vez que lo colocas el ID igual a 1, al conectar con MailerLite ya no te llegan algunos mensajes de la falta de autenticación o sin firmado por el mismo dominio. Si hacemos el tipo de conexión mediante el plugin de MailerLite ¿Cómo llegaría el mensaje? tenemos el modelo aquí. Entonces, yo no te aparece el mensaje. Incluimos un html y ya no te aparece el mensaje de alerta y la falta de confianza. Principalmente, ¿por qué? Dado que en este caso aparece firmado por el mismo dominio. Hacemos un comparativo, aquí no te aparece el «firmado por». Entonces, nos quedamos con esta opción.

Bien, entonces, ahora vamos a iniciar. Para hacer toda la integración, tenemos que tener nuestro formularios dentro del MailerLite. En MailerLite simplemente se suscriben, ingresan sus datos y ya tienen su cuenta. Tiene un plan free de 30 días, llamado prueba y, después de eso, ya puedes escoger algún plan que nos ofrece MailerLite. Entonces, si nosotros aprovechamos estos primeros 30 días, podemos configurar lo siguiente. Entramos a form y en formularios vamos a crear.

Una vez que creamos nuestro formulario, con datos básicos, va a depender de cada uno de ustedes, vamos a tener lo siguiente. En este caso, nosotros hemos creado dos. El segundo es un test que hemos estado generando, pero, para el primero, creamos un formulario básico. Abrimos, ponemos «preview» y tenemos un formulario básico: nombre, correo y checkbox, para que puedan aceptar los términos y condiciones, y política de privacidad, además, su botón de enviar. Entonces, ¿cómo podemos compartirlo directamente? si no queremos insertarlo directamente a Elementor, copiamos aquí el enlace. Entonces, una vez que tengamos ya el formulario creado, nosotros lo vamos a insertar mediante el shortcode.

Ahora, en WordPress nosotros vamos a instalar el plugin de MailerLite. En nuestro caso, ya le hemos instalado pero vamos a mostrarles cómo ustedes tienen que instalarlo. Añadir nuevo y vamos a poner MailerLite, ¡aquí está!: Signup forms (oficial), para formularios. Una vez que se instalan el plugin de MailerLite, para formularios, lo activan y no vamos a ir aquí, en la parte inferior abrimos el MailerLite. Cuando confirmamos inicialmente el MailerLite, le va a pedir que usen sus cuentas, sus credenciales. Una vez que ingresen sus credenciales, ya pueden ustedes visualizar los formularios, ¿esta bien?

Entonces aquí vamos a encontrar varios formularios, en el caso que hayan creado varios formularios. En nuestro caso, hemos puesto uno para la página principal. Si ponemos editar, ahí lo vamos a ver, ¡ahí está!, lo hemos visto en MailerLite. ¿Cómo lo van ustedes activar?, por ejemplo, nuestro ID, en este caso es 2 porque había un error con el primero y tuvimos que formular una segunda. Entonces, en este caso sería ID igual a dos. Cuando ustedes ingresen el API Keys, se va a vincular con su formulario de MailerLite.

¿Cómo nosotros ingresamos el API Keys?, mediante lo siguiente. Este es formulario y para la API Keys lo generan aquí, integración y donde dice API. Ponemos «use», creamos uno nuevo. Cuando te creas uno nuevo, te aparece un archivo .txt, dentro del .txt aparece todo el código de la API y copian ese código de API.

Configuracion Formulario plugin MailerLite scaled

Configuración del formulario MailerLite en WordPress.
Fuente: Propia, mediante software MailerLite.

Resultados Finales

Nosotros tenemos, por ejemplo, tres, hemos creado tres. Una vez que tengan el código del API, lo van a pegar directamente aquí: settings, pegan, actualizamos el API Keys y te aparece todos los formularios que están vinculados a tu cuenta. Ya cuando quieren ingresar directamente a la página de Home o principal, vamos a ir a páginas. Nosotros ingresamos a principal, ¡ahí está principal!

¿Dónde debemos incluir formulario?, vamos a aterrizar el formulario. Abrimos el navigator, más o menos en esta sección, un poco más, y ¡ahí está!. ¿Cómo nosotros incluimos desde cero un shortcode?, recuerden que lo vimos en la anterior vídeo. Ponemos widgets y shortcode, seleccionamos y soltamos. Una vez que ingresen ahí el shortcode, les va a aparecer así, para que puedan ingresar.

Formulario MailerLite y Elementor scaled

Resultados formulario MailerLite y Elementor.
Fuente: Propia, mediante software MailerLite y Elementor.

En nuestro caso, como habíamos comentado, es el ID igual a dos, mailerlite_form form_id=2, aplicamos y ¡ya está! Hay un detalle, no se ve la vista previa, pero si nosotros queremos visualizarlo ya, directamente, en la página, ponemos aquí «previsualizar cambios». No se ve en la vista previa de edición, pero si se ve en la vista previa de toda la página completa, ¡ahí está! Ya se incluyó el formulario. ¡Listo, gracias amigos de Marieú Technology Corporation!

Montoya Godenzi Daniel Alejandro escala 20

EL AUTOR

Daniel Alejandro Montoya Godenzi

Alejandro, con el grado de magíster en Administración y Dirección de Proyectos, dispone de experiencia en proyectos de entorno tecnológico digital. Forma parte del equipo de Marieú Technology Corporation. En su tiempo libre, le gusta crear nuevos proyectos, leer un libro o ver una serie.

SIGUE LEYENDO

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Logo Julio 2023 fondo transparente texto blanco

Marieú ofrece servicios de creación de páginas web, marketing digital, producción audiovisual y catering, que facilita los negocios en las empresas.

Boletín informativo

Al ingresar acepta nuestros T&C y las Políticas de privacidad.

Marieú Technology Corporation
©Todos los derechos reservados