# Plantillas y editor HTML de Senderity para tus correos

> Senderity te deja diseñar cada correo de dos formas. Con el constructor de bloques arrastras Título, Texto, Imagen, Botón, Separador y Espacio, partiendo de cuatro plantillas. Con el Editor HTML pegas tu propio código o subes un .html o un .zip con sus imágenes, y ves la vista previa en escritorio y móvil.

Fuente: https://kisscale.com/producto/senderity/plantillas-y-editor-html
Actualizado: 2026-10-29

## ¿Qué es el diseño de un correo en Senderity?

El diseño es el paso 3 del asistente de [[senderity/campanas-de-email]], y también el diseñador de los correos de [[senderity/automatizaciones-de-correo]]. Es el mismo editor en ambos casos y ofrece dos caminos: el **constructor de bloques**, para armar un correo sin escribir código, y el **Editor HTML**, para usar un diseño que ya tienes hecho.

## Las plantillas de partida

En la pestaña **Plantillas** de Senderity, bajo el título «Empieza con una base sólida», hay cuatro bases responsivas. Al pulsar una se abre el asistente de campaña con esos bloques ya puestos.

| Plantilla | Para qué sirve |
|---|---|
| **En blanco** | Control total: empiezas sin bloques. |
| **Newsletter** | Actualizaciones editoriales, con título, introducción, imagen principal y botón. |
| **Lanzamiento** | Anunciar un producto o servicio, con título, mensaje y botón. |
| **Mensaje simple** | Un correo personal y directo, con saludo y texto. |

Los textos de las plantillas son de ejemplo: reemplázalos antes de enviar.

## El constructor de bloques

En la columna izquierda del paso **Diseño** hay seis bloques. Al agregar uno aparece al final del correo; pulsa un bloque para editarlo en el panel **Contenido** de la derecha. Cada bloque tiene botones para subirlo (↑), bajarlo (↓) o quitarlo (×).

| Bloque | Qué puedes ajustar |
|---|---|
| **Título** | El texto. |
| **Texto** | El texto, con saltos de línea. |
| **Botón** | El texto y el **Enlace** al que lleva. |
| **Separador** | Una línea divisoria, sin ajustes. |
| **Espacio** | La **Altura**, entre 8 y 100 píxeles. |
| **Imagen** | La **URL de imagen** (un enlace público a tu imagen) y el **Texto alternativo**. |

Con **Vista del diseño** alternas entre **Escritorio** y **Móvil** para ver cómo se comporta el correo en cada tamaño. Todo el correo se muestra en una tarjeta blanca centrada, de hasta 640 píxeles de ancho.

## El Editor HTML paso a paso

1. En el paso **Diseño**, pulsa **Editor HTML**. Si ya tenías bloques, Senderity pregunta «El diseño pasa a código HTML para que lo edites como código. ¿Seguir?».
2. En el centro verás dos pestañas, **Vista previa** y **HTML**. En **HTML** pegas o editas el código; la vista previa se actualiza sola mientras escribes.
3. En el panel derecho, bajo **Importar diseño**, pulsa **Subir .html o .zip**. Puedes elegir un .html, un .zip con todo, o el .html y el .zip de sus imágenes a la vez. El código del centro se reemplaza por el que subas.
4. Si el código usa imágenes con rutas de tu computador, el panel **Imágenes** las lista y avisa que no se verán hasta que las subas. Pulsa **Subir imágenes** y elige un .zip o los archivos sueltos: solo cambian sus rutas en el código.
5. Cuando todo tenga una URL pública, el panel dice «Todas las imágenes del código tienen una URL pública».
6. Para regresar a los bloques pulsa **Volver a bloques**. Ojo: el código se pierde.

## Límites y avisos al importar

| Dato | Límite |
|---|---|
| Archivo HTML | 2 MB |
| Archivo .zip | 25 MB, hasta 300 archivos dentro |
| Cada imagen | 5 MB, en formato png, jpg, gif o webp |
| Archivos sueltos por subida | Hasta 60; si son más, súbelos en un .zip |

Si el HTML pesa más de 102 KB, Senderity avisa que Gmail recorta los correos grandes y muestra «Ver mensaje completo». La vista previa se muestra aislada y sin ejecutar scripts.

## El enlace para darse de baja

Todo correo masivo debe permitir cancelar la suscripción. Tu HTML puede incluir el enlace con la variable `{{unsubscribe_url}}`. Si no lo trae, Senderity agrega al final del correo un pie con la dirección que escribiste en el paso **Revisión** y el enlace **Cancelar suscripción**.

::: consejo
Mantén el correo por debajo de 102 KB, usa imágenes con una URL pública y revisa siempre la vista **Móvil**. Envíate una **Prueba** desde la pestaña **Campañas** antes de enviar a la lista completa.
:::

## Preguntas frecuentes

### ¿Puedo subir las imágenes desde el constructor de bloques?

El bloque **Imagen** usa una URL pública. Para subir los archivos de imagen desde tu computador usa el Editor HTML y el botón **Subir imágenes**.

### ¿Qué pasa con mi diseño si vuelvo a los bloques?

El código HTML se pierde. Senderity te pide confirmación antes de salir del editor HTML.

### ¿Puedo diseñar el correo de una automatización con el mismo editor?

Sí. En [[automata]] guardas la automatización de email y pulsas **Diseñar email**; se abre este mismo editor y, al terminar, **Guardar diseño** te devuelve al flujo.

### ¿Se ve igual en todos los programas de correo?

No se puede garantizar: cada programa interpreta el HTML a su manera. Por eso conviene probar con un envío de prueba y mantener el diseño sencillo.
