Cómo agregar un formulario de suscripción a Mailrelay usando WordPress

Publicado: 2019-04-16

Si desea atraer nuevos suscriptores para aumentar su lista de correo, debe ofrecer formularios de suscripción en su sitio. Si trabaja con WordPress, puede agregar fácilmente estos formularios a su blog.

¿Por qué? Básicamente porque te permite capturar datos de personas interesadas en los productos o servicios que ofreces para que puedas contactarlos periódicamente.

En este punto, puede estar pensando: estoy interesado, pero ¿qué tendré que hacer para crear un formulario de suscripción en mi sitio de WordPress? No estoy familiarizado con el código HTML y necesito algo simple y fácil.

No se preocupe, en este tutorial; le mostraremos diferentes formas de agregar el código HTML generado por Mailrelay en su sitio web creado con WordPress con y sin complementos.

Interesante, ¿verdad?

Aclaración importante: para este tutorial, asumiremos que ya ha creado un formulario de suscripción en su cuenta y que ya ha copiado el código HTML. Por tanto, nos vamos a centrar en explicar cómo añadir este código en WordPress. Si aún no ha creado el formulario, o no ha copiado el código HTML, le recomendamos que lea esta otra publicación primero y siga los pasos indicados: Formularios de suscripción de Mailrelay V3

  • 1 · Cómo integrar un formulario de suscripción a Mailrelay sin utilizar ningún complemento
  • 2 · Cómo integrar un formulario de suscripción a Mailrelay en WordPress con Elementor (versión gratuita)
  • 3 · Cómo integrar un formulario de suscripción a Mailrelay en WordPress con Bloom
  • 4 · Conclusión
    • 4.1 Publicaciones relacionadas:

Envia hasta 75.000 emails gratis!

· Cómo integrar un formulario de suscripción de Mailrelay sin utilizar ningún complemento

Tenemos que comenzar este tutorial diciendo que no podemos engañarnos a nosotros mismos; la mayoría de nosotros intentará encontrar un complemento para hacer todas las tareas por nosotros en nuestro sitio porque nos hacen la vida mucho más simple.

Sin embargo, es importante tener en cuenta que la instalación de muchos complementos en nuestro sitio puede sobrecargar la página.

Eso, en muchas ocasiones, implica un aumento en el tiempo de carga de las páginas, afectando directamente nuestra estrategia SEO y experiencia de usuario.

Por todo esto, si desea evitar la sobrecarga de su sitio web o simplemente no desea instalar más complementos en su sitio WP, puede integrar el código HTML directamente en su sitio web sin ningún complemento.

¿Cómo?

Siguiendo estos pasos:

Para comenzar, deberá iniciar sesión en su WordPress y hacer clic en " Apariencia" y en "Widget".

En la sección de Widgets, tenemos que encontrar un widget llamado “ HTML personalizado. ”Una vez que lo encontremos, podemos arrastrarlo al área de widgets donde queremos agregar nuestro formulario de suscripción.

Por defecto, WordPress tiene un área de widgets en la barra lateral de la página.

Podemos insertarlo allí o si nuestro tema o plantilla tiene otras áreas de Widgets habilitadas, podemos cambiar el lugar (por ejemplo, en el pie de página).

En este caso, lo vamos a agregar en el área más común de widgets, porque todos los sitios web de WordPress tienen esta opción por defecto; Agreguemos el código HTML en la barra lateral.

Solo tenemos que arrastrar el widget a esta área, agregar un título y pegar el código generado por Mailrelay. Recuerde que ya generó el código HTML antes de comenzar a leer este tutorial.

Después de nombrar el widget (en la sección de título) e insertar el código (en la sección de contenido), tendrá que hacer clic en el botón Guardar.

Más tarde, para comprobar si todo funciona bien, puede acceder a su blog y verá el formulario de suscripción en la barra lateral.

ya tienes incorporado el formulario

* Es importante tener en cuenta que el formulario tendrá los estilos (colores y fuentes) configurados en su plantilla o tema.

En este caso, hemos visto cómo integrar el formulario en la barra lateral. Si tu sitio tiene alguna otra área de widgets habilitada, puedes seguir los mismos pasos que explicamos anteriormente, pero debes arrastrar el widget a esa área.

El resultado será el mismo; la única diferencia es que su formulario de suscripción se mostrará en el área especificada y no en la barra lateral.

Como integrar un formulario de suscripcion de Mailrelay en WordPress con Elementor (version gratuita)

