Cómo importar una plantilla HTML personalizada
Qué aprenderás
Aprende a importar una plantilla HTML personalizada en Klaviyo.
Solo recomendamos el uso de HTML personalizado a especialistas en marketing con conocimientos técnicos o a cualquiera que tenga acceso a un desarrollador. Aunque nuestro producto sí que es compatible con HTML personalizado, nuestro equipo de asistencia no puede ayudarte a crear tus plantillas personalizadas más allá de ofrecerte la orientación general que se recoge en esta documentación. Para mantener la seguridad de tus datos, el equipo de asistencia de Klaviyo no puede abrir tus archivos HTML.
Importa una plantilla HTML personalizada
Si subes un archivo, debe tener una extensión .html. .csv. Las plantillas de marketing deben incluir un enlace para darse de baja. Usa {% unsubscribe %} para generar un enlace o coloca {% unsubscribe_link %} en el atributo href de tu propio enlace. Más información sobre darse de baja en Klaviyo.
La casilla de no marketing omite la comprobación de darse de baja durante la importación. Selecciónala solo si la plantilla se utilizará para emails activados que no estén relacionados con marketing.
Eliminar etiquetas y variables de plantilla no compatibles
Cuando exportas una plantilla de un diferente ESP, puede contener etiquetas y variables que no son compatibles con Klaviyo. Antes de importar tu archivo HTML, elimina esas etiquetas (y, si hace falta, sustitúyelas por etiquetas de personalización de Klaviyo).
Por ejemplo, consulta el mensaje y el HTML que aparecen a continuación. Este mensaje se exportó desde otro ESP y contiene etiquetas para el año en curso, la dirección de una empresa y más. Estas etiquetas externas no son compatibles con Klaviyo.
Las etiquetas de plantilla de Klaviyo se encuentran entre llaves. Las variables están rodeadas por dos pares de llaves (p. ej., {{ first_name }}) y las etiquetas de plantilla están rodeadas por un par de llaves y símbolos de porcentaje (p. ej., {% unsubscribe %}). Si las etiquetas de plantilla y las variables de tu plantilla se indican con otros caracteres, Klaviyo no las admitirá.
- Ve a Contenido > Plantillas.
- Selecciona la pestaña Email: guardados.
- Haz clic en Crear > Importar plantilla de email.
- Introduce un nombre en Nombre de la plantilla.
- Selecciona Subir archivo HTML y sube tu .html archivo, o selecciona Pegar HTML y pega el código en HTML de la plantilla.
- Si el HTML hace referencia a imágenes locales, sube un archivo .zip que las contenga en Subir archivos adicionales usados en la plantilla. Consulta los requisitos de imagen que figuran a continuación.
- Haz clic en Importar plantilla.
Tras una importación correcta, el cuadro de diálogo se cierra y la plantilla aparece en la pestaña Email: guardado.
No se recomienda exportar una plantilla creada en el editor de arrastrar y soltar de Klaviyo y luego volver a importarla en Klaviyo, ya que puede provocar problemas con la funcionalidad de la plantilla.
Añade imágenes (opcional)
Empaqueta las imágenes locales en un .zip y súbelo en Subir archivos adicionales usados en la plantilla. El nombre de archivo y la ruta de carpeta de cada imagen en el ZIP deben coincidir con su referencia en el HTML. El tamaño de cada imagen no puede ser superior a 10 MB.
Cuando importas la plantilla, Klaviyo carga las imágenes a las que se hace referencia desde el ZIP en su red de distribución de contenido (CDN) y actualiza sus referencias en la plantilla.
Si tus imágenes ya están alojadas online, haz referencia a ellas con las URL completas http:// o https://. No tienes que incluir esas imágenes en el archivo ZIP.
Añadir texto de vista previa oculto a una plantilla HTML personalizada
Si quieres configurar el texto de vista previa para una plantilla HTML personalizada (en lugar de dejar que las bandejas de entrada extraigan el texto de vista previa del contenido del mensaje), añade el bloque de código que se muestra a continuación a la plantilla. Este código debe añadirse inmediatamente después de la etiqueta de apertura <body> de la plantilla. Sustituye Insert preview text here. por el texto de vista previa que quieres que vean los destinatarios.
<div style="display:none; font-size:1px; line-height:1px; max-height:0px; max-width:0px; opacity:0; overflow:hidden;">
Insert preview text here.
</div>Emojis y plantillas personalizadas de HTML
A partir de febrero de 2024, todos los emojis son compatibles con todos los editores de email de Klaviyo (es decir, el editor de arrastrar y soltar, el editor híbrido, el editor de solo texto y el editor de HTML personalizado).