Saltar al contenido principal

Creando un email a través de una plantilla

Una plantilla es un modelo predefinido que especifica el diseño de un mensaje y que se puede adaptar fácilmente para su uso específico según sus necesidades.

Crear su correo electrónico a partir de una plantilla es la opción más sencilla. Le permite partir de una base para la creación de su mensaje, al mismo tiempo que le ofrece una gran flexibilidad de adaptación.

La mayoría de las plantillas están disponibles en el tercer paso de la creación de su correo electrónico, es decir, la definición del mensaje. Para acceder a ellas, seleccione "Crear a partir de una plantilla".

images/download/attachments/624689565/image2020-6-9_18-12-16.png

Se ofrecen diferentes categorías de plantillas.

Plantillas de diseño

Bibliotecas de plantillas

Biblioteca de plantillas personalizadas

Estas son plantillas específicas de su licencia, disponibles en la parte superior de la página de selección de plantillas.

De hecho, Actito le brinda la posibilidad de solicitar plantillas específicas según sus necesidades. Estas pueden, por ejemplo:

  • Adoptar su identidad visual

  • Mostrar imágenes o logotipos predeterminados

  • Agregar bloques específicos según sus necesidades

images/download/attachments/624689565/image2019-3-7_11-21-20.png

Para solicitar la creación de una plantilla personalizada o para obtener más información sobre los procedimientos relacionados, le invitamos a ponerse en contacto con su administrador de cuenta.

Consejo

Esta sección solo se mostrará si hay plantillas personalizadas asociadas a su licencia.

Biblioteca de plantillas de Actito

Actito cuenta con una biblioteca de plantillas que incluye configuraciones adaptadas a las situaciones más comunes, como un boletín informativo, una invitación a un evento o un correo electrónico de bienvenida. Estas están disponibles en la parte inferior de la página de selección.

Estas plantillas solo afectan a la distribución de los bloques y las imágenes, es decir, tú defines el contenido de forma completamente libre. También tienes la posibilidad de modificarlas según tus necesidades.

images/download/attachments/624689565/image2019-11-5_16-43-0.png

Editar una plantilla

Después de seleccionar tu plantilla, ingresarás al editor que te permitirá adaptarla a tus necesidades y completar los diferentes campos de contenido.

images/download/attachments/624689565/image2020-6-9_18-13-28.png

La biblioteca de módulos

En el lado izquierdo de la pantalla, la biblioteca de módulos te muestra una vista previa de los bloques que puedes agregar a tu correo electrónico. Para insertar un módulo, simplemente selecciónalo manteniendo presionado el clic, luego arrástralo y suéltalo en el lugar de tu correo electrónico donde deseas insertarlo.

Existen diferentes tipos de bloques:

  • Encabezados: el bloque "pre-header", que puede contener el pre-header y el enlace de la versión web, y el bloque "header", donde puedes insertar un logotipo y recordar el título del correo electrónico.

  • Imágenes: pueden ser tanto grandes banners que ocupan todo el ancho del correo electrónico como imágenes más pequeñas colocadas al lado o encima de áreas de texto.

  • Títulos: con o sin subtítulo.

  • Áreas de texto: con o sin título, con o sin imagen.

  • Separadores

  • Botones de "llamada a la acción": estos botones se utilizan para insertar enlaces a páginas web.

  • Pie de página: contiene el enlace para darse de baja, un enlace a la información legal...

Puedes pasar el cursor sobre un bloque de la biblioteca en el lado izquierdo con el mouse para obtener una vista previa de su diseño.

Algunos módulos son específicos de plantillas particulares, como bloques de programa, dirección, compartir en redes sociales...

Además de los módulos predeterminados disponibles en las plantillas de la biblioteca Actito, es posible solicitar una adaptación de un bloque existente o incluso la creación de un bloque específico según sus necesidades.

Para solicitar un bloque personalizado o para obtener más información sobre los procedimientos relacionados, le invitamos a ponerse en contacto con su administrador de cuenta.

Editar los módulos