· Cómo integrar un formulario de suscripción de Mailrelay en WordPress con Elementor (versión gratuita)

Cómo integrar un formulario de suscripción de Mailrelay en WordPress con Elementor (versión gratuita)

Elementor es uno de los diseñadores de diseño de WordPress más famosos del momento, de hecho, es uno de los complementos más utilizados para editar formularios de suscripción.

Entre sus principales características podemos encontrar: una versión gratuita con muchas funcionalidades, que permite a cualquier usuario crear secciones atractivas y personalizadas sin tener que invertir dinero.

Elementor es un complemento que actualmente está disponible de forma gratuita con funciones más limitadas y con una versión paga / Premium con algunas opciones adicionales.

Sin embargo, no importa si está utilizando la versión gratuita o de pago, podrá integrar su formulario Mailrelay en la sección y ubicación deseadas. Aprenderá cómo hacerlo en unos pocos pasos:

El primer requisito es tener instalado el complemento Elementor en nuestro sitio. Si aún no lo ha instalado, debe ir a la pestaña de complementos y hacer clic en " agregar nuevo".

plugins y hacer clic en “anadir nuevo”

Busque "Elementor page builder" en el repositorio de WordPress y haga clic en Instalar.

Busca en el repositorio de WordPress “Elementor Page Builder” y haz clic en Instalar.

Una vez instalado, recuerde habilitarlo y estaremos listos para integrar nuestro código.

Para iniciar la integración, debe abrir la página o sección donde desea ingresar su formulario de suscripción. Después de acceder a esta sección, deberá buscar el módulo de código HTML.

tendras que buscar el modulo de codigo HTML.

Una vez ubicado, agregue el módulo en la columna o sección de la página donde desea que se muestre su formulario. Después de arrastrarlo al área en cuestión, tendremos que pegar el código HTML que guardamos anteriormente.

pega el codigo HTML que habiamos guardado con anterioridad.

Una vez ingresado el código HTML, verá cómo estará disponible el formulario en el formulario de suscripción en la sección o columna elegida. Asegúrese de que todo esté correcto y publique los cambios. El resultado será visible en su sitio:

veras como aparece el formulario

Como mencionamos anteriormente, tanto en este caso como en el anterior, es importante tener en cuenta que el formulario tendrá los estilos establecidos en tu plantilla o tema.

Para realizar cambios o modificaciones de estilo, deberá editar el HTML o utilizar complementos específicos que nos permitan personalizar nuestros formularios de suscripción (Bloom, por ejemplo).

Como integrar un formulario de suscripcion de Mailrelay en WordPress con Bloom

· Cómo integrar un formulario de suscripción a Mailrelay en WordPress con Bloom

Bloom es uno de los complementos más completos que podemos encontrar para crear formularios de suscripción. Si ya tienes este plugin instalado en tu WordPress o estás pensando en comprar una licencia, te explicamos cómo puedes integrarlo con tu cuenta de Mailrelay.

Después de acceder al panel de administración, lo primero que debe hacer es hacer clic en los formularios Bloom / Opt-in. En esta pestaña, puede encontrar todos los formularios de suscripción que ya creó. En este caso, vamos a crear un nuevo formulario desde cero para aprender a integrarlo fácilmente con Mailrelay.

Bloom/ optin forms

Para crear un nuevo formulario, simplemente haga clic en el botón azul en la parte superior de la pantalla " nueva suscripción". ”O forma nueva.

El sistema abrirá una lista desplegable donde tendrás que elegir el tipo de formulario que deseas crear. Elijamos la opción "en línea", ya que te permitirá implementarla más adelante en la sección o página que desees.

Escogeremos la opcion “inline”

En la siguiente ventana, deberá comenzar a configurar nuestro nuevo formulario. Lo primero que debes hacer es nombrarlo para poder identificarlo internamente (este nombre solo será visible para ti, no se mostrará a los visitantes).

Después de eso, tendremos que seleccionar un proveedor de correo electrónico. En este caso, como tenemos nuestro código HTML de Mailrelay, podemos ir directamente al final de la lista desplegable y seleccionar la opción “Formulario HTML personalizado” .

Custom HTML form

Inmediatamente después de elegir esta opción, el sistema mostrará un cuadro gris donde podemos insertar el código del fragmento del formulario. En este caso, debe pegar el código HTML generado por Mailrelay y hacer clic en el botón "Siguiente diseño de su suscripción ".

“Next, design your optin”

