Configuración de apariencia del editor de correo de Stripo

Published: 22 de octubre de 2024 · Last updated: 21 de julio de 2026 · By Marcus Biel

La pestaña Apariencia te permite controlar el estilo global de tu correo electrónico, como las fuentes, los colores de fondo, los estilos de los botones y el formato específico para móviles. Esto garantiza la coherencia y la adaptabilidad en distintos dispositivos y clientes de correo electrónico.

A continuación, encontrarás una explicación detallada de cada sección de la pestaña Apariencia.

---

1. Configuración general

Personaliza la apariencia y la alineación generales de tu correo electrónico. Esta configuración se aplica globalmente a todas las secciones.

• Alineación del mensaje: Alinea el contenido del correo a la izquierda, al centro o a la derecha.
• Relleno predeterminado: Establece un espaciado uniforme alrededor de las estructuras nuevas o ajusta el relleno de cada lado (Superior, Derecho, Inferior, Izquierdo) individualmente.
• Color de fondo general: Establece el color de fondo del correo mediante un código hexadecimal o un selector de color.
• Fuente: Elige entre fuentes estándar como Arial, Helvetica o fuentes decorativas como Roboto y Lato.
• Interlineado: Ajusta el espacio entre líneas con cuatro opciones predefinidas.
• Espacio inferior de los párrafos: Activa o desactiva el espacio entre párrafos.
• Subrayar enlaces: Subraya automáticamente todos los enlaces del correo (activar/desactivar).
• Diseño adaptable: Actívalo para garantizar que tu correo se adapte a distintos tamaños de pantalla, especialmente en dispositivos móviles.
• Dirección del texto RTL: Actívala para idiomas como el árabe o el hebreo.
• Imagen de fondo: Añade una imagen de fondo con la opción de enlazarla. Arrastra y suelta para cargar imágenes.

---

2. Franjas

Las franjas representan grandes secciones estructurales del correo electrónico (por ejemplo, Encabezado, Contenido, Pie de página y Área de información). Cada franja puede tener un estilo independiente.

Franja de encabezado

• Tamaño del texto: Personaliza el tamaño del texto del encabezado (8–72).
• Color de fondo: Establece un color de fondo sólido o déjalo transparente.
• Color de fondo del contenido: Ajusta el color de fondo dentro de la sección del encabezado.
• Color de fuente: Define el color del texto.
• Color de los enlaces: Establece el color de los enlaces de navegación u otros enlaces del encabezado.
• Imagen de fondo: Añade una imagen de fondo opcional.

Franja de contenido

El cuerpo principal del correo electrónico para texto, imágenes y elementos interactivos.

• Tamaño del texto: Ajusta el tamaño del texto del contenido (8–72).
• Color de fondo del contenido: Define el color de fondo del área de contenido principal.
• Color de fuente: Establece el color predeterminado del texto.
• Color de los enlaces: Personaliza el color de los enlaces.

Franja de pie de página

Se utiliza normalmente para datos de contacto, información legal o enlaces a redes sociales.

• Tamaño del texto: Establece el tamaño del texto (8–72).
• Color de fondo: Elige un fondo sólido o déjalo transparente.
• Color de fondo del contenido: Define el fondo interior del pie de página.
• Color de fuente: Establece el color de la fuente.
• Color de los enlaces: Personaliza el color de los enlaces del pie de página.
• Imagen de fondo: Añade opcionalmente una imagen con un enlace en el que se pueda hacer clic.

Franja del área de información

Se utiliza para avisos legales, información jurídica o información adicional.

• Tamaño del texto: Define el tamaño de la fuente (8–72).
• Color de fuente: Establece el color de la fuente.
• Color de los enlaces: Ajusta los colores de los enlaces de esta franja.

---

3. Encabezados

Define el estilo visual de los encabezados (H1, H2, H3) para establecer jerarquía y estructura en tu correo electrónico.

• Fuente: Elige una fuente para los encabezados.
• Interlineado: Ajusta el espacio entre líneas para facilitar la lectura.
• Tamaño de los encabezados: Personaliza el tamaño de los encabezados H1, H2 y H3 (8–72).
• Estilo del texto: Aplica estilos Negrita o Cursiva.
• Color de fuente: Establece un color único para cada tipo de encabezado.

---

4. Botón

Diseña los botones de tu correo electrónico para mejorar la interacción.

• Compatibilidad con Outlook: Actívala para garantizar una visualización correcta en Microsoft Outlook mediante código VML (puede aumentar el tamaño del correo).
• Color del botón: Establece el color predeterminado de los botones.
• Resaltar botones al pasar el cursor: Activa o desactiva un efecto de color al pasar el cursor.
  • Color al pasar el cursor: Elige el color que se mostrará al pasar el cursor.
• Color de fuente: Define el color del texto de los botones.
• Estilo del texto:
  • Fuente: Selecciona una fuente para el texto del botón.
  • Tamaño de fuente: Ajusta el tamaño del texto (8–72).
  • Estilo: Aplica estilos de texto Negrita o Cursiva.
• Radio del borde: Redondea las esquinas de los botones (0–100).
• Bordes:
  • Tipo: Elige bordes sólidos, discontinuos o punteados.
  • Color: Define los colores de los bordes.
• Relleno: Ajusta el relleno interno de los botones (Superior, Derecho, Inferior, Izquierdo).

---

5. Formato móvil

Asegúrate de que tu correo se vea bien en dispositivos móviles mediante una configuración específica para móviles.

• Tamaños del texto del encabezado, contenido, pie de página y área de información: Personaliza el tamaño del texto de cada sección en dispositivos móviles.
• Tamaño de fuente de los elementos del menú: Ajusta el tamaño de fuente de los elementos del menú de navegación.
• Tamaños de los encabezados: Establece los tamaños de H1, H2 y H3 para la vista móvil.
• Alineación de los encabezados: Alinea los encabezados (Izquierda, Centro, Derecha).
• Tamaño del texto de los botones: Personaliza el tamaño del texto de los botones para móviles.
• Botones de ancho completo: Activa los botones para que ocupen todo el ancho de la pantalla.
• Relleno superior e inferior: Ajusta el relleno para mejorar la apariencia en móviles.
• Margen del contenido: Ajusta el margen alrededor del contenido para móviles (0–100).

---

Notas finales

• Pruebas: Prueba siempre tu correo en distintos dispositivos y clientes de correo para garantizar la coherencia.
• Accesibilidad: Utiliza fuentes accesibles, una estructura adecuada de encabezados y texto alternativo para las imágenes a fin de garantizar la inclusión.
• Optimización: Minimiza el tamaño de los archivos para acelerar la carga y mejorar el rendimiento, especialmente para los usuarios de dispositivos móviles.