Mejorando las suscripciones al blog

Progreso de Lección:

This content is locked

Login To Unlock The Content!

Información Adicional

En este video utilizamos el plugin Bloom creador por Elegant Themes. Este plugin es parte de nuestros planes de hosting y puedes obtenerlo gratis con nuestros planes de hosting para WordPress Premium o Business.

Transcripción

En este video del curso aprenderemos como utilizar Bloom, crearemos 3 diferentes tipos de formularios con este plugin.

Crearemos un formulario inline, que se mostrará al final de los artículos, un slide in que aparecerá cuándo los visitantes bajen en nuestro sitio web y un popup que aparecerá cuando el plugin detecte que el visitante ha dejado un comentario en un artículo.

Así que lo primero que debemos hacer es ingresar en Bloom, para eso, damos clic en esta nueva opción dentro de nuestro menú principal que dice Bloom.

Desde esta ventana tenemos todas las opciones de Bloom incluyendo el sistema de estadísticas.

Para crear un nuevo formulario damos clic en new optin.

Lo primero que debemos definir, es que tipo de formulario o optin deseamos crear, como puedes ver tenemos estas 6 opciones.

Los popups posiblemente ya sabes a que se refiere, los fly in son pequeñas cajas que aparecen en una de las esquinas de la página, below post coloca el formulario al final de los artículos, inline colocará el formulario en medio del contenido del artículo.

Locked content nos permite bloquear alguna parte de nuestro contenido y mostrarlo únicamente a las personas que se suscriben a nuestra lista de correos.

Y widget nos permite añadir el formulario en cualquier zona de widget disponible en nuestra plantilla.

Para este primer formulario vamos a utilizar la opción de below post.

Muy bien, ahora podemos comenzar a crear nuestro nuevo formulario, le vamos a dar un nombre.

Y luego seleccionamos la empresa de email marketing con la que estamos trabajando.

Como puedes ver, Bloom se integra con muchísimas empresas de email marketing, y dentro de estas se incluye Mailchimp, que es con la que estamos trabajando.

Así que la seleccionamos y ahora damos clic aquí para vincular nuestra cuenta de Mailchimp.

Debemos darle un nombre a esta cuenta, así que le colocamos lievanosantuto.

Y ahora necesitamos añadir nuestro api key.

Para eso debemos entrar en nuestra cuenta de Mandrill.

Desde aquí vamos hacia profile y luego a extras y damos clic en api key.

Como puedes ver tenemos la opción para generar nuestra primera api key, así que damos clic en este botón para generarla.

Y listo, ya tendríamos nuestra primera api key generada, lo único que debemos hacer ahora es copiarla, regresar a Bloom y pegarla en esta zona.

Ahora damos clic aquí para autorizar el uso de esta api key.

Muy bien, como puedes ver nuestra cuenta de Mailchimp se ha integrado con Bloom, desde el selector de las listas podremos ver todas las listas que tenemos creadas en nuestra cuenta de Mailchimp y seleccionar la que deseamos utilizar.

En este caso únicamente hemos creado esta lista, así que la seleccionamos.

El doublé optin quiere decir que se le enviara un correo de confirmación a todos los usuarios cuando se suscriben a nuestra lista, te recomiendo mucho dejar esta casilla marcada, ya que de esa forma te aseguras de que la gente se encuentre utilizando su correo real y que no son bots.

Ahora podemos ir al siguiente paso dando clic en este botón.

Muy bien, en este paso vamos a empezar con la modificación del diseño para este formulario.

En primer lugar debemos añadir un título y un pequeño texto que anime a que nuestros visitantes se suscriban.

En la parte de arriba tenemos este botón con el que podemos previsualizar como está quedando nuestro formulario.

Y si bajamos en las opciones de diseño podremos ver la opción de previsualizar el formulario con este ícono.

En este caso, le vamos a colocar una imagen al lado izquierdo.

Yo ya tengo una imagen creada así que damos clic aquí para subirla, y utilizamos el administrador de medios de WordPress para subir y seleccionar estas imágenes.

Con la siguiente opción le podemos colocar una animación a esta imagen, en mi caso le colcaré slide up, puedes ir jugando con estas diferentes opciones.

Y gracias al previsualizar podrás encontrar la animación que más te guste.

En el siguiente conjunto de opciones podemos modificar el diseño de nuestro formulario.

Para este formulario cambiaremos el color del fondo.

También podríamos modificar la fuente de nuestros textos, el color e incluso podríamos añadir un borde a la parte superior del formulario.

Pero en este caso dejaremos estos valores como se encuentran.

En los siguientes dos conjuntos de opciones podemos modificar la zona del formulario en el que se encuentra el botón y el campo para añadir el correo.

Podemos colocar el formulario en la parte de abajo, a la derecha o al lado izquierdo.