A continuación, veremos diferentes formas, con diferentes colores y estilos. Debe seleccionar la mejor opción de acuerdo con el diseño de su sitio para que se ajuste al esquema de color de la página. Es importante entender que dado que ya hemos introducido el código, el estilo no será el mismo que el que muestra el complemento, pero el resultado final suele ser bastante bueno.

El siguiente paso será personalizar los campos que queremos usar en el formulario. En "título de suscripción voluntaria", debemos escribir el título que se mostrará de forma destacada en el encabezado del formulario. Si no desea ingresar un título, puede dejar este campo en blanco.

Posteriormente tendremos que completar el texto del formulario. Si estás pensando en explicar por qué tus visitantes deben suscribirse a tu newsletter, o qué estás ofreciendo a tus suscriptores a cambio de la suscripción, este es el campo que debes utilizar para agregar toda esta información.

texto del formulario

Entonces podemos ajustar la imagen. La mayoría de las plantillas estándar de Bloom incluyen una imagen en la parte superior, pero si desea modificarla y / o reemplazarla con su logotipo, por ejemplo, tendrá que hacerlo en esta sección.

Llegamos a la sección de estilos. Si quieres personalizar aún más tu formulario de suscripción, cambiando tipografías, colores, fondos o cualquier otro aspecto estético, este es el lugar. En Opt-in Styling y Form Styling, puede elegir entre muchas opciones y alternativas.

Después de eso, encontraremos algunas opciones más para personalizar el formulario. Podemos agregar texto en el pie de página (ideal para aclaraciones o comentarios rápidos) y el mensaje de confirmación, que es el texto que se mostrará después de que el visitante se suscriba con éxito al boletín.

Después de configurar todos los campos, podemos hacer clic en "Guardar" para guardar nuestro trabajo. Cuando hacemos clic en guardar, el complemento nos sacará de la pantalla y mostrará todos los formularios de suscripción activos.

Bueno, ya hemos creado y configurado nuestro formulario Bloom. El siguiente paso es integrarlo correctamente en nuestro sitio.

Para ello, en los formularios Bloom / opt-in, buscaremos el formulario que acabamos de crear y, a la izquierda, encontraremos este símbolo “[]”.

Bloom/optim forms

Cuando hagamos clic en él, veremos una nueva ventana con el código corto para este formulario. Copie o guarde este código en algún lugar porque necesitará usarlo más tarde.

ventana con el shortcode

Luego de copiar el shortcode, tendremos que agregarlo a nuestro sitio web donde queremos mostrar este formulario. Si tenemos un diseño visual como Elementor o Divi, podemos integrarlo donde queramos con el módulo de código o shortcode.

Si por el contrario ya estamos trabajando con Gutenberg, el nuevo sistema creado por WordPress, podemos integrar nuestro Shortcode utilizando el widget incrustado específicamente para este fin.

Deberíamos, por tanto, abrir la página o sección para editarla. Luego de acceder a él, daremos clic en el botón “+”, y en los widgets, seleccionaremos el bloque “Shortcode”. Después de eso, tenemos que ingresar el código o shortcode que guardamos anteriormente. Aquí solo debes pegar el contenido y guardar los cambios.

Pegaremos el contenido y guardaremos los cambios.

Después de seguir estos pasos, su nuevo formulario estará disponible en su sitio. El proceso es mucho más fácil de lo que pensaba, ¿verdad?

· Conclusión

Como hemos visto a lo largo del artículo, existen muchas opciones para integrar un formulario HTML de Mailrelay utilizando WordPress. En esta publicación, queríamos centrarnos en los métodos que consideramos fáciles para que pierda el miedo a manipular el código.

Como hemos visto, puedes integrar Mailrelay con WordPress sin plugins, a través del apartado de widgets o incluso utilizando Gutenberg, la nueva función que ofrece WordPress.

Sin embargo, si ya tiene editores visuales como Divi, Elementor o cualquier otro complemento opcional, también puede usarlos para agregar su formulario donde lo desee. En el caso de Bloom, la principal ventaja que tenemos es que el plugin nos permite editar fácilmente estilos de formulario, para darles un toque más personal y adaptar el código a la disposición de nuestro sitio.

Sin embargo, si ya está familiarizado con HTML y desea realizar algunos cambios en el código, para agregar estilos o colores, también es posible. Por supuesto, recuerde tener cuidado porque si su formulario de suscripción no funciona correctamente, afectará su estrategia de marketing por correo electrónico.

Y ahora, ¿desea integrar su formulario Mailrelay a su sitio web de WordPress?

Cristina Aguayo