Introducción al lenguaje de plantilla de email de Mailchimp

Al crear plantillas de correo electrónico personalizadas con el lenguaje de plantillas de correo electrónico de Mailchimp, hay algunas pautas básicas que debes seguir. Estas pautas tienen por objeto servir de base para las mejores prácticas al utilizar el lenguaje de plantillas de Mailchimp.

En este artículo aprenderás los conceptos básicos del lenguaje de las plantillas de Mailchimp.

Cosas que debes saber

• Dependiendo de tu plan, es posible que no tengas acceso a las plantillas de código personalizado. Para averiguar qué funciones incluye cada plan, consulta nuestra página de precios. Para cambiar el tipo de plan, visita la página de planes de tu cuenta.
• Esta es una tarea avanzada que se recomienda solo a los usuarios que estén familiarizados con la codificación personalizada. Contacta con tu desarrollador o contrata a un experto de Mailchimp si necesitas ayuda.

Aplicación de estilos CSS

Recomendamos que el diseño de tus emails sea 600 pixeles o 640 pixeles de ancho para que se muestre correctamente en varios clientes de email. La página de Email Client CSS Support (Soporte CSS en Aplicaciones de Correo Electrónico) en nuestra Email Template Reference (Referencia de Plantilla) proporciona una lista exhaustiva de los estilos CSS compatibles para diferentes tipos de clientes de correo electrónico.

Como regla general, evita el uso de la siguiente CSS en tus plantillas:

• Flotantes
• Posicionamiento
• Imágenes de fondo (no funcionan en Microsoft Outlook o en Gmail)

Recuerda configurar la declaración de @theme en tu CSS para el fondo de página, encabezado, pie de página, y espacio de contenido para que las plantillas se pueden personalizar rápidamente con los temas de color de Mailchimp. Consulta el artículo Estilos de Plantilla para conocer la sintaxis correcta de los nombres que se pueden utilizar.

Secciones editables

Para simplificar las cosas, limita el número de espacios editables en la plantilla y sigue unos criterios uniformes a la hora de ponerles nombre. El nombre asignado mediante mc:edit=" somename" se utiliza para crear un campo en la base de datos donde almacenar contenido único. Si cambias de plantilla después de redactar el contenido, podrías perder el texto si los nombres de espacios editables no coinciden. Utiliza las siguientes convenciones para las áreas de contenido más habituales. Ver más ejemplos.

• mc:edit="header" se utiliza para denominar el encabezado de un correo electrónico.
• mc:edit="header_image" se utiliza para denominar una imagen de encabezado editable.
• mc:edit="sidecolumn" se utiliza para denominar una columna izquierda o derecha editable.
• mc:edit="body" se utiliza para denominar el espacio del contenido principal de un correo electrónico.
• mc:edit="footer" se utiliza para denominar el pie de página de un correo electrónico.

No debes colocar imágenes editables en un lugar de contenido editable. 

Ten en cuenta que si en el creador de campañas editas una sección que se puede ocultar con el botón Remove (Eliminar) de la plantilla, la sección no desaparecerá de la pantalla del editor, sino que aparecerá difuminada como marcador de posición en caso de que decidas utilizar el espacio. Esa sección no aparecerá en la campaña que has enviado. Para previsualizar la campaña, haz clic en el menú desplegable Preview (Vista previa) y selecciona Enter preview mode (Entrar en modo de vista previa).

Los botones remove (eliminar) y hide this section (ocultar esta sección) no ofrecen la misma funcionalidad en el editor de plantillas. De hecho, no es posible eliminar nada mientras se trabaja en el editor de plantillas. Si necesitas hacer cambios así, te sugerimos que trabajes en el creador de campañas.

Etiquetas Merge

Debes utilizar la creatividad mediante las etiquetas Merge.

• Utiliza etiquetas Merge para redes sociales para ofrecer a tus contactos nuevas formas de conectar contigo a través de Facebook y X (anteriormente Twitter) y compartir fácilmente tu contenido.
• Utiliza la etiqueta Merge de tabla de contenido ( *|MC:TOC|*) para crear una lista automática de enlaces a los <h1> and <h2> encabezados en un correo electrónico.
• Puedes consultar Personalizar tu contenido de pie de página para obtener una descripción general rápida de las etiquetas Merge que puedes incluir.

Siempre incluye la información CAN-SPAM requerida en el pie de página. De lo contrario, tu campaña de correo electrónico podría ser rechazada. Estas etiquetas obligatorias también se recogen enPersonalizar tu contenido de pie de página.

• *|UNSUB|*
• *|LIST:DESCRIPTION|*
• *|LIST:ADDRESS|*

Enlaces Externos

Al utilizar enlaces dentro de tu correo electrónico, incluye el atributo target="_ blank" en tus elementos de anclaje para garantizar que abran una nueva pestaña o ventana del navegador cuando los correos electrónicos los ven lo clientes de correo electrónico basados en un navegador. Haz un esfuerzo por incluir estos enlaces útiles en tu correo electrónico:

• Un enlace para que los usuarios actualicen sus preferencias de suscripción:
  <a href="*|UPDATE_PROFILE|*" shape="rect" target="_blank">cambiar las preferencias de suscripción</a>
• Un enlace para permitir a los usuarios que vean el correo electrónico en un navegador:
  <a href="*|ARCHIVE|*" shape="rect" target="_blank">ver este correo electrónico en un navegador. </a>
• Un enlace para tu sitio web:
  <a href="*|LIST:URL|*" shape="rect" target="_blank">visita nuestro sitio web </a>
• Un enlace para permitir a los usuarios reenviar el correo electrónico a un amigo, por lo general algún lugar prominente:
  <a href="*|FORWARD|*" shape="rect" target="_blank">Reenviar a un amigo </a>

(¡Es una buena idea hacer un tratamiento de botón tranquilo para ello, cuando sea posible, para fomentar el intercambio!)

Pruebas

Prueba tus plantillas creando una campaña de correo electrónico y personalizando la plantilla. Esta prueba de esfuerzo puede ayudarte a asegurarte de que la plantilla funcionará bien para otras personas que pudieran estar utilizándola en diferentes situaciones. 

Enlaces rápidos 

• Lenguaje de plantillas: cómo crear estilos de plantillas editables
• Lenguaje de plantillas: cómo crear áreas de contenido editables
• Lenguaje de plantillas: cómo trabajar con selectores de variantes
• Tipos de plantillas