Después podemos indicar si deseamos mostrar el campo de nombre, pero en este caso no tenemos ese campo en nuestro formulario así que podemos prescindir de él.

Luego podemos modificar lo que nuestro formulario dice, en email lo dejare como se encuentra, pero al botón lo modificaremos y le colocaremos únete a nosotros.

Si ahora pre visualizamos el formulario de contacto, podremos ver que nuestro botón se ha modificado.

Luego podemos modificar algunos aspectos de diseño dentro del formulario, en este caso modificaremos el color del fondo, y también modificaremos el color del botón.

Y en esta última zona es posible modificar el estilo que tiene la división entre nuestro texto y la zona en la que se encuentra el formulario, vamos a seleccionar este diseño.

Muy bien demos en el previsualizador, como puedes ver ya hemos terminado de diseñar nuestro formulario.

Diseñar los formularios a nuestro gusto es muy fácil con Bloom.

Bien, cerremos el previsualizador.

En este campos de texto podemos añadir un pequeño texto al final del formulario si lo necesitamos.

Este otro campo nos permite añadir un mensaje en el que le indicamos al visitante que se ha registrado correctamente.

Y al final puedes añadir tus propias reglas CSS si lo necesitas.

Ahora demos clic en este botón para modificar las reglas de visualización y terminar este formulario.

Las opciones que tenemos aquí dependen del tipo de formulario que estamos utilizando.

En este caso estamos viendo las opciones para los formularios del tipo below post.

En primer lugar debemos indicar en que tipo de contenido deseamos mostrar este formulario, podemos mostrarlo en los artículos y en las páginas.

Pero en este caso únicamente lo deseo mostrar en las páginas, así que lo dejamos como se encuentra en este momento.

También podríamos indicar desde aquí si deseamos que se muestre en los artículos de ciertas categorías y en otras no.

Y desde estas últimas opciones podemos definir si deseamos mostrar este formulario en ciertas páginas o si deseamos excluir a ciertos artículos de este formulario.

Muy bien, una vez tenemos todo configurado, damos clic en guardar y salir.

Y de esta forma hemos terminado nuestro primer formulario.

Ahora únicamente debemos dar clic en este botón para activar nuestro nuevo formulario y que comience a mostrarlo en nuestros artículos.

Así que ahora vamos a nuestro sitio web.

Y vamos a ingresar en uno de nuestros artículos, si bajamos hasta el final del artículo podremos ver en esta zona el nuevo optin que hemos creado con Bloom.

En mi experiencia, este es el segundo tipo de formulario que más suscritores trae a tu lista de correos.

Muy bien, ahora vamos a crear dos formularios más, esta vez iremos más rápido, ya que esta vez ya sabemos cómo funciona Bloom.

Así que regresemos a nuestra área de administración.

Con el mismo botón iniciaremos un nuevo optin.

Esta vez crearemos un fly in.

Al igual que en el primer formulario, colocamos un nombre.

Después seleccionamos la empresa de email marketing con la que estamos trabajando, que es Mailchimp en nuestro caso.

Seleccionamos la cuenta que hemos configurado en el anterior formulario y ahora seleccionamos la lista.

Es recomendable utilizar el optin así que lo marcamos y luego damos clic en el botón de siguiente.

Ahora podemos ver las opciones de diseño para los flyin, como puedes ver, las opciones de diseño pueden ser un poco diferentes dependiendo del tipo de optin que te encuentras creando.

Como puedes ver tenemos una gran cantidad de plantillas ya creadas, de modo que es muy fácil para nosotros crear los formularios con Bloom.

En mi caso voy a seleccionar este estilo.

Y damos clic en el botón de siguiente.

Al igual que en el formulario anterior, podemos colocar un título y una descripción a nuestro formulario.

En este formulario ya contamos con una imagen y la verdad me parece una muy buena ilustración así que vamos a dejarlo.

Si damos clic en el botón para previsualizar el formulario, puedes ver que esta muy bien diseñado, la plantilla es elegante y llama mucho la atención.

La verdad no hay casi nada que quiera modificar en el diseño de este formulario.

Pero vamos a modificar el texto del botón.

Le colocaremos Únete a nosotros.

Creo que también vamos a modificar el color del botón. Y tambien modificaremos el color del texto del botón, tenemos ahorita el color en dark que sería negro, así que lo cambiamos para que se haga blanco.

De hecho en este tipo de formulario también podemos modificar el borde, vamos a modificarlo y seleccionaremos esta última opción.

Y también modificaremos la forma en la que se ve la división entre la descripción y el formulario.

Ahora demos clic aquí para ver que tal esta ha quedado nuestro formulario.

El formulario me parece muy bueno, así que vamos a regresar y damos clic en el botón para ir a las siguientes opciones.

Desde este conjunto de opciones podemos definir el donde a quien y cuando del formulario.

