El editor de email permite diseñar, de forma responsive y muy visual, el contenido de los correos electrónicos que serán enviados a tus clientes desde tu cuenta, a través de workflows creados para dicho fin.
¿Cómo acceder?
Puedes acceder al editor de email a través de dos rutas:
1. Desde “Contenido > Emails”. Haz clic en Crear nuevo email para generar un nuevo contenido, o en Más y selecciona Editar para modificar un email existente.
2. Desde el nodo "Enviar email" de un workflow, haciendo clic en (Editar configuración de nodo). Haz clic en Crear nuevo contenido o en Editar para modificar un email existente.
Interfaz
El editor de email está compuesto por tres paneles:
1. Previsualización y guardado: para guardar o descartar los cambios realizados y previsualizar el resultado final del email que será enviado.
2. Diseño: para construir visualmente el email haciendo uso de las estructuras y componentes del panel 3 (herramientas).
3. Herramientas: para configurar todas las propiedades del email, acceder a plantillas y añadir variables. Este panel puede ser expandido o contraído haciendo clic en (Abrir herramientas) o (Cerrar herramientas).
Funcionamiento
El editor de email se basa en el método de diseño ‘drag and drop’ (arrastrar y soltar), por lo que permite armar los correos electrónicos de forma rápida, sencilla y muy visual.
1. Clasificar el email
En el panel de diseño (2), cataloga tu email y localízalo de forma rápida haciendo clic en Introduce etiquetas y añadiendo palabras clave que te ayuden a identificarlo.
Las etiquetas son muy útiles tanto para encontrar tus workflows más rápido como para extraer informes a través de Data Explorer. Te recomendamos añadir etiquetas con:
— Nombre de la campaña.
— Fecha en que será lanzada.
— Público objetivo.
— Objetivo de la campaña (venta, fidelización, captación…).
Por ejemplo, utilizando las etiquetas “Navidad 2022”, “Clientes B2B” y “Captación”.
2. Editar estilo general
En el panel de Herramientas (3), haz clic en la pestaña General para editar los parámetros del aspecto general. También puedes acceder haciendo clic en Propiedades generales del panel de diseño (2).
Los parámetros a definir son:
-
Nombre del contenido: nombre que quieres dar al contenido para identificarlo en tu cuenta de Connectif.
El nombre del contenido no es el asunto del email. Para configurar el asunto, revisa el artículo Campaña de email masiva.
-
Colores: color de fondo del contenido y color de fondo general.
-
Disposición: anchura que tendrá el contenido en píxeles y umbral responsive (hasta qué anchura de pantalla se entenderá que es un dispositivo móvil).
-
Texto: fuente o tipografía de los textos del email por defecto.
Puedes añadir nuevas tipografías para personalizar al máximo tus emails. Para ello, te recomendamos solicitar la ayuda de un experto en maquetación y diseño CSS y HTML.
-
Resumen: texto que aparecerá al cliente en la previsualización del email, tras el asunto del mismo.
-
Header: título que adoptará la pestaña del navegador del contacto cuando haga clic en “ver en el navegador”.
-
Opciones HTML: configuración general de estilo basado en estilos CSS y HTML.
Recomendamos no editar esta sección a menos que cuentes con la ayuda de un experto en maquetación y diseño CSS y HTML.
3. Construir el email por bloques
En el panel de Herramientas (3), haz clic en la pestaña Componentes para elaborar tu composición arrastrando y soltando estructuras o elementos en el panel de diseño (2).
Estructura
Distribución que adoptará un bloque de contenido dentro del email. Puede presentarse en una o varias columnas, con proporciones idénticas o dispares.
La estructura se ha de insertar en primer lugar. En caso de no incluirla, por defecto se utilizará la estructura de una columna.
Una vez creada una estructura, posiciona el ratón encima de la misma y haz clic en (Editar bloque) para modificarlo, (Duplicar bloque) para crear otro idéntico o (Borrar bloque) para eliminarlo.
Elementos
Contenidos multimedia que puedes añadir a tu email, arrastrándolos al panel de diseño (2). Al igual que con la estructura, puedes editarlos posicionando el ratón encima de dicho elemento y haciendo clic en el botón (Editar elemento) o sobre el contenido en sí. También puedes duplicarlos haciendo clic en (Duplicar elemento), o eliminarlo haciendo clic en (Borrar elemento).
Los elementos de los que dispones son:
-
"Texto".
Redacta tu escrito aplicándole formato enriquecido (negrita, cursiva, enlaces…), insertando variables dinámicas o modificando su disposición en el bloque insertado.
Las variables dinámicas permiten personalizar el texto en base a los datos recopilados en el perfil de cada contacto. Para saber más sobre variables y mejorar los resultados de tu email, te recomendamos revisar el artículo Variables predefinidas para personalizar emails y contenidos.
El botón (Convertir a HTML) de este y futuros elementos, convierte el elemento de texto a formato HTML de forma irreversible. Para hacer uso de esta función, necesitarás conocimientos básicos de HTML & CSS. En caso de no contar con un experto en la materia, te recomendamos no convertirlo.
-
"Imagen".
Si tu imagen ya está publicada en Internet, pega la URL de la imagen para incluirla en el contenido web. Si prefieres subirla desde tu dispositivo, haz clic en Subir imagen o en la figura de las montañas, y selecciona el archivo en la ventana del explorador que aparecerá de forma emergente. Al cargarse, se completará la URL de la imagen de forma automática.
Como configuraciones extra, puedes redactar el texto alternativo (que aparecerá en caso de no cargar la imagen), el texto del ‘title’ (también conocido como atributo alt, se muestra al posicionar el ratón sobre la imagen) y la disposición dentro del bloque. -
"Botón".
Define el texto que aparecerá en tu botón, el atributo ‘title’ y el enlace (podrá ser uno específico o predefinido para ejecutar una acción concreta). Para configurar su aspecto visual, selecciona los colores de texto y fondo y ajusta la disposición dentro del bloque. -
"Social".
Escoge las redes sociales que desees incluir y modifica la URL del enlace, además de la disposición dentro del bloque. -
"Divisor".
Configura tanto el color como la disposición de la línea horizontal para separar contenidos de forma visual. -
"Espacio".
Define la distancia de espacio en blanco que deseas insertar entre dos bloques. -
"Productos".
Inserta un carrusel de productos que será completado con los artículos de interés para el contacto. Puedes seleccionar una de las tres plantillas por defecto (Producto básico, Producto con marca o Producto con precio) o personalizar en el editor de texto su aspecto final. También puedes definir su estructura de filas y columnas en desktop y mobile.
Para que el carrusel de productos sea completado con los artículos en los que el contacto muestra interés, es imprescindible el uso de un nodo “Obtener productos” antes del nodo “Enviar Email”. Puedes aprender más en los artículos Mostrar productos personalizados en el email de carrito abandonado y Nodo “Obtener productos”.
-
"HTML".
Incrusta un código HTML personalizado y ajusta su disposición.
Para insertar este elemento, necesitarás de un experto en maquetación y diseño CSS y HTML para asegurar la correcta visualización del contenido.
-
"Ver en el navegador."
Texto predefinido para insertar un enlace que permite ver el contenido del email en una ventana del navegador. Al editar el enlace, podrás modificar el texto para mostrar, el título y si deseas que se abra en una nueva ventana.
El enlace siempre es “#__cn_view_in_browser” y viene configurado por defecto. Puedes acceder a él a través de la opción Insertar/Editar enlace del editor.
-
"Pie de página".
Texto predefinido para insertar un pie de página a tu email, en el que puedes especificar los datos de tu empresa y proporcionar al cliente la opción de cancelar su suscripción o reenviar un email.
El RGPD obliga a ofrecer a los clientes la opción de cancelar su suscripción de forma visible, por lo que el enlace de “Cancelar suscripción” deberá estar siempre presente en emails de tipo newsletter. El enlace a la cancelación siempre deberá ser “#__cn_unsubscribe”.
4. Aplicar una condición a un bloque
Aplica una condición a los bloques que desees, para mostrarlos u ocultarlos a los Contactos en base a si cumplen las condiciones indicadas o no.
Para ello, pasa el cursor sobre el bloque que quieras mostrar u ocultar dependiendo de las condiciones y haz clic en el botón Añadir condición.
Haz clic en Añadir Condición y, en el desplegable, escoge el valor por el que quieres filtrar la condición, de entre los disponibles de Perfil de contacto, Campos personalizados, Compras o Indicadores de Valor.
En el segundo desplegable, escoge un Operador y, por último, en la tercera fila, añade el valor que deseas que compruebe Connectif para mostrar o no el bloque.
Haz clic en Aplicar y, de este modo, Connectif solo mostrará este bloque a los contactos que cumplan dicha condición. En este ejemplo, solo se mostraría la imagen a aquellos que hayan hecho más de 3 compras.
5. Utilizar plantilla existente o guardar una nueva
Crea rápidamente tus emails haciendo uso de plantillas predefinidas por Connectif o creadas por ti desde el panel de Herramientas (3), en la pestaña Plantillas, haciendo clic en Usar plantilla. También podrás guardar el diseño que hayas elaborado como plantilla haciendo clic en Crear plantilla desde este contenido.
6. Añadir enlaces predefinidos a un botón
Además de los elementos predefinidos explicados en el punto 3, (Ver en el Navegador y Darse de Baja), Connectif ofrece varios enlaces predefinidos que se pueden añadir a los botones de los emails y ofrecen ciertas funcionalidades sin necesidad de generarlas a mano.
Para añadir uno de estos enlaces añade un botón a tu plantilla de email, añade un componente Botón a tu email y edita su configuración.
En el apartado Botón del enlace, haz clic en el botón Añadir enlace predefinido.
Haz clic en el desplegable y selecciona el enlace predefinido que quieras que incluya tu botón. Están disponibles:
- Confirmar suscripción a la newsletter: si un contacto hace clic en este enlace, Connectif cambiará su "Estado de suscripción a la newsletter" a "Suscrito". Además, se notificará la suscripción automáticamente al backoffice de tu web.
- Darse de baja de la newsletter: si un contacto hace clic en este enlace, Connectif cambiará su "Estado de suscripción a newsletter" a "Dado de baja" y notificará este cambio al backoffice de tu web.
- Ver en el navegador: si un contacto hace clic verá el email en una pestaña de su navegador. Esta página se genera automáticamente por Connectif.
- Reenviar email: si un contacto hace clic en este enlace podrá reenviar el email a través de su cliente de correo por defecto.
Una vez seleccionado, haz clic en Aceptar y el enlace predefinido se añadirá a tu botón.
7. Revisar las variables
Examina las variables creadas y cuántas veces se repiten en los elementos de texto desde el panel de Herramientas (3), en la pestaña Variables. Para editar su formato, haz clic en .
Si has añadido una nueva variable de forma reciente y no aparece, haz clic en para refrescar.
Aprende más sobre formato de las variables haciendo clic aquí.
8. Previsualizar resultado final y guardar
En el panel de previsualización y guardado (1) podrás ver el resultado final de tu email. Todos los contenidos creados son responsive, por lo que puedes hacer clic en Previsualizar para desplegar un nuevo panel y revisar el resultado final. Haz clic en (Vista en escritorio) para ver el resultado en desktop, o haz clic en (Vista en móvil) para ver el resultado en móvil.
También podrás enviarte un email de previsualización haciendo clic en (Enviar email de previsualización) para recibir un email de prueba al correo que selecciones y revisar cómo lo recibirá el cliente.
Una vez satisfecho con el resultado, haz clic en Guardar.
Connectif está preparado para recuperar contenido que haya sido cerrado de forma accidental. No obstante, para evitar pérdidas de información debidas al dispositivo desde el que se está editando y a la red del mismo, te recomendamos guardar tu email cada pocos minutos.
¡Enhorabuena!
Has llegado al final de la lección.
¿Te han quedado dudas sin resolver?
Recuerda que tienes a tu disposición a nuestros especialistas en Connectif. Para contactar con ellos, tan solo tendrás que abrir ticket a Soporte haciendo clic en el botón azul de “Ayuda” de tu dashboard.
¡Sigue aprendiendo!
Para aprovechar todo el potencial de tu cuenta en Connectif, te recomendamos continuar con los siguientes artículos:
-
Crear bloque de productos personalizados en un email, para enviar a tus clientes productos de su interés.
- Enlaces en emails: ver en el navegador, darse de baja y botones, para configurar enlaces predefinidos.
- Campaña semanal de productos recomendados, para programar envíos automáticos a los clientes con artículos recomendados.
-
Cupón masivo por email, para mandar un descuento exclusivo a tus clientes.