Desde que Elementor apareció en nuestras vidas, una de las cosas que hemos simplificado bastante es la gestión de los formularios. Ya no hace falta tirar de plugins adicionales como Contact Form para formularios básicos.

Elementor, además, lleva integrada la manera de conectar los formularios con distintos sistemas de envío de mailing como Drip, ActiveCampaign, GetResponse o Mailchimp, que es el que más utilizamos en Ensalza.

mailchimp elementor jpg

#1. Requisitos para conectar Mailchimp y Elementor

Para seguir los pasos del tutorial necesitamos:

  1. Un WordPress con Elementor configurado y funcionando
  2. Acceso a una cuenta de Mailchimp
  3. Una lista de contactos ya creada y configurada (con sus campos y sus cosas) dentro de Mailchimp

Como no quiero alargar el artículo, nos vamos a centrar en conectar Mailchimp con Elementor. Te dejo enlazados los puntos 2 y 3 a un tutorial aparte por si no tuvieras estos pasos avanzados aún.

 

#2. Generar la API en Mailchimp

Una vez logueados en Mailchimp, hacemos clic en la flechita con nuestro nombre que sale en la esquina superior derecha y después en Profile. En la página del perfil, que es donde podemos editar toda la info de la cuenta, nos vamos a la pestaña Extras y después a API keys. Algo así:

acceso api keys 1024x548 jpg

Si bajamos un poquito en esta pantalla, nos encontraremos el listado de APIS bajo el título “Your API keys” o, si es una cuenta nueva, un huevito y un mensaje de que no hay ninguna API. En cualquiera de los dos casos, simplemente pulsamos el botón de Create a Key y nos generará una nueva.

guardar api 1024x288 jpg

Consejo: podemos cambiar el Label que por defecto se pone a none set y poner algo descriptivo tipo “formularios web” o similar.

Nos tenemos que dejar a mano ese código que aparece en la columna API Key, porque es el que usaremos en el siguiente paso.

 

#3. Conectar la API con Elementor

Una vez tenemos nuestra API Key, accedemos al panel de WorPress y entramos en Elementor > Ajustes > Integraciones.

Desde aquí, bajamos hasta encontrar el apartado de Mailchimp. ¿No lo encuentras? Sube un poco, que te lo has pasado.

conectar api elementor 1024x294 jpg

Aquí el proceso es fácil: pegamos el código generado en Mailchimp en el paso anterior, pulsamos el botón e Validate API Key (aparecerá un tick verde) y MUY IMPORTANTE: pulsamos en el botón de guardar cambios al final de la página (a mi siempre se me olvida este paso y me toca hacerlo dos veces).

 

#4. Configurar los formularios de Elementor

Ahora que ya está todo OK, simplemente tenemos que configurar nuestro formulario en Elementor, que supongo que ya teníamos creado de antes.

El primer paso es ir a la pestaña Actions After Submit y elegir Mailchimp de entre las opciones disponibles. Esto generará un nuevo desplegable un poco más abajo con el título de Mailchimp.

activar mailchimp formulario jpg

El siguiente paso es irnos a la pestaña Mailchimp que acaba de aparecer y configurar los valores:

  • API Key: lo normal es dejarlo en Default, que es la que habremos configurado en el paso anterior.
  • List: aquí tendremos un desplegable con todas las listas que tenemos creadas en Mailchimp
  • Groups: podemos conectar este formulario a un grupo concreto de Mailchimp
  • Double Opt-In: para activar la validación doble (te llega un mail para confirmar la suscripción) o dejarla desactivada. Lo ideal sería activarla, pero sabemos que eso supone que bajen los leads…
  • Field Mappng: el punto chulo, el mapeo de campos.
    • A la izquierda, tendremos todos los campos que hemos creado en el formulario (te recomiendo poner Label a los campos si no quieres volverte loc@).
    • A la derecha, asociado a cada campo, tendremos un desplegable con los campos disponibles en la lista de Mailchimp que hemos creado.

configurar formulario elementor mailchimp jpg

¡Facilísimo! Simplemente elige el mapeo de campos, clic en Actualizar y ya tenemos nuestro formulario de Elementor conectado con Mailchimp.

 

#5. Otras cosas a tener en cuenta

3 puntos también interesantes con los formularios de Elementor, aunque no tengan que ver con Mailchimp:

  • Si también queremos que el formulario se envíe por e-mail, tenemos que marcar la opción Email en el desplegable de Actions After Submit y dejar las direcciones configuradas.
  • Es recomendable que se almacenen los formularios en la web. Revisa si está activado el plugin Elementor Contact Form DB.
  • ¡Recuerda la adaptación del formulario a la RGPD! Aquí no me meto, que ya lo contó Santiago en su momento.

Y hablando de Santiago, aunque ya no trabaje en Ensalza y se esté dedicando enteramente a la fotografía en MrKii… Tengo que reconocer que gran parte de las dudas que tenía sobre el tema me las resolvió él. ¡Gracias compi! 

Si tenéis cualquier duda sobre el tutorial podéis dejar un comentario debajo y os respondemos lo antes posible. 

¡Abrazos!

Responsable de redes sociales, redacción y contenidos en marketing.

Me encanta leer y viajar. Muy curiosa, amante de la (buena) música, de Madrid y del aperitivo a mediodía.

¿Qué te ha parecido el artículo?
[Total:1    Promedio:5/5]
Share This