Editor de email

El editor de email es la funcionalidad de Connectif que permite personalizar de forma responsive 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”. Puedes hacer clic en  Crear nuevo email para generar un nuevo contenido, o hacer clic en Más   y seleccionar Editar para modificar un email existente.

Editor_de_Email_-_1.png

2. Desde el nodo Enviar email de un workflow, haciendo clic en   (Editar configuración de nodo). Puedes hacer clic en Crear nuevo contenido o hacer clic en   Editar para modificar un email existente.

Editor_de_Email_-_2.png

 

Interfaz

El editor de email está compuesto por tres paneles:

1. Previsualización y guardado: para guardar o descartar los cambios realizados. También podrás previsualizar el resultado final del email que será enviado a tus clientes.

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 contraído o expandido haciendo clic en  (Abrir herramientas) o  (Cerrar herramientas).

Editor_de_Email_-_3.png

 

Funcionamiento

El editor de email se basa en el método de diseño ‘drag and drop’ (arrastrar y soltar), por lo que podrás armar tus emails 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”.

Editor_de_Email_-_4.png

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.

Editor_de_Email_-_5.png

  • 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.

Editor_de_Email_-7.png

 

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.

Editor_de_Email_-_7.png

 

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).

Editor_de_Email_-_8.png

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.

    Editor_de_Email_-_10.png

  • "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.
    Editor_de_Email_-_11.png

  • "Social".
    Escoge las redes sociales que desees incluir y modifica la URL del enlace, además de la disposición dentro del bloque.
    Editor_de_Email_-_12.png

  • "Divisor".
    Configura tanto el color como la disposición de la línea vertical para separar contenidos de forma visual.
    Editor_de_Email_-_13.png

  • "Espacio".
    Define la distancia de espacio en blanco que deseas insertar entre dos bloques.
    Editor_de_Email_-_14.png

  • "Contenido dinámico".
    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”.

Editor_de_Email_-_15.png

  • "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.

Editor_de_Email_-_16.png

  • "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.

Editor_de_Email_-_17.png

 

  • "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”.

Editor_de_Email_-_18.png

 

4. 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.
Editor_de_Email_-_19.png

 

5. 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í.

 

6. 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.

Editor_de_Email_-_20.png

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.
Editor_de_Email_-_21.png

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:

 

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 0 de 0