A continuación, tiene la posibilidad de modificar la estructura de los módulos que componen la plantilla, así como llenar su contenido.

Podrá:

  • Escribir su texto

Al redactar su texto, tendrá acceso a un editor de texto enriquecido, donde podrá realizar formatos comunes, como modificar estilos, alineación, tamaño y color del texto, insertar listas y agregar enlaces (como se explica anteriormente).

Este es un editor WYSIWYG, lo que significa que verá directamente los cambios en su texto sin tener que ver las etiquetas de formato.

images/download/attachments/624689565/image2020-6-9_18-7-6.png

Durante la redacción de su texto, tiene la posibilidad de utilizar personalizaciones, es decir, utilizar datos de su tabla de Perfiles u otros datos relacionados, para adaptar el contenido a su contacto. Esto puede ir desde simplemente dirigirse al lector por su nombre hasta personalizaciones mucho más avanzadas.

Para obtener más información al respecto, le invitamos a leer el capítulo "Personalizar un E-mail".

  • Agregar logotipos o imágenes

En cualquier lugar donde aparezca el pequeño icono "Elegir su imagen", tiene la posibilidad de personalizar su mensaje con una imagen de su elección.

images/download/thumbnails/624689565/image2019-3-7_16-9-21.png

Esto se refiere a los banners grandes, las imágenes complementarias, los logotipos, pero también a todas las iconografías específicas de ciertos bloques, como el ícono que representa a los participantes o los íconos de redes sociales. Si no modifica estos íconos, aparecerán tal como están, pero nada le impide reemplazar el botón negro de Facebook por un botón de Facebook con los colores de su empresa.

tip

Gracias al editor de imágenes integrado, podrás modificar fácilmente las imágenes que quieras añadir a tus comunicaciones gracias a una amplia gama de opciones. Para acceder a este editor, haz clic en "Editar imagen".

El tamaño esperado de las imágenes se indica en el fondo gris para cada uno de los banners e imágenes complementarias. Si la imagen que decide agregar no coincide con el tamaño requerido, se redimensionará automáticamente al ancho correcto, manteniendo la proporción en altura. Se evitará cualquier deformación, pero esto puede cambiar el diseño de su correo electrónico.

images/download/attachments/624689565/image2019-3-7_16-1-5.png

Puede seleccionar las imágenes directamente desde sus carpetas, ya sea haciendo clic en el botón "Cargar una imagen" o mediante un "Arrastrar y soltar". También tiene la opción de ingresar la URL de una imagen que ya esté en línea.

Esta pantalla también le permitirá establecer el título de la imagen y un texto alternativo. Este texto alternativo se mostrará en lugar de la imagen si esta está bloqueada o no se puede cargar. Por lo tanto, es importante no descuidarlo.

A saber

El peso máximo de una imagen individual es de 1,5 MB.

  • Agregar Enlaces

Tendrá la posibilidad de agregar un enlace donde quiera que se muestre el ícono "Agregar enlace".
images/download/thumbnails/624689565/image2019-3-7_16-10-5.png

Esto incluye:

  • Las imágenes

  • Las pequeñas iconografías

  • Los botones "llamada a la acción"

  • Directamente en el texto

images/download/attachments/624689565/image2022-8-25_10-15-2.png

La ventana de edición de enlaces le permitirá indicar la dirección URL a la que debe redirigir. También puede insertar una personalización ($ seguido del nombre de la personalización), en caso de que el enlace deba dirigirse a un formulario de Actito o a una página de cancelación de suscripción, por ejemplo.

También tendrá la opción de definir un título y un nombre para este enlace:

  • El título es un concepto HTML (correspondiente a la etiqueta title): aparece cuando se pasa el cursor sobre el enlace.

  • El nombre se mostrará en los informes de la campaña: sirve para facilitar el seguimiento de los clics en sus correos electrónicos.

Editar estilos

Algunas opciones presentadas a continuación, como los estilos de botones, aún no están disponibles de forma predeterminada en todas las plantillas.

Si está interesado en estas características, le invitamos a ponerse en contacto con el soporte.

