Cómo crear una plantilla base
Aprende a crear una plantilla base de correo electrónico en Klaviyo. Una vez que crees una plantilla base, puedes usarla en todas tus campañas y flujos para acelerar el proceso de creación y asegurar que la imagen de marca sea coherente en todos los mensajes.
Antes de empezar
Una plantilla base incluye secciones clave como un encabezado, contenido del cuerpo y un pie de página. Ve a Contenido > Plantillas y haz clic en Crear para comenzar. Luego, sigue los pasos a continuación para agregar contenido reutilizable a la plantilla.
1. Configura los estilos base
Antes de aplicar estilo a bloques individuales, establece los estilos base. Estos estilos, como fuente, colores, relleno y más, se aplican a todos los bloques de la plantilla.
Añadir estilos base facilita aplicar tu marca y también reduce el peso del código, lo que facilita evitar el recorte en Gmail.
Para agregar estilos base:
- Haz clic en Estilos (junto a Contenido).
Si ves Opciones de visualización junto a la pestaña Estilos en lugar de Contenido, haz clic en Listo para salir de la configuración de estilos del bloque o la sección, que solo se aplica a ese bloque o sección.
- Establece un color de fondo para la plantilla y el contenido, junto con el margen y el relleno. Recomendamos dejar la configuración de ancho en 600px para una compatibilidad óptima con los proveedores de bandeja de entrada.
- Agrega estilos de texto, incluidas fuentes, tamaños de fuente, colores y espaciado. Asegúrate de configurar estilos para el texto Normal, así como para H1, H2, H3 y H4. Puedes usar estos estilos de encabezado para texto destacado en todo tu correo electrónico. Aprende a usar una fuente personalizada en tus correos electrónicos.
- Agrega un color y un estilo de enlace.
- Selecciona la moneda de la tienda en el menú Moneda. El símbolo de la moneda seleccionada se usa dondequiera que la etiqueta {% currency_format ... %} esté presente en una plantilla.
- Si Optimización para móviles está activada, agrega la configuración para móviles. Estos aparecerán cuando alguien abra tu correo electrónico en un dispositivo móvil. Obtén más información sobre la optimización para móviles.
2. Crea una sección de encabezado
Después de configurar los estilos de correo electrónico, agrega la sección de encabezado. Por lo general, las secciones de encabezado incluyen un logotipo, enlaces clave y, a veces, un banner con funciones como información sobre la venta más reciente o el estado de VIP del destinatario.
- Si la plantilla ya tiene una barra de encabezado, actualízala con tu propio logotipo. Como alternativa, arrastra un bloque Header y agrega el logotipo. Conoce las prácticas recomendadas para el tamaño y la calidad de las imágenes.
- Selecciona un diseño en los menús Diseño de escritorio y Diseño móvil (por ejemplo, Logotipo en línea para escritorio y Apilar todo para móvil). Recuerda que los dispositivos móviles usan pantallas mucho más pequeñas que las computadoras de escritorio, así que apilar el contenido puede facilitar la lectura y la navegación.
- En la sección Contenido, añade enlaces clave de navegación del sitio. Haz clic en el icono de la papelera para quitar enlaces o en Añadir enlaces para agregarlos. Los enlaces comunes que puedes incluir en el encabezado son: comprar ahora, novedades, acerca de, ofertas, preguntas frecuentes o una selección de categorías de productos.
- Ajusta los estilos del bloque en las secciones debajo del contenido del enlace. Recuerda que, si quieres aplicar una configuración de estilo a todo el email, usa la pestaña principal Estilos, como se describe en la sección anterior.
- Haz clic en Listo para volver a las opciones principales de edición de la plantilla.
Agrega un banner opcional de funciones
Puedes añadir un banner de funciones arriba o abajo de la barra de encabezado.
- Arrastra un bloque de texto a la misma sección que la barra de enlaces.
- Configura el fondo con un color de acento y añade un mensaje destacado, como “Usa el código WELCOME para obtener 15 % de descuento en tu primer pedido”.
- Verifica que el banner de funciones y la barra de enlaces estén en la misma sección al pasar el cursor sobre el espacio a la izquierda o a la derecha de los bloques. Un borde gris de Sección debe rodear ambos bloques al pasar el cursor, y se vuelve azul cuando se hace clic en la sección.
- Opcional: Haz clic en el ícono de estrella para guardar la sección como contenido universal. Los bloques y las secciones universales se pueden usar en varias plantillas, y puedes editar todas las instancias del bloque/sección al mismo tiempo. Más información sobre contenido universal.
3. Añadir contenido del cuerpo
- Arrastra un bloque de Sección desde la sección Diseño de la barra lateral de Contenido y colócalo debajo del encabezado.
- Agrega bloques de marcador de posición para el contenido del cuerpo del correo electrónico. Esto puede incluir bloques de texto con descripciones de la marca o mensajes promocionales, diseños comunes que piensas usar, imágenes de producto de marcador de posición y más. Aprende a colocar contenido uno al lado del otro usando columnas, bloques de división y tablas.
Aprende a añadir una imagen de fondo a una sección y superponer botones, texto y otros elementos encima.
4. Crea una sección de pie de página
Klaviyo requiere que incluyas un enlace de cancelación de suscripción en los correos electrónicos, y lo más común es colocarlo en el pie de página. Además, se recomiendan estos elementos de pie de página:
- Dirección de la empresa
- Un enlace a la política de privacidad
- Enlaces a tus perfiles sociales (p. ej., Facebook, Instagram, Twitter, Tiktok)
- Un enlace a tu sitio web
- Un enlace de preferencias de correo electrónico
Para añadir un pie de página a la plantilla base:
- Arrastra una nueva sección debajo de la sección del cuerpo o edita el pie de página predeterminado.
- Añadir un bloque de texto.
- Haz clic en Personalización.
- En el campo Personalización de búsqueda, busca "cancelar la suscripción".
- Selecciona cancelar la suscripción para añadir una etiqueta de enlace de cancelación de suscripción a tu bloque de texto.
- Usa este mismo menú para agregar una dirección de la organización, administrar el enlace de preferencias, el enlace de vista web y más.
- Cuando envíes el correo electrónico, estas etiquetas se reemplazarán con el texto o los enlaces adecuados.
- A continuación, arrastra un bloque de Enlaces a redes sociales a la plantilla, justo encima del bloque de texto de los pasos anteriores.
- Selecciona tus canales sociales en el menú desplegable para agregarlos al bloque.
- En el campo Dirección del enlace de cada canal social, agrega un enlace a tu perfil.
- Elige un estilo de ícono.
- Haz clic en Listo para volver a las opciones principales de edición de la plantilla.
- De manera opcional, guarda toda la sección del pie de página como contenido universal.
5. Vista previa
Una vez que hayas agregado un encabezado, el contenido del cuerpo y una sección de pie de página, previsualiza el correo electrónico.
- Haz clic en Vista previa y prueba en la esquina superior derecha del editor de correo electrónico.
- Alterna entre computadora y móvil para asegurarte de que la plantilla se vea como se desea en ambos formatos.
- Haz clic en Enviar prueba para enviar un correo electrónico de prueba a tu propia bandeja de entrada.
- Haz clic en Listo para cerrar el modal de vista previa.
- Haz clic en Guardar para guardar la plantilla.
Una vez que hayas guardado la plantilla base, puedes usarla como base para todos los futuros correos electrónicos de campaña y flujo.