En este artículo te enseñaremos a crear un contenido web de tipo "Floating Bar" y a construir el workflow para mostrarlo a tus contactos.
Una "Floating bar" (barra flotante) es un tipo de contenido web que se mostrará en la parte superior o inferior de tu página, ocupando el ancho completo de la misma. Además, una "Floating Bar" se quedará siempre fija en la misma posición, independientemente de que los usuarios naveguen hacia abajo o hacia arriba en la página.
Puedes encontrar más información sobre este tipo de contenido web aquí.
Imaginemos que queremos mostrar a nuestros contactos este tipo de contenido para intentar que visiten una landing page donde aparecen las mejores ofertas de una campaña que acabamos de lanzar en nuestra página web, por ejemplo, la campaña "Rebajas de verano 2020".
Cómo crear un contenido web de tipo "Floating Bar"
En la barra lateral de Connectif, selecciona "Contenidos" y, a continuación, haz clic en el apartado "Web" para ir a la ventana de creación de contenido web:
Pulsamos "CREAR NUEVO CONTENIDO WEB" y elegimos el tipo "Floating Bar". Podemos cambiar el nombre si lo deseamos, nosotros vamos a poner el nombre "Rebajas de verano 2020":
Nosotros queremos mostrar una "Floating Bar" sencillo, con un texto que llame la atención de nuestros contactos y, si es posible, consiga que hagan clic para que visiten nuestra página de ofertas. Arrastramos un componente de tipo "Texto" a nuestro contenido:
En la pestaña "GENERAL" vamos a cambiar el color de fondo para que resulte más llamativo y también vamos a elegir la posición de nuestro contenido web. En este caso lo vamos situar en la parte inferior de la página, para que no tape el menú superior de nuestra web:
Una vez definido el color de fondo y la posición de la "Floating Bar" vamos a configurar nuestro texto. Hacemos doble click en el componente "Texto" de nuestro contenido y se nos abre el editor. Escribimos el texto que queramos. Nosotros hemos elegido "Rebajas de Verano 2020 - Hasta el 50% de dto- ¡Haz clic para ver nuestras ofertas!". Además, queremos que la gente vaya a la página de ofertas al hacer clic en "¡Haz clic para ver nuestras ofertas!" por lo que seleccionamos ese texto en el editor y le añadimos el enlace:
También vamos a cambiar el color del texto para ponerlo de color blanco:
Además, editamos los márgenes internos del texto para que nuestro contenido web se vea centrado en nuestra página (esta parte puede requerir retoques cuando el contenido esté desplegado en nuestra web):
Este es el resultado final tal como se muestra en previsualizador de Connectif:
Nota: es habitual que un contenido web no se vea exactamente igual en el previsualizador de Connectif que en tu página, ya que tu web tendrá definidos estilos propios que pueden modificar los estilos del contenido web. Por esta razón se recomienda siempre hacer pruebas en entorno real antes de desplegar un contenido para todos tus contactos.
Solo nos falta crear un workflow para configurar cuándo y cómo vamos a mostrar este contenido web a nuestros contactos:
Cómo crear un workflow para mostrar una "Floating Bar" en mi web
En primer lugar tenemos que ir a la sección de workflows:
Una vez estamos en esa sección pulsamos en "CREAR NUEVO WORKFLOW":
y, a continuación, en "Crear workflow en blanco":
Lo primero que debemos hacer es cambiar el nombre de nuestro workflow y añadir una descripción si queremos. Además, podemos añadir etiquetas que nos ayuden a categorizar o clasificar nuestro workflow:
A continuación vamos a editar nuestro nodo "Inicio". En este caso, vamos a configurar el nodo para que se dispara para toda nuestra lista de contactos, existentes y nuevos:
Seguidamente, a continuación del nodo "Inicio", añadimos un nodo de tipo disparador "Al visitar página":
y lo editamos para elegir dónde se mostrará nuestro popup y dónde no. En este caso, queremos mostrarlo en todas las páginas excepto en la landing de rebajas (si el objetivo de nuestro contenido web es llevar a los contactos a esa landing no tiene sentido mostrarlo ahí):
Dejamos la limitación del nodo tal como está por defecto, para que la "Floating Bar" solamente se muestre la primera vez que el contacto visita nuestra web. De esta forma no saturaremos a nuestros contactos con múltiples impactos del mismo contenido (ten en cuenta que las barras flotantes no se pueden cerrar, por lo que pueden molestar a algunos contactos si las mostramos demasiado):
Finalmente, añadimos el nodo de tipo acción "Enviar contenido web":
y lo configuramos, seleccionando nuestra "Floating Bar":
Si pulsamos "SIGUIENTE" podremos elegir cuándo se mostrará el contenido web al contacto que visite nuestra página. Tenemos varias opciones para seleccionar, nosotros vamos a elegir la opción "Tras unos segundos" para que el "Slide In" se muestre a los 5 segundos de que el contacto llegue a nuestra web:
En este ejemplo dejaremos este nodo con la limitación que viene por defecto (el contenido web se muestra una sola vez por contacto):
Aunque podríamos quitarla, ya que el nodo "Al visitar página" también está limitado y solo dejará pasar a los contactos una vez.
Ya lo tenemos todo listo, solo nos falta arrancar el workflow y definir cuándo debe finalizar. Si sabemos cuándo terminarán las rebajas en nuestra tienda podemos añadir esta fecha al workflow para que se finalice automáticamente cuando termine la campaña de rebajas:
Y esto es todo, esperamos que este ejemplo os sirva para empezar a practicar con los nuevos contenidos web de tipo Popup. Seguro que pueden ayudar a mejorar el engagement de los contactos en vuestra web.