Editar estilos de un módulo

Para personalizar su correo electrónico, tiene la opción de modificar varios parámetros del módulo, como algunos colores o establecer bordes. Para ello, haga clic en el icono "Editar estilos" que se muestra en la esquina superior derecha de cada módulo individual.

images/download/attachments/624689565/image2020-6-9_16-34-24.png

Este botón abrirá el editor de estilos en el lado izquierdo de la pantalla:

  • Color de fondo

images/download/attachments/624689565/image2022-8-25_11-2-39.png

Podrá editar:

  • El color de la línea: es el color de fondo del correo electrónico, que se muestra a cada lado del cuerpo del correo electrónico. Este botón solo permite cambiar el color de la fracción del fondo directamente adyacente al módulo editado. Para cambiar el color de todo el fondo a la vez, es necesario ir a los estilos globales (ver la sección "Editar estilos globales" a continuación).

  • La couleur del contenido: esto te permite cambiar el color de relleno del bloque en sí.

Por defecto se utilizan los colores iniciales de la plantilla. Estos se configuran en los estilos globales (ver la sección "Editar estilos globales" más adelante). Si personalizas el color de un bloque, la casilla "Utilizar el valor global de la plantilla" se desmarcará automáticamente. Solo tienes que marcarla de nuevo para restablecer el color inicial.

El selector de color te permite seleccionar el color directamente de una paleta o ingresar un código en formato hexadecimal o RGB. Los últimos colores utilizados y los colores de la plantilla se guardan en memoria.

images/download/attachments/624689565/image2020-6-9_16-39-50.png

El espaciado de un bloque te permite ajustar la alineación del contenido de un bloque con respecto al fondo y a otros bloques, es decir, cuánto está centrado el contenido en relación con los bordes del bloque. Esto es especialmente visible en las imágenes, por ejemplo.

El espaciado izquierdo y derecho agregará un margen en los lados, con el "color del contenido". A menudo, preferiremos alinear la imagen en el centro definiendo el mismo espacio en ambos lados, pero se pueden definir de forma independiente.

El espaciado superior e inferior permite agregar un margen del "color del contenido" entre el contenido del módulo y el bloque anterior/siguiente.

images/download/attachments/624689565/image2022-8-25_11-19-48.png

El espaciado máximo es de 200 píxeles.

El editor de estilos del módulo también te permite configurar un borde alrededor del bloque (para enmarcar una imagen o un fragmento de texto, por ejemplo).

Tienes la opción de configurar:

  • El color del borde

  • Su grosor (en píxeles)

  • Su estilo (simple, punteado, doble...)

Para una mayor personalización, puedes activar el botón "Más opciones" para tener la posibilidad de definir un estilo de borde específico para cada lado del bloque.

images/download/attachments/624689565/image2022-8-25_11-24-5.png

Tus modificaciones se guardarán cuando hagas clic en el botón "Guardar" en la parte inferior o cuando hagas clic en el editor.

Las opciones de Espaciado y Borde requieren que el bloque haya sido codificado específicamente. Es posible que no estén disponibles en algunos bloques con diseños más simples o en plantillas personalizadas creadas antes de la implementación de estas características. Por favor, contacta a tu administrador de cuenta si deseas una actualización de tu plantilla personalizada.

Editar estilos de botón

En todos los bloques que contienen botones de tipo "llamada a la acción", también tienes la opción de personalizar su apariencia. Esta opción no está definida en los estilos del módulo, sino directamente en cada botón del bloque.

Haz clic en el ícono de la derecha para acceder a ello.

images/download/attachments/624689565/image2022-8-25_15-19-48.png

Esto te permite modificar el color de fondo principal del botón, utilizando el selector de color idéntico al utilizado en la gestión de estilos del módulo.

images/download/attachments/624689565/image2022-8-25_15-25-59.png

Esto te permite modificar el estilo del texto del botón, es decir, su fuente, color y tamaño de texto, así como diferentes efectos de estilo, como poner el texto en negrita o cursiva.

