Importar una plantilla HTML personalizada

Si deseas tener un mayor control sobre el diseño de tus correos electrónicos que el que te ofrecen nuestras plantillas, puedes diseñar tu propia plantilla de HTML e importarla a tu cuenta de Mailchimp. Una vez importada tu plantilla personalizada, podrás utilizarla en futuras campañas.

En este artículo conocerás varias formas de importar y editar tu plantilla HTML personalizada.

Antes de empezar

A continuación, se detallan algunos puntos que debes conocer antes de empezar este proceso.

  • Se trata de una tarea avanzada y, por tanto, requiere que el usuario posea ciertos conocimientos de codificación personalizada. Contacta con tu desarrollador o contrata a un experto de Mailchimp si necesitas ayuda.
  • Antes de crear tu propia plantilla HTML o de contratar a un programador, examina otros tipos de plantillas que no requieren conocimientos de HTML.
  • Si necesitas consejos y prácticas recomendadas, infórmate sobre las limitaciones del diseño de correos electrónicos en HTML y consulta la Guía de diseño de correos electrónicos de Mailchimp.
  • Si editas el código de una plantilla que has creado tú en el Template Builder (Creador de plantillas), es posible que los cambios afecten a los borradores de campañas que utilizan la plantilla.
  • Empleamos un servicio de validación de HTML para asegurarnos de que la sintaxis está correcta.
  • En la plantilla personalizada incluye *|UNSUB|*, una etiqueta obligatoria en todas las campañas.
  • Asegúrate de que la codificación de caracteres del archivo HTML es UTF-8.
  • Procura que el formato de todas las imágenes sea JPG, JPEG, PNG o GIF. Incluye los PDF u otros documentos que desees alojar en Mailchimp y que estén enlazados en el código de la plantilla.

Opciones de importación

Una vez que tú o tu programador hayáis creado tu plantilla HTML, puedes importarla con uno de estos métodos.

Pegar código HTML

Para crear una plantilla personalizada pegando tu propio código HTML, sigue estos pasos.

  1. Navega hasta la página Templates (Plantillas).
  2. Haz clic en Create Template (Crear plantilla).
    botón-plantillas-clic-crear-plantilla
  3. En la pestaña Code your own (Codificar la tuya), selecciona Paste in code (Pegar código).
    botón-codificar-la-tuya-pegar-código
  4. En la pestaña Edit Code (Editar código), sustituye o cambia el código del ejemplo y pulsa Save (Guardar) en el panel de edición.
    botón-editar-código-guardar
  5. Cuando hayas terminado de editar tu plantilla, haz clic en Save and Exit (Guardar y salir).
    botón-editar-código-guardar-y-salir
  6. En la ventana modal emergente Save Template (Guardar plantilla), escribe el nombre de la plantilla y haz clic en Save (Guardar).
    modal-guardar-plantilla-clic-guardar

¡Buen trabajo! Ahora podrás acceder a tu plantilla personalizada en la página Templates y la tendrás guardada en el Campaign Builder.

Cómo importar un archivo HTML

Para crear una plantilla mediante la importación de un archivo HTML de tu equipo, sigue estos pasos.

  1. Navega hasta la página Templates (Plantillas).
  2. Haz clic en Create Template (Crear plantilla).
    botón-plantillas-clic-crear-plantilla
  3. En la pestaña Code your own (Codificar la tuya), selecciona Import HTML (Importar HTML).
    botón-codificar-la-tuya-importar-html
  4. Haz clic en Browse (Explorar) y selecciona el archivo HTML.
  5. Escribe el nombre de la plantilla y haz clic en Upload (Subir).
    modal-importar-html-clic-subir
  6. Revisa la plantilla y haz clic en Edit Code (Editar código) o Edit Design (Editar diseño) si quieres hacer algún cambio.
    botón-editor-plantillas-editar-código
  7. Cuando hayas terminado de editar tu plantilla, haz clic en Save and Exit (Guardar y salir).
    botón-editar-código-guardar-y-salir

¡Buen trabajo! Ahora podrás acceder a tu plantilla personalizada en la página Templates y la tendrás guardada en el Campaign Builder (Creador de campañas).

Cómo importar un archivo ZIP

Antes de importar un archivo ZIP es necesario tener en cuenta una serie de requisitos.

  • El archivo ZIP debe tener un tamaño de menos de 1 MB y contener solo un archivo HTML. Si hay más de un archivo HTML, usaremos el primero que encontremos.
  • Coloca todas las imágenes y archivos en el directorio raíz del archivo ZIP, no en subcarpetas. Subiremos todas las imágenes y archivos al Content Manager (Gestor de contenidos) y nos encargaremos de crear rutas absolutas al convertir el archivo ZIP.
  • Emplea solo letras, números y guiones en el nombre del archivo. Los espacios o los caracteres poco frecuentes pueden provocar problemas con la importación.
  • La carga es sensible a mayúsculas y minúsculas, por lo que el código debe coincidir exactamente con los nombres de archivo.

Una vez que el archivo esté correctamente guardado y formateado, tienes todo listo para crear la plantilla. Para crear una plantilla mediante la importación de un archivo ZIP, sigue estos pasos.

  1. Navega hasta la página Templates (Plantillas).
  2. Haz clic en Create Template (Crear plantilla).
    botón-plantillas-clic-crear-plantilla
  3. En la pestaña Code your own (Codificar la tuya), selecciona Import ZIP (Importar ZIP).
    botón-codificar-la-tuya-importar-zip
  4. Haz clic en Browse (Explorar) y selecciona el archivo ZIP.
  5. Escribe el nombre de la plantilla y haz clic en Upload (Subir).
    modal-importar-zip-clic-subir
  6. Revisa la plantilla y haz clic en Edit Code (Editar código) o Edit Design (Editar diseño) si quieres hacer algún cambio.
    botón-editor-plantillas-editar-código
  7. Cuando hayas terminado de editar tu plantilla, haz clic en Save and Exit (Guardar y salir).
    botón-editar-código-guardar-y-salir

¡Buen trabajo! Ahora podrás acceder a tu plantilla personalizada en la página Templates y la tendrás guardada en el Campaign Builder (Creador de campañas).

Cómo editar una plantilla personalizada

Una vez importada tu plantilla personalizada, tienes la opción de modificarla en el panel Edit Code (Editar código) del Template Builder (Creador de plantillas). Si has empleado el lenguaje de plantillas de Mailchimp, también puedes aplicar diferentes estilos en la pestaña Edit Design (Editar diseño).
botón-editor-plantillas-editar-código

Cuando tengas lista tu plantilla personalizada, puedes añadir contenido y perfeccionar el diseño en el Campaign Builder (Creador de campañas). Ten en cuenta que cualquier cambio adicional que hagas desde el Template Builder podrá afectar a los borradores de campañas y campañas en curso que empleen la plantilla.

Más recursos de edición

Dónde editar el código de la plantilla
Cómo añadir una imagen de fondo a una plantilla HTML personalizada
Introducción al lenguaje de plantillas de Mailchimp
Cómo utilizar bloques de contenido repetible o variable


¿Te fue útil este artículo?

¿Hay algo más que podemos hacer para mejorar nuestro sitio?