Editor de boletines: CSS en línea en boletines HTML

Se ha esforzado mucho en el diseño de su boletín y quiere que llegue a la bandeja de entrada de su destinatario exactamente como lo creó. Al fin y al cabo, cuando se envían boletines, un diseño atractivo es importante y esencial.  

Algunos clientes de correo electrónico como Gmail ya sólo muestran estilos CSS en línea. ¿Qué significa CSS o Inline CSS, cómo se accede al código fuente de la newsletter o de un elemento y cómo puede convertir fácilmente sus estilos en Inline CSS en nuestro editor de newsletters?

¿Qué es CSS/ Inline CSS?

CSS es la abreviatura de "Cascading Style Sheets" (hojas de estilo en cascada) y es un lenguaje informático que puede utilizarse para especificar y definir el diseño de un documento electrónico (por ejemplo, un sitio web o un boletín). Siga nuestras sencillas instrucciones para personalizar elementos como el diseño, el color y la tipografía. Se muestran en código fuente.

Una forma de formatear CSS en un documento web es combinar todas las especificaciones de estilo en un área central. Para eso está el CSS en línea. Algunos clientes de correo electrónico, como Gmail, AOL Mail y Yahoo, ahora sólo muestran CSS en línea en los boletines.

Ajustar el código fuente de un correo electrónico

Para acceder al código fuente de su correo electrónico en nuestro editor de boletines, haga clic en [Editor] y [Código fuente] en la esquina superior derecha.

Bildschirmfoto_2021-04-12_um_10.10.31.png

Defina y guarde el estilo de su boletín.

Edición del código fuente de un elemento

Puede navegar hasta el código fuente de un elemento en nuestro editor de boletines y ajustarlo. Al mover el ratón hacia su elemento, aparece un marco naranja. Haga clic en </> para acceder al código fuente de un elemento:

Bildschirmfoto_2021-03-23_um_09.36.15.png

Define y guarda tu estilo.

CSS en línea en el editor de boletines

Para convertir automáticamente los estilos en estilos CSS en línea, abra su correo electrónico en nuestro editor de boletines. Haz clic en los tres guiones de la derecha:

Bildschirmfoto_2021-04-27_um_15.16.07.png

Ahora puede activar la conversión de todos los estilos a [Inline CSS]:

Bildschirmfoto_2021-04-27_um_15.16.18.png

Ejemplo de área CSS

Este es el aspecto que podría tener un área de estilo en el código fuente de su boletín:

<estilo>

2 /* @título Prueba */

3.classtest

4 {

5 font-size: 13px;

6 font-family: Arial, sans-serif;

7 altura de línea: 21px;

8 color: #262626;

9 margen: 0pt;

10 padding: 0pt;

11 texto-decoración: subrayado;

12 borde: 0px solid #000000;

13 background-color: #370707;

14 }

15 </estilo>

16

 

Establece y da estilo a áreas CSS adicionales:

1/*@title Pie de página

2 @grupo Pie de página */

3.footer {

4 color de fondo: #A7C5A1;

5 font-size: 10px;

6 color: #ACE950;

7 ancho: 600px;    

8 margen: 0pt;

9 padding: 15px;

10 font-family: verdana;    

11 }

 

Consejo: Mantenga un estilo CSS sencillo para que, en caso de que el programa de correo electrónico del destinatario del boletín no cargue correctamente, el mensaje siga siendo legible.

Ayuda & Soporte

Si tiene alguna pregunta o necesita más ayuda, póngase en contacto con nuestro equipo de servicio en cualquier momento.