images/download/attachments/624689565/image2022-8-25_15-25-19.png

En este cuadro se definen dos parámetros importantes:

  • El radio de borde permite definir el redondeo de las esquinas del botón. Si se establece en 0 píxeles, el botón tendrá esquinas rectas. Al aumentar este radio, se redondearán las esquinas del botón, obteniendo un botón más o menos ovalado según el valor elegido.

  • El estilo de borde permite definir el contorno del botón, lo cual incluye el color del contorno, su grosor y el estilo de línea. Esto le permite mostrar botones con un contorno diferente al fondo del botón. Si desea un botón uniforme, mantenga el color del contorno igual al del fondo, o seleccione el estilo "Sin borde".

images/download/attachments/624689565/image2022-8-25_15-37-52.png

Ejemplo de botón redondeado con borde:

images/download/thumbnails/624689565/image2022-8-25_15-39-5.png

Por defecto, todos los botones toman el valor definido en los estilos globales del correo electrónico.

Si modifica un parámetro, la casilla "Utilizar el valor global de la plantilla" se desmarcará automáticamente. Solo tiene que marcarla de nuevo para restablecer el valor inicial.

Para modificar los estilos globales y, por lo tanto, definir el estilo de todos sus botones de una vez, consulte la siguiente sección.

Editar los estilos globales

Haga clic en "Estilos Globales" junto a la biblioteca de módulos para aplicar parámetros de estilo a todo el correo electrónico.

Los estilos de cada módulo/botón se pueden modificar individualmente, pero por defecto tomarán el valor definido en los estilos globales.

images/download/attachments/624689565/image2022-8-25_15-45-41.png

  • Colores de la plantilla

Esto le permite guardar colores para usar en el correo electrónico. Es muy útil si su organización utiliza ciertos tonos de color específicos en su identidad visual: no es necesario recordar de memoria el código RGB de un tono de azul, al definirlo una vez en los colores de la plantilla, estará disponible en cada selector de color del correo electrónico.

images/download/attachments/624689565/image2022-8-25_15-50-3.png

  • Estilos del módulo

Esto permite definir los colores (fondo global y contenido de bloque) y los espacios de manera uniforme (ver "Editar estilos de un módulo" arriba para más detalles).

La diferencia aquí es que estos colores se aplican a todo el correo electrónico, por lo que el color de fondo corresponde al "color de línea" para todos los módulos.

  • Estilos de texto

Esto también permite definir estilos de texto aplicables a todo su plantilla. Por defecto, hay 3 estilos de título, 1 estilo para párrafos, 1 estilo "en línea" (que permite cambiar el estilo de un fragmento de texto en particular sin cambiar todo el estilo del párrafo), 1 estilo para enlaces y 1 estilo para botones. Si está utilizando una plantilla de diseño personalizada, puede haber otros estilos disponibles.

Para cada estilo, tiene la opción de configurar:

  • el color del texto

  • su tamaño en píxeles

  • la fuente del texto, de una lista amplia de fuentes preseleccionadas compatibles con diferentes motores de correo electrónico. Si está utilizando una plantilla personalizada, puede haber otras fuentes disponibles.

images/download/attachments/624689565/image2022-8-25_16-2-36.png

Los nombres de los estilos son una sugerencia sobre su uso, pero si necesita 2 fuentes diferentes para el cuerpo de su texto, no hay nada que le impida usar el estilo 'Heading 3' para esto, por ejemplo.

De hecho, puede cambiar directamente el estilo de un fragmento de texto en el cuerpo de la plantilla, o aplicar uno si no tiene un estilo predeterminado.

images/download/attachments/624689565/image2020-6-9_17-17-51.png

  • Estilos de botón

Esto le permite modificar los estilos de todos los botones "call to action" de su correo electrónico a la vez (ver "Editar los estilos de botón" arriba para más detalles).

images/download/attachments/624689565/image2022-8-25_16-4-55.png

Cuando personaliza el estilo de un módulo o un botón individual, siempre tiene la opción de volver a los estilos globales de la plantilla con un solo clic marcando la casilla "Utilizar el valor global de la plantilla".