Iniciamos con el donde, desde esta primera opción debes indicar en que zona deseas mostrar el formulario.

Puedes dejarlo a la derecha, a la izquierda o al centro.

En mi caso creo que lo dejare al lado derecho.

Muy bien, en este siguiente grupo de opciones debemos indicar a quien se le será mostrado este formulario, podemos aquí definir el comportamiento del usuario que lanzará este formulario.

Primero podemos seleccionar una animación, en este caso seleccionare esta animación.

Podemos hacer que este formulario salga cuando el usuario haga o no haga varias acciones, por ejemplo podríamos indicar que salga después de una cantidad de tiempo en la página, si el usuario no esta activo.

Si el usuario llega al final del articulo, podemos mostrarlo después que el usuario deja un comentario, después de que el usuario baja cierta cantidad de pixeles en la página, después de comprar algo en nuestra web.

Luego de hacer clic en un link específico, y todas estas opciones nos permiten definir exactamente quien vera este formulario.

En mi caso quiero mostrar el formulario si el usuario baja para ver más contenido en la página, y únicamente cuando haga eso, así que voy a eliminar la selección en las opciones que se encuentra activas.

Y activaremos la que indica after scrolling.

Muy bien, desde aquí podemos indicar cuanto debe bajar el usuario para poder ver el formulario, la medición que hace Bloom es en porcentajes, así que le dieremos que nos muestre el formulario después que el usuario baje un 25% o mas en la pagina.

Ahora, en este tipo de formulario hay una opción muy importante, que es la mostrar una vez por sesión.

De esta forma, podemos mostrar el formulario a nuestros visitantes solo una vez, y evitamos molestarlos.

Al dar clic aquí cada usuario solo podrá ver este formulario una vez por cada sesión y aquí definimos cuanto dura cada sesión, en este caso le colocare 30 días.

De esa forma no molestamos a nuestros usuarios, ya que sería demasido molesto estar visitando muy seguido tu web y que cada vez que llegue me pidas suscribirme, es mejor entonces no molestar a nuestros usuarios.

Especialmente con este tipo de formularios que son disruptivos.

Muy bien, ahora vamos al siguiente grupo de opciones.

Desde aquí indicaremos en que paginas se mostrara el formulario.

En este caso voy a mostrar este formulario en todos lados.

Así que seleccionamos esta opción.

Aun así podemos definir aquí algunas paginas o artículos que podemos excluir.

Y finalmente damos clic aquí para terminar y guardar el formulario.

Como puedes ahora, tenemos aquí nuestro nuevo formulario.

Antes de ir a nuestro sitio web para ver nuestro nuevo formulario, vamos a crear el último.

Así que damos clic aquí para iniciar.

Esta vez utilizaremos un pop up.

Muy bien, le colocamos un nombre.

Y luego seleccionamos Mailchimp en este caso, y nuestra lista.

Ahora vamos a las opciones de diseño.

En este caso también tenemos muchas plantillas entre las que podemos seleccionar.

Para este nuevo formulario voy a utilizar este diseño.

Y damos clic en el botón para seguir.

Vamos a colocar un título y también una descripción.

Para este formulario tenemos una imagen que he creado previamente, así que la vamos a subir y la añadimos en nuestro formulario.

Muy bien, ahora modificare el color del borde.

También modificaremos el color de fondo para el formulario. Y finalmente el color de fondo para el botón.

Una vez que tenemos el diseño de nuestro formulario listo vamos al último conjunto de opciones.

Desde aquí primero seleccionaremos el tipo de animación.

Ahora eliminaremos la selección en estas opciones.

Y seleccionaremos esta opción.

Muy bien, esto hace que este popup se muestre únicamente cuando los visitantes añaden un comentario en nuestros artículos.

En las siguientes opciones dejaremos el popup activo únicamente en los artículos y guardamos este nuevo formulario.

Hemos terminado nuestros tres formularios, ahora vamos a probarlos, así que entramos en nuestro sitio web.

Si comenzamos a bajar podremos ver el slide in cuando superemos el 25% de la página.

Como puedes ver tenemos aquí nuestro slide in.

Nuestros visitantes pueden suscribirse muy fácilmente utilizando este formulario y llama mucho más la atención que el formulario que Mailchimpo nos da.

Ahora ingresemos en cualquiera de estos artículos.

En la parte inferior tenemos el formulario below post.

Para nuestro último formulario vamos a dejar un comentario en este artículo.

Y al enviar el comentario podremos ver nuestro último formulario.

Deja un comentario

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

¿Quieres aprender a crear sitios web?

Regístrate gratis como estudiante y aprende a crear sitios web sorprendentes. Gana certificados y medallas al completar los cursos gratuitos.
¡REGÍSTRATE GRATIS!
close-link
Crea tu sitio web con diseño profesional en menos de 15 minutos
Ver Tutorial
close-image