Cómo mostrar productos verticalmente en correos electrónicos
Objetivos del artículo
Descubre cómo mostrar productos en tus flujos de carrito abandonado y confirmación de pedido de forma vertical (es decir, con una imagen arriba de la información del producto, en lugar de al lado).
Crea un bloque vertical de producto
Las instrucciones a continuación te ayudarán a convertir un bloque de productos horizontal existente en un bloque de productos vertical. Si todavía no tienes un correo electrónico de flujo que contenga un bloque de contenido dinámico, encuentra uno en la biblioteca de flujos.
- Selecciona Flujos en la barra lateral de Klaviyo.
- Ve al flujo de carrito abandonado o de confirmación de pedido.
- Haz clic en Actualizar estado de las acciones en la parte superior derecha para configurar el flujo como manual mientras editas.
- Abre un correo electrónico en el flujo que contiene el bloque de contenido dinámico (es decir, el bloque de tabla que muestra los productos del carrito de alguien).
- Agrega una nueva sección inmediatamente debajo del bloque de tabla dinámica.
- Agrega un bloque de imagen y un bloque de tabla a la nueva sección.
- Copia los valores de Configuración de la tabla > Colección de filas y Configuración de la tabla > Alias de fila.
- Ve a Opciones de visualización y haz clic en Crear reglas de repetición.
- Pega los valores del bloque de tabla en los campos Repeat For y Item alias, respectivamente.
- En el bloque de tabla, haz clic en Reemplazar debajo de Imagen dinámica.
- En el modal que aparece, copia todo lo que está en el campo Variable dinámica o URL dinámica.
- Haz clic en el bloque de imagen en la nueva sección.
- Haz clic en Explorar la biblioteca de imágenes.
- Selecciona Imagen dinámica y pega la URL dinámica.
- Haz clic en Guardar.
- Copia la etiqueta que aparece en el campo Dirección del enlace de tu bloque de tabla.
- Pega esta etiqueta en el campo Dirección del enlace de tu nuevo bloque de imagen.
- Copia el contenido de texto del bloque de tabla original.
- Pega el texto en el nuevo bloque de texto.
- Previsualiza el correo electrónico para asegurarte de que toda la información del producto aparezca en la nueva sección. Si algo parece incorrecto, revisa que todos los elementos (es decir, la colección de filas, el alias de fila, la URL de imagen dinámica y el contenido de texto) se transfirieron correctamente.
- Cuando estés satisfecho con la nueva sección, elimina el bloque de tabla original.
- Opcionalmente, guarda la nueva sección como contenido universal para usarla en otros mensajes dentro del flujo.
Resultado
Después de seguir estos pasos, tu correo electrónico incluirá un bloque de productos vertical (con imágenes encima de la información del producto), en lugar de imágenes e información del producto mostradas horizontalmente.
Recursos adicionales
- Mejores prácticas de diseño de correos electrónicos en modo oscuro
Conoce el modo oscuro, un ajuste del dispositivo que algunos usuarios activan para oscurecer sus pantallas. Esta configuración afecta cómo se muestran los correos electrónicos. El modo oscuro es un ajuste para usuarios finales que se selecciona a nivel de dispositivo, y Klaviyo no tiene control directo sobre cómo se implementa el modo oscuro en cada dispositivo.
- Cómo actualizar los estilos de tu marca en Klaviyo
Conoce qué actualizar en Klaviyo al cambiar la marca o renovar el diseño de tu marca.