Limitaciones Outlook

Outlook es el cliente de correo empresarial por excelencia. Si bien es menos común en un contexto B2C, la compatibilidad con Outlook sigue siendo un aspecto importante en el diseño de sus correos electrónicos.

Un aspecto importante, pero también un desafío, ya que de todos los clientes de correo, Outlook es el que ofrece menos compatibilidad con las funcionalidades modernas del mundo del correo electrónico. De hecho, el motor de este cliente de correo se basa en otro software bien conocido de Microsoft, es decir... Word, el procesador de texto.

Esto implica restricciones y limitaciones en lo que es posible en las diferentes modificaciones de estilo (no relacionadas con el editor Actito, sino con las funcionalidades compatibles con Outlook).

  • Fuentes

    Todas las fuentes disponibles, incluida la extensión de la lista en verano de 2022, son fuentes "web safe", lo que significa que están preinstaladas en todos los sistemas operativos. Las fuentes "google fonts" ofrecen más posibilidades pero también una compatibilidad mucho menor, por lo que siempre requieren una fuente de reemplazo. No están disponibles de forma predeterminada en el editor, sino solo a pedido en las plantillas personalizadas.

  • Botones
    • Si un botón se deja sin enlace, Outlook romperá la visualización como si el texto estuviera pegado a los bordes.

    • Los radios de borde (esquinas redondeadas) no son compatibles.

  • Bordures/Espacement

La visualización de los bordes inferiores y los bordes derechos puede causar problemas de visualización: no se muestra nada para un borde de 1 píxel, se muestra la mitad (1 píxel) para un borde de 2 píxeles, etc.

Lo mismo ocurre con los bordes de los botones.

Historial de sesión

A veces puedes sentir la necesidad de retroceder y deshacer los últimos cambios que has aplicado a tu correo electrónico. Aquí es donde entra en juego el historial de sesión.

Puedes acceder al historial de sesión en la esquina superior derecha del editor, junto a los botones "Guardar" y "Salir del editor".

images/download/attachments/624689565/image2022-4-15_11-47-34.png

El historial de sesión conservará hasta los últimos 10 cambios que hayas realizado en el contenido de tu correo electrónico.

images/download/attachments/624689565/image2022-4-15_11-50-3.png

Cambios históricos

Las siguientes acciones se registran en el historial de sesión:

  • Modificación de texto

  • Modificación de una imagen

  • Cambio de color de un botón

  • Eliminación de una condición de visualización

  • Agregado de una condición de visualización

  • Modificación de un bucle de personalización

  • Eliminación de un bucle de personalización

  • Eliminación del enlace de una imagen

  • Importación de contenido de otro idioma

  • Importación de contenido de otra versión

  • Importación de contenido desde un archivo Zip

  • Importación de un producto del catálogo

  • Importación de un artículo RSS

  • Importación de todos los artículos RSS

  • Cambio de estilos globales

  • Movimiento de un módulo

  • Agregado de un módulo

  • Eliminación de un módulo

  • Cambio de estilos de un módulo

  • Eliminación de todos los módulos

Restaurar una versión anterior

Haz clic en cualquier versión guardada para previsualizarla.

El título del objeto del historial es la acción que ha resultado en la versión guardada. Esto significa que si quieres previsualizar el contenido tal como estaba antes de esta acción específica, debes seleccionar la versión anterior.

Si quieres volver a una versión anterior de tu contenido, selecciona su previsualización y luego haz clic en "Restaurar" encima del panel lateral.

¡Salir del historial de sesión te llevará de vuelta al editor... tal como estaba antes!

Restaurar una versión anterior es un cambio guardado. Esto significa que también puedes deshacerlo.

images/download/attachments/624689565/image2022-4-15_12-1-0.png

Como su nombre sugiere, el historial de sesión guarda la sesión de trabajo de un usuario. No se guarda al final de la sesión. Esto significa que cerrar la sesión de Actito o salir del editor reiniciará el historial de sesión.

Solo se puede guardar una sesión a la vez: cambiar de idioma o de versión (para las pruebas A/B) reiniciará el historial de sesión.

Las opciones

En la parte superior de la página, la barra de tareas te da acceso a varias opciones adicionales.

images/download/attachments/624689565/image2019-3-8_9-38-18.png

Ver la vista previa en un smartphone

En cualquier momento, tienes la opción de ver una vista previa de cómo se vería tu mensaje en un smartphone haciendo clic en el ícono de "smartphone" en la parte superior de la página, en el centro.

Luego puedes volver a la vista en el ordenador haciendo clic en el ícono de "pantalla de ordenador".

images/download/thumbnails/624689565/image2019-3-8_9-44-38.png

Importar contenido

Este botón te permite importar contenido HTML. El archivo debe estar comprimido previamente.

Puedes elegir si importar los estilos o no.

images/download/attachments/624689565/image2019-3-8_10-6-23.png

Consejo

Para una campaña multilingüe, el archivo zip debe contener un archivo HTML para cada idioma. El nombre de este archivo debe terminar con un guión bajo seguido del código de dos letras del idioma.

Por ejemplo: DocTemplate_FR.html

Importar contenido de otro idioma

Si tu campaña es multilingüe, tienes la opción de importar el contenido de otro idioma de la campaña.

Esto te permitirá, por ejemplo, no tener que cargar las imágenes dos veces si deben permanecer iguales, o volver a definir los estilos. De esta manera, podrás concentrarte exclusivamente en la edición del texto y en la definición de los posibles enlaces.

images/download/attachments/624689565/image2019-3-8_10-12-45.png

Esta acción reemplazará el contenido actual por el de la lengua elegida, sin posibilidad de retroceder.

Eliminar todos los módulos

Este botón te permite eliminar todo el contenido para comenzar desde un lienzo vacío.

Esta operación es irreversible.

images/download/attachments/624689565/image2019-3-8_10-17-55.png

Cambiar el idioma de edición

Si tu campaña es multilingüe, el idioma de edición actual se muestra a la derecha de los botones "Opciones" y "Personalizaciones".

Puedes cambiar directamente de idioma a través del menú desplegable. El cambio solo es posible cuando el correo electrónico está en estado "Guardado" (y no "En proceso de guardado" después de una modificación).

images/download/attachments/624689565/image2020-6-9_17-59-29.png

También puedes seleccionar el idioma a la derecha de la pantalla cuando estés fuera del editor, o volver al modo de edición en cualquier momento al hacer clic en Editor, a la izquierda.

images/download/attachments/624689565/image2020-6-9_18-3-16.png

Crear un nuevo mensaje

Desde la pantalla de definición, tienes la opción de eliminar todo el contenido de tu correo electrónico para crear uno nuevo desde cero.

Para hacer esto, selecciona el botón "Más" y luego "Eliminar el mensaje existente".

Este botón te permitirá volver a la página de selección de la plantilla para basarte en una plantilla completamente diferente.

images/download/attachments/624689565/image2019-3-8_10-32-26.png

Esta acción eliminará todo tu progreso en cuanto al contenido de tu correo electrónico. Es irreversible.

Plantillas de campañas

Las plantillas de campañas te proporcionan un modelo de configuración de envío. A diferencia de los otros dos tipos de plantillas, no se pueden seleccionar en el tercer paso de la creación de tu correo electrónico, sino al principio, justo después de hacer clic en "Crear una campaña". Esta es la pantalla que te invita a seleccionar el tipo de correo electrónico que deseas enviar.

images/download/attachments/624689565/image2019-9-9_16-53-16.png

De hecho, este tipo de plantilla no solo se refiere al contenido del correo electrónico en sí, sino que también te da la posibilidad de guardar los datos generales, la segmentación y todos los demás parámetros.

Te permite guardar la definición de una campaña y reutilizarla cada vez que necesites enviar una campaña similar.

Para descubrir cómo guardar estas configuraciones, te invitamos a leer la página "Guardar una plantilla de campaña".