Usar HTML con el Editor de correo electrónico

Planes de ActiveCampaign
Starter
Plus
Pro
Enterprise

Con el editor de correo electrónico de ActiveCampaign, puede utilizar fácilmente HTML en el diseño de su correo electrónico. De este modo, tendrás total flexibilidad para crear la campaña que mejor se adapte a tus objetivos empresariales y que puedas solucionar problemas fácilmente. 

Toma nota

  •  Este artículo se refiere al editor de correo electrónico lanzado en 2022. Si desea aprender a utilizar las opciones HTML del Diseñador clásico, consulte Diseñador clásico: Utilizar el bloque de contenido HTML con campañas
  • Debes sentirte cómodo con HTML y CSS para usar esta opción
  • Nuestro equipo de CX no puede ayudarte a crear o solucionar problemas de ningún código que crees en el Editor de correo electrónico
  • Las campañas de correo electrónico no admiten iframes

Para agregar el bloque de contenido HTML:

Una forma de añadir HTML a su campaña es con el bloque de contenido HTML. Con esta opción, sólo añadirá código HTML al bloque de contenido. No se aplica al resto de bloques de contenido del editor de correo electrónico. 

  1. En el editor de correo electrónico, haga clic en el menú desplegable "Bloques" del menú de la derecha.
  2. Desplácese hasta la opción de bloque HTML.
  3. Arrastre el bloque de contenido HTML al diseño de su correo electrónico. El bloque HTML se mostrará en la ventana editor de correo electrónico.
  4. Haga clic en el bloque HTML para abrir el editor de código.
  5. Añada su HTML personalizado en el editor de código.
  6. Para salir del editor de código, haga clic en cualquier bloque en el editor de correo electrónico. 

Accede a la opción de código

Para un mayor control sobre el editor de correo electrónico, puede editar el HTML de su correo electrónico con el botón de código.

  1. En el editor de correo electrónico, haga clic en el botón "Código". Esto se encuentra en la parte superior derecha del informe.
    El botón de código situado en la parte superior del panel derecho.
  2. El panel de código se cargará en la parte inferior del Diseñador. Aquí puedes ver el código de tu correo electrónico. Tenga en cuenta que el editor de código mostrará HTML y CSS para cualquier bloque de contenido en el que haga clic. Si no selecciona un bloque de contenido, el editor mostrará el código de todo el correo electrónico.
  3. Para ajustar el código, haga clic en el área que desea actualizar y agregue o edite el código.
  4. Para salir de la vista de código, vuelva a hacer clic en el botón de código.

Crear una nueva plantilla con el Editor de correo electrónico y código personalizado

Puede crear una plantilla en el Editor de correo electrónico que utilice código personalizado.

  1. En la página Campañas, haz clic en "Plantillas de campaña".
  2. Haga clic en el botón "Crear una plantilla".
  3. Haga clic en la opción "Editor de correo electrónico", luego haga clic en "Continuar".
  4. En la página siguiente, haga clic en la opción "Comenzar desde cero".
  5. Se cargará el Editor de correo electrónico. Haga clic en el "Done" botón.
    El botón de código situado en la parte superior del panel derecho.
  6. El panel de código se abrirá en la parte inferior de la página y mostrará HTML y CSS.
    • Añada o edite el HTML en el editor
      de código HTML en el editor de código.
    • Para añadir CSS personalizado, haga clic en "CSS" a la derecha para expandir el cuadro y, a continuación, añada su CSS.
      CSS en el editor de código.
  7. Cuando haya terminado, haga clic en el botón "Código" para ver su trabajo. También puede utilizar las opciones de arrastrar y soltar para completar su correo electrónico (si es necesario). 

Solucionar problemas de diseño

Si algún texto o botón no se muestra correctamente, puede ver el código del correo electrónico y ajustarlo haciendo clic en en el botón "Código". Tener fácil acceso al código te ayuda a solucionar problemas y personalizar el estilo del correo electrónico.

Asegúrese de que su código HTML no incluye las siguientes etiquetas, ya que no son compatibles con los clientes de correo electrónico (como Gmail, Yahoo, etc.):

  • <button>
  • <form>
  • <input>
  • <select>
  • <textarea>
  • <iframe>
  • <script>
  • <video> 

¿Tienes más preguntas? Ponte en contacto

Start free trial