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
- Dark mode email design best practices
Learn about dark mode, a device setting some users turn on to darken their displays. This setting impacts how emails are displayed. Dark mode is an end user setting that is selected at the device level, and Klaviyo does not have direct control over how dark mode is implemented on each device.
- How to update your brand styles in Klaviyo
Learn what to update in Klaviyo when rebranding or refreshing your brand’s design.