Los bloques de productos dinámicos sirven para mostrar recomendaciones personalizadas de productos a tus contactos. Esto permite que los contenidos de tus emails se adapten al comportamiento y al ciclo de vida de cada usuario, manteniéndose actualizados y relevantes, lo que mejora las conversiones.
En este artículo, aprenderás cómo crear un bloque de productos personalizados en un email.
Tiempo de implementación: 15 minutos.
Dificultad: Baja
¿Cuándo utilizarlo?: Cuando necesites mostrar productos personalizados en tus emails.
Antes de leer este artículo, te recomendamos echar un vistazo al Editor de email.
PASO 1. Crea un diseño de email con un bloque de productos dinámico
1. Accede a "Contenidos > Emails" y haz clic en Crear nuevo email.
2. Añade un componente de tipo "Productos", arrastrando el bloque desde la pestaña Componentes al editor.
PASO 2. Personaliza tu bloque de productos
Puedes previsualizar cualquier cambio en el proceso de creación y personalización de un bloque de productos. Siempre que consideres necesario, sigue las instrucciones del PASO 3 para validar tus cambios, antes de continuar con el siguiente punto.
2.1. Configuración básica
(En este apartado se van a indicar los datos identificativos y estilo general del bloque de productos).
3. Haz clic en (Editar elemento) en el menú contextual que aparece al pasar el ratón sobre el bloque insertado.
4. (Opcional) En Nombre del bloque de productos, establece un título para identificar el bloque.
Si usas más de un bloque de Productos, te recomendamos establecer un nombre a cada uno de ellos. Esto te facilitará la asignación de variables en el workflow en el que se haga uso del contenido web.
2.2. Configuración de la plantilla
(En este apartado se va a definir el contenido del bloque de productos).
5. En Plantillas, escoge entre las tres opciones por defecto.
Las plantillas incluyen espacios designados para mostrar la información esencial de un producto: su nombre, imagen o un botón para ir a su ficha en el eCommerce, entre otros datos del producto.
Las características principales que las distinguen son:
— Producto básico (tipo 1): incluye un espacio reservado para la descripción del producto.
— Producto con marca (tipo 2): incluye un espacio reservado para mostrar la marca del producto y otro para su precio.
— Producto con precio (tipo 3): incluye un espacio reservado para mostrar la descripción del producto y otro para su precio.
6. Usa el editor para personalizar los estilos de la plantilla seleccionada.
El editor de la plantilla permite tanto dar estilo como añadir elementos al componente. Podrás modificar, por ejemplo, la tipografía, tamaño o colores de los textos o añadir imágenes.
7. (Opcional) Haz clic en HTML para personalizar por medio de código tu componente, si fuera necesario para tu diseño.
2.3. (Opcional) Creación de nuevas variables dinámicas
(En este apartado se van a definir nuevas variables a utilizar en el bloque de productos, en caso de que desees añadir datos adicionales).
Cuando el diseño del email se incluya en un workflow, se establecerá la vinculación entre los datos del flujo y las variables del email por medio de un nodo "Enviar email". Si quieres saber más sobre este tipo de nodos, haz clic aquí.
8. En el editor, haz clic en el lugar del contenido donde quieres añadir la variable.
9. Haz clic en el botón Variables.
10. En Identificador de variable, escribe un nombre para tu variable.
El identificador de variable no puede incluir espacios y solo puede contener letras, números y los símbolos de guion ( - ) y barra baja ( _ ). Tampoco puede contener tildes, al ser caracteres no permitidos.
En nuestro ejemplo, se ha llamado a la variable "description".
11. Haz clic en Aceptar.
Al crear la variable, el editor le añade las llaves dobles que la distinguen.
12. Repite los pasos 8 a 11 por cada variable que quieras añadir.
Para eliminar una variable, selecciónala en el editor, incluyendo las llaves que la rodean, y pulsa la tecla suprimir de tu teclado.
2.4. Configuración de la estructura
(En este apartado se van a definir la cantidad de productos a mostrar).
13. En Estructura, define la cantidad de productos que deseas que se muestren en el contenido.
La cantidad de productos visibles dependerá de las filas y columnas que establezcas, y puede ser distinta si el contacto hace la visita desde un ordenador ("Filas en escritorio" y "Columnas en escritorio") o desde un dispositivo móvil ("Filas en móvil" y "Columnas en móvil").
En nuestro ejemplo, se han seleccionado 1 fila y 3 columnas en escritorio, por lo que mostraran 3 productos cuando el contacto visualice el email desde un ordenador.
Si el usuario lee el correo desde móvil, el bloque también mostrará 3 artículos pero cada uno en una fila distinta.
14. (Opcional) Desmarca la casilla "Mostrar filas incompletas" para que los productos se visualicen sólo cuando hay suficientes para mostrar en todas las columnas de una fila.
En nuestro ejemplo, si desmarcamos la casilla "Mostrar filas incompletas", el contenido solo se mostraría si se reciben los datos de al menos 3 productos.
PASO 3. Previsualiza el diseño de tu bloque de productos personalizado
Ten en cuenta que tanto las nuevas variables que hayas creado como las incluidas en la plantilla no están aún vinculadas a ningún dato de los productos, por lo que se previsualizarán como texto (placeholder).
La asignación de datos a las variables, que permite que el contacto visualice el contenido, se realiza desde un workflow.
15. Haz clic en (Previsualizar).
16. Haz clic en (Vista en escritorio) y revisa que el diseño en ordenador sea el adecuado para tu estrategia.
La vista por defecto del previsualizador corresponde a la de ordenador.
17. Haz clic en Vista en móvil y revisa que el diseño en dispositivos móviles es el adecuado para tu estrategia.
18. (Opcional) Haz clic en (Enviar email de previsualización) para evaluar la maquetación en tu gestor de correo. Para ello, rellena los parámetros de envío y haz clic en el botón Enviar test.
19. (Opcional) En tu gestor de correo, comprueba el email de visualización que has enviado.
El email de previsualización tiene como objetivo verificar la maquetación. Al no ser enviado desde un workflow, este correo carece del contexto del contacto y la navegación, por lo que las variables del bloque de contenidos no estarán vinculadas a productos y los enlaces especiales no funcionaran.
20. Haz clic en Cancelar, en caso de que no hayas mandado un email de previsualización.
21. (Opcional) Haz las modificaciones necesarias, repitiendo los pasos y puntos anteriores que correspondan, para que el diseño sea el adecuado a tu estrategia.
22. En el editor, haz clic en Guardar.
¡Éxito!
Tu bloque de productos personalizado en un email ya está listo.
¡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 contenido web, para crear y personalizar un bloque de contenido dinámico en un contenido web.
- Mostrar productos personalizados en un contenido, para vincular los datos recogidos en un workflow con las variables de un contenido web.
- Mostrar porcentaje de rebaja solo cuando exista descuento en un email, para personalizar el comportamiento del contenido dinámico en función de si el producto tiene descuento.
- Carrito abandonado + recomendaciones, para enviar un email a los contactos con los productos de su carrito abandonado y productos relacionados.