Referencia de bloques de contenido de correo electrónico

Referencia para cada bloque que puedes añadir en el lienzo del editor de arrastrar y soltar, y para los tipos de enlace disponibles en botones y texto. Para controlar qué destinatarios ven un bloque, establece una condición de visualización.

Añadir bloques de contenido

Abre la pestaña Bloques y arrastra un bloque al lienzo, o haz clic en un bloque para añadirlo al final del correo electrónico. Bloques disponibles:

Encabezado: títulos y titulares cortos en el correo electrónico
Texto: cuerpo del texto y descripciones más largas
Botón: una llamada a la acción en la que se puede hacer clic
Imagen: imágenes del Almacén de medios, subidas o desde una URL
Video: un póster de video en el que se puede hacer clic que enlaza a un video de YouTube o Vimeo
Tarjeta: una imagen emparejada con un encabezado, texto y botón en un solo diseño
Divisor: una línea que separa secciones visualmente
2 columnas: dos columnas iguales una al lado de la otra
3 columnas: tres columnas iguales una al lado de la otra
4 columnas: cuatro columnas iguales una al lado de la otra
33 / 67: dos columnas donde la izquierda ocupa aproximadamente el 33% del ancho y la derecha aproximadamente el 67%
67 / 33: dos columnas donde la izquierda ocupa aproximadamente el 67% del ancho y la derecha aproximadamente el 33%
Temporizador: una cuenta atrás para ofertas y plazos
Menú: una fila o columna de enlaces, como navegación o contactos
Social: iconos que enlazan a tus perfiles sociales
HTML: HTML personalizado, como un formulario, encuesta o video incrustado
Productos: una cuadrícula repetitiva de tarjetas de productos. Introduce los productos a mano, o extráelos de tu Catálogo de productos, del carrito abandonado de un destinatario, o de una estrategia de recomendación integrada como los más vendidos o de vuelta en stock.
Noticias: una cuadrícula repetitiva de tarjetas de artículos. Elígelos a mano de un feed RSS o Atom, o extráelos en vivo de un feed registrado para tu aplicación.

Encabezado y texto

Los bloques de Encabezado y Texto contienen el texto que los destinatarios leen en el correo electrónico. Usa Encabezado para títulos y líneas cortas, Texto para el cuerpo del texto y descripciones más largas.

Haz clic en un bloque en el lienzo para empezar a editar. Selecciona texto para que aparezca la barra de herramientas de formato.

Bloque de encabezado seleccionado en el lienzo con la barra de herramientas de formato de texto mostrando opciones de estilo y formato

Opciones de la barra de herramientas

Estilo de texto: establece un estilo de párrafo (Encabezado 1, Encabezado 2, Normal, etc.) para todo el bloque
Tamaño de fuente: redimensiona el texto seleccionado, o aplica un tamaño a todo el párrafo
Negrita / Cursiva / Subrayado / Tachado: formato de caracteres estándar
Alineación: izquierda, centro o derecha
Enlace: envuelve el texto seleccionado en un hipervínculo
Lista con viñetas / Lista numerada: convierte las líneas seleccionadas en una lista. Cualquier viñeta o número con el que ya comiencen las líneas se elimina, para que no se duplique con el marcador propio de la lista.

Selecciona el bloque (no un rango de texto) para abrir su configuración en el panel derecho, luego activa Espaciado entre letras para aumentar o disminuir el espaciado entre caracteres para todo el bloque. Acepta valores fraccionarios y negativos. Para aplicar el espaciado entre letras a todos los bloques de texto a la vez, establécelo como un valor predeterminado para todo el correo electrónico en Tipografía. Consulta Configurar el estilo de todo el correo electrónico.

Pegar desde otros documentos

Pegar texto de Google Docs, Word o una página web mantiene la negrita, cursiva, subrayado, tachado y enlaces. El color, el tamaño de fuente y la familia de fuentes del origen no se transfieren — la tipografía propia del bloque siempre prevalece. Para ignorar por completo el formato de origen y adoptar el estilo del bloque, pega con Ctrl+Shift+V (Cmd+Shift+V en Mac).

Una lista con viñetas o numerada pegada mantiene su viñeta o número como texto plano al principio de cada línea, en el mismo bloque. Selecciona esas líneas y haz clic en Lista con viñetas / Lista numerada para convertirlas en una lista real — el botón elimina el marcador sobrante por ti.

En los campos de una sola línea, como la etiqueta de un Botón, los saltos de línea pegados se colapsan en un solo espacio.

Personalización con Etiquetas de Fusión (Merge Tags)

Las Etiquetas de Fusión son marcadores de posición que insertan un valor de Etiqueta (Tag) del perfil del destinatario, para que cada suscriptor vea un texto personalizado. Para añadir una, selecciona el texto, haz clic en Etiquetas de Fusión en la barra de herramientas y elige una Etiqueta de tu cuenta. Haz clic en una Etiqueta de Fusión insertada para abrir un panel con los campos Predeterminado (el valor que se muestra cuando la etiqueta está vacía) y Formato (mayúsculas, formato de número o fecha para aplicar al valor).

Imagen

Un bloque de Imagen muestra una imagen en el correo electrónico. Selecciónalo en el lienzo para abrir la configuración de Imagen en el panel derecho.

Añadir una imagen

Haz clic en Añadir imagen cuando el bloque esté vacío, o en Reemplazar imagen cuando ya haya una imagen establecida. Esto abre la Galería de medios con tres pestañas:

Biblioteca: tus archivos subidos, con búsqueda por nombre de archivo.
Fotos de stock: busca fotos gratuitas de Pexels sin salir del editor. Haz clic en una para copiarla a tu biblioteca e insertarla.
Generar con IA: describe la imagen que quieres y elige una relación de aspecto. La imagen generada se guarda en tu biblioteca.

Galería de medios con las pestañas Biblioteca, Fotos de stock y Generar con IA, y un campo de búsqueda por nombre de archivo

También puedes pegar un enlace alojado directamente en URL de la imagen para omitir la galería.

Eliminar imágenes de la Biblioteca

En la pestaña Biblioteca, pasa el cursor sobre un archivo y haz clic en su icono de Eliminar para borrarlo, o marca varios archivos (o haz clic en Seleccionar todo para seleccionar todas las imágenes de la página actual) y haz clic en Eliminar seleccionados para eliminarlos en masa. Confirma el diálogo para proceder.

Texto alternativo

Describe la imagen en Texto alternativo para la accesibilidad, o haz clic en Generar alt con IA para que la IA lo escriba a partir de la imagen en tu idioma de edición actual. Las imágenes añadidas desde Fotos de stock o Generar con IA obtienen texto alternativo automáticamente.

Tamaño y ajuste

Ancho: establece el ancho de la imagen en px, o como un porcentaje del espacio disponible para que se mantenga fluida. Déjalo en el valor predeterminado para usar el ancho natural de la imagen.
Altura (px): establece una altura de renderizado fija. Déjalo vacío para que se escale automáticamente — a partir de la relación de recorte si se establece una, si no, a partir de las proporciones naturales de la imagen.
Recortar: elige Original para mantener las proporciones naturales de la imagen, o una relación (Cuadrado (1:1), 4:3, 3:2, 16:9) para recortar la imagen a ese cuadro.
Ajuste: elige Cubrir para llenar el cuadro y recortar a él. Establece el punto de recorte con Punto focal. O elige Contener para escalar toda la imagen dentro del cuadro sin recortar. Posiciónala con Establecer posición.
Radio de esquina (px): redondea las esquinas de la imagen. Activa Más opciones para establecer cada esquina por separado, o déjalo desactivado para aplicar el mismo radio a las cuatro.

Cambia el lienzo a Móvil (ver Editar la vista móvil) para establecer cualquiera de estos por separado para las pantallas de teléfono. Marca Ancho (móvil), Altura (móvil), Recortar (móvil) o Ajuste (móvil) para anular esa configuración específica, comenzando desde su valor de escritorio; deja una casilla sin marcar para seguir heredando la configuración de escritorio. Recortar (móvil) solo aparece cuando Recortar está establecido en una relación en el escritorio, y cambiar Recortar de nuevo a Original en el escritorio descarta cualquier anulación de Recortar (móvil).

Configuración de tamaño y ajuste para un bloque de Imagen en la vista móvil, mostrando las casillas de anulación para móvil de Ancho, Altura, Recorte y Ajuste, todas configuradas para heredar el valor de escritorio

Enlaces y espaciado

Para abrir un enlace cuando se hace clic en la imagen, introdúcelo en URL del enlace y establece Destino del enlace para abrirlo en la misma pestaña o en una nueva. Consulta Añadir enlaces para los tipos de enlace disponibles.

En Espaciado, activa Relleno para añadir espacio alrededor de la imagen. Usa Todos los lados para un relleno uniforme, o activa Más opciones para establecer cada lado por separado.

Panel de configuración de imagen con Reemplazar imagen, URL de la imagen, Texto alternativo, URL del enlace, Destino del enlace y Relleno

Video

Un bloque de Video añade un video de YouTube o Vimeo al correo electrónico como una miniatura en la que se puede hacer clic. Los clientes de correo electrónico no pueden reproducir video dentro del mensaje, por lo que el bloque muestra una imagen fija con una superposición de ▶. Cuando el destinatario la toca, el video se abre en YouTube o Vimeo. Esto funciona en todos los clientes principales, incluido Outlook.

Selecciona el bloque de Video en el lienzo para abrir su configuración en el panel derecho.

URL del video: pega un enlace de YouTube o Vimeo. El editor obtiene una miniatura automáticamente.
Texto alternativo: describe el video para la accesibilidad.
URL de la miniatura: mantén la miniatura obtenida automáticamente, o haz clic en Añadir miniatura / Reemplazar miniatura para elegir una de la Galería de medios, o pega un enlace alojado directamente.
Superposición del botón de reproducción: activado por defecto. Desactívalo para mostrar la miniatura simple sin la superposición de ▶. La superposición no está disponible para miniaturas en algunos hosts externos. El editor te avisa cuando esto se aplica, y el correo electrónico muestra la miniatura simple en su lugar.
Ancho (px), Radio de esquina (px) y Alineación: controlan cómo se ve la miniatura y dónde se sitúa en el diseño. Puedes establecer la alineación por separado para móviles.

Configuración del bloque de video con URL del video, Texto alternativo, URL de la miniatura, Superposición del botón de reproducción, Ancho, Radio de esquina y Alineación

Tarjeta

Un bloque de Tarjeta combina una imagen con un encabezado, texto y un botón en un único diseño predefinido. Selecciónalo en el lienzo para abrir su configuración en el panel derecho.

Diseño: elige en qué lado se sitúa la imagen en relación con el contenido.
Imagen: reemplaza la imagen, establece el texto alternativo o edita la indicación para una imagen que creaste con Generar con IA.
Tamaño y ajuste: los campos de tamaño dependen del Diseño. Recortar está disponible para todos los diseños. Ajuste se aplica a todos los diseños:
- Superior: Altura establece la altura de la imagen en px o como un porcentaje del ancho de la tarjeta. Ancho (px) estrecha la imagen a un ancho de píxel fijo y la centra.
- Fondo: Altura establece la altura de la tarjeta en px o como un porcentaje de su ancho. No hay campo de Ancho (px). La imagen es el fondo de la tarjeta. Ajuste también funciona aquí: Cubrir recorta la imagen a la tarjeta — establece el punto de recorte con Punto focal — y Contener escala toda la imagen dentro de ella, colocada con Establecer posición. Outlook Desktop aproxima Contener e ignora ambos.
- Izquierda o Derecha: Ancho establece el ancho de la columna de la imagen en px o como un porcentaje de la tarjeta. Altura (px) fija la imagen a una altura en píxeles. Establecer una altura en píxeles borra la relación de recorte de abajo. Elegir una relación de recorte borra la altura en píxeles. No puedes usar ambos a la vez.
- Para todos los diseños:
  - Recortar: elige Original para mantener las proporciones naturales de la imagen, o una relación (Cuadrado (1:1), 4:3, 3:2, 16:9) para recortar la imagen a ese cuadro.
  - Ajuste: elige Cubrir para llenar el cuadro y recortar a él. Establece el punto de recorte con Punto focal. O elige Contener para escalar toda la imagen dentro del cuadro sin recortar. Posiciónala con Establecer posición.
  - Radio de esquina (px): redondea las esquinas de la imagen. Activa Más opciones para establecer cada esquina por separado, o déjalo desactivado para aplicar el mismo radio a las cuatro. El mismo soporte de cliente de correo electrónico que cualquier otra imagen.
Espaciado: establece el relleno alrededor del contenido de la tarjeta.

Botón

Un Botón es una llamada a la acción en la que se puede hacer clic en el correo electrónico.

Haz clic en un bloque de Botón para editar su etiqueta en el lienzo. Usa la barra de herramientas para cambiar el tamaño de la fuente, el color del texto, negrita, cursiva, subrayado, tachado y alineación. La etiqueta es de una sola línea: los saltos de línea pegados se colapsan en un espacio. Consulta Pegar desde otros documentos para saber qué mantiene y qué elimina un pegado.

Para establecer qué sucede cuando el destinatario hace clic en el botón:

Haz clic en el icono de enlace en la barra de herramientas para abrir Insertar/Editar enlace.
O usa Tipo de acción y URL en la sección Enlace del panel derecho.

Bloque de botón en el lienzo con una barra de herramientas de formato y configuración de Enlace en el panel derecho

Consulta Añadir enlaces para los tipos de acción disponibles.

En el panel derecho, en Estilos:

Alineación: izquierda, centro o derecha.
Fondo: actívalo para anular el aspecto predeterminado, luego elige Sólido para un color sólido o Gradiente para un gradiente lineal de dos paradas (un color de inicio, un color de final y un ángulo en grados, por defecto 90°). Con Gradiente seleccionado, el botón todavía muestra un relleno sólido en los clientes de correo electrónico que no admiten fondos de gradiente, como Outlook en Windows. Los botones que ya tenían un fondo sólido lo conservan y se abren con Sólido seleccionado.
Color del texto, Tamaño de fuente y Familia de fuentes: activa cada opción para anular el aspecto predeterminado.
Radio de esquina, Color del borde y Ancho del borde: forma y contorno del botón. Gmail y Apple Mail renderizan el radio de esquina del botón; Outlook Desktop lo ignora y muestra esquinas cuadradas, al igual que lo hace con las imágenes.
Ancho: establece un ancho de botón fijo o déjalo automático.
Relleno: añade espacio dentro del botón. Usa Todos los lados para un relleno uniforme, o activa Más opciones para establecer cada lado por separado.

Configuración de Estilos de botón en el panel derecho con Alineación, Fondo, Color del texto, Tamaño de fuente, Radio de esquina y Relleno

Divisor

Un Divisor es una línea horizontal entre bloques de contenido. Úsalo para separar secciones visualmente en el correo electrónico.

Configura el estilo de línea (Sólido, Discontinuo, Punteado), color, grosor y ancho en el panel de configuración.

Configuración del bloque Divisor con opciones de estilo de línea, color, grosor y ancho en el panel derecho

HTML

El bloque HTML te permite pegar HTML personalizado en tu correo electrónico. Úsalo para un formulario personalizado, una encuesta o un video incrustado.

Encima del campo de código, haz clic en Etiqueta de fusión para buscar las Etiquetas (Tags) de tu cuenta e insertar una Etiqueta de Fusión en la posición del cursor — la misma función de personalización descrita anteriormente — o haz clic en el icono de emoji para insertar un emoji de la misma manera. Haz clic en una Etiqueta de Fusión insertada para abrir el mismo panel de Predeterminado / Formato que en un bloque de Encabezado o Texto.

Ejemplos

Este formulario de contacto recopila una dirección de correo electrónico para enviar un código promocional para la Venta de Año Nuevo.

Formulario de contacto HTML en el editor de correo electrónico con un campo de correo electrónico y un botón Obtener mi código

Código HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body { margin: 0; padding: 20px; font-family: Arial, sans-serif; }
  h2 { font-size: 18px; margin-bottom: 8px; color: #222; }
  p { font-size: 14px; color: #666; margin-bottom: 20px; }
  input {
    width: 100%;
    padding: 12px;
    margin-bottom: 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 15px;
    box-sizing: border-box;
  }
  button {
    width: 100%;
    padding: 14px;
    background: #CC0000;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
  }
</style>
</head>
<body>

<h2>Get your New Year Sale code</h2>
<p>Enter your email and we'll send you an exclusive promo code for up to 50% off.</p>

<div id="form">
  <input type="email" placeholder="Your email address" />
  <button type="button">Get my code</button>
</div>

</body>
</html>

Esta encuesta pregunta por qué categoría está comprando el destinatario y enlaza cada opción a la página de venta correspondiente.

Encuesta HTML en el editor de correo electrónico preguntando qué está buscando el usuario con cuatro opciones de categoría

Código HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body { margin: 0; padding: 20px; font-family: Arial, sans-serif; text-align: center; }
  h2 { font-size: 18px; margin-bottom: 6px; color: #222; }
  p { font-size: 13px; color: #888; margin-bottom: 20px; }
  .option {
    display: block;
    width: 100%;
    padding: 14px;
    margin-bottom: 10px;
    background: #f5f5f5;
    border: 2px solid transparent;
    border-radius: 10px;
    font-size: 15px;
    cursor: pointer;
    box-sizing: border-box;
    text-decoration: none;
    color: #222;
  }
  .option:hover { border-color: #CC0000; background: #fff5f5; }
</style>
</head>
<body>

<h2>What are you shopping for?</h2>
<p>Pick a category and go straight to your deals</p>

<a class="option" href="https://example.com/sale/clothing">👗 Clothing</a>
<a class="option" href="https://example.com/sale/electronics">📱 Electronics</a>
<a class="option" href="https://example.com/sale/beauty">💄 Beauty</a>
<a class="option" href="https://example.com/sale/home">🏠 Home & Living</a>

</body>
</html>

Este ejemplo incrusta un video promocional de la Venta de Año Nuevo en el correo electrónico.

Código HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 20px;
    text-align: center;
  }
  .video-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
  }
  .video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
</style>
</head>
<body>

<h1>New Year Sale — Up to 50% Off</h1>

<div class="video-container">
  <iframe src="https://www.youtube.com/embed/YOUR_VIDEO_ID"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
    allowfullscreen></iframe>
</div>

</body>
</html>

También puedes añadir un enlace para cancelar la suscripción directamente en el bloque HTML:

<a href=%%PW_EMAIL_UNSUBSCRIBE%%>Unsubscribe</a>

El marcador de posición %%PW_EMAIL_UNSUBSCRIBE%% se reemplaza con la URL de cancelación de suscripción de Pushwoosh cuando se envía el correo electrónico.

Menú

El bloque Menú coloca varios elementos en los que se puede hacer clic en una fila o columna. Úsalo para una barra de navegación o una lista de contactos de la empresa.

Para cada elemento del menú, establece:

Etiqueta: el texto que ven los destinatarios
URL: a dónde se abre el elemento
Destino: misma pestaña o una nueva pestaña

En la configuración del bloque, también puedes establecer:

Dirección: Horizontal o Vertical
Alineación: Izquierda, Centro o Derecha
Separador: un divisor opcional entre elementos
Fuente, tamaño, peso, espaciado entre letras y colores de enlace/texto

Configuración del bloque de menú con etiquetas de elementos, URL, dirección, alineación y opciones de separador

El bloque Social muestra una fila de iconos de redes sociales que enlazan a tus perfiles. Úsalo para enviar a los destinatarios a Facebook, Instagram, X y otras plataformas desde el correo electrónico.

Añade entradas de plataformas, luego establece la alineación, el tamaño del icono y el espacio entre iconos.

Configuración del bloque social con enlaces de plataformas más Alineación, Tamaño del icono y Espacio

Temporizador de cuenta atrás

El bloque Temporizador es una cuenta atrás en el correo electrónico. Úsalo para ofertas por tiempo limitado, ventas flash y recordatorios de eventos.

Para configurarlo:

En Cuenta atrás, establece la Fecha de finalización y la Hora de finalización, luego elige la Zona horaria y el Idioma para las etiquetas del temporizador.
Activa Etiquetas para mostrar los subtítulos “días / horas / minutos / segundos” debajo de los dígitos, o desactívalo para solo números.
En Apariencia, establece el Fondo, el Color de los dígitos, el Color de las etiquetas y el tamaño de la fuente para los dígitos (por defecto 40px) y las etiquetas (por defecto 16px).
Ajusta el Espaciado (relleno) según sea necesario.

Configuración del bloque de temporizador con fecha y hora de finalización de la cuenta atrás, Etiquetas, Apariencia y opciones de Espaciado

El temporizador se renderiza como una imagen nítida en cualquier idioma o tamaño, con un fondo que se extiende por toda la fila del correo electrónico, y una versión renderizada nativamente para el ancho móvil en lugar de una imagen de escritorio reducida.

Columnas

Las Columnas dividen el lienzo en secciones una al lado de la otra para que puedas colocar contenido uno junto al otro en una fila.

Arrastra uno de estos bloques al lienzo:

2 columnas: dos columnas iguales
3 columnas: tres columnas iguales
4 columnas: cuatro columnas iguales
33 / 67: columna izquierda de aproximadamente 33% de ancho, derecha de aproximadamente 67%
67 / 33: columna izquierda de aproximadamente 67% de ancho, derecha de aproximadamente 33%

Luego añade contenido a cada columna. Para cambiar el espaciado de todas las columnas en el correo electrónico, abre Configuración → Valores predeterminados de las columnas y ajusta el relleno exterior, el relleno de la columna y el espacio entre columnas.

Para la propia imagen de la columna (la que añades con Añadir imagen en la configuración de la columna), la configuración muestra una sección de Tamaño y ajuste. Este es el mismo control que el diseño Izquierda / Derecha del bloque de Tarjeta. Un bloque de Imagen arrastrado a una columna es un elemento de contenido separado y mantiene sus propios campos de tamaño simples — ver Imagen.

También puedes pegar un enlace alojado directamente en URL de la imagen para omitir la galería.

Ancho: establece el ancho de la imagen en px o como un porcentaje de la columna. Déjalo sin establecer para llenar la columna.
Altura (px): fija la imagen a una altura en píxeles. Establecer una altura en píxeles borra la relación de recorte de abajo. Elegir una relación de recorte borra la altura en píxeles. No puedes usar ambos a la vez.
Recortar: elige Original para mantener las proporciones naturales de la imagen, o una relación (Cuadrado (1:1), 4:3, 3:2, 16:9) para recortar la imagen a ese cuadro.
Ajuste: elige Cubrir para llenar el cuadro y recortar a él. Establece el punto de recorte con Punto focal. O elige Contener para escalar toda la imagen dentro del cuadro sin recortar. Posiciónala con Establecer posición.
Radio de esquina (px): redondea las esquinas de la imagen. Activa Más opciones para establecer cada esquina por separado, o déjalo desactivado para aplicar el mismo radio a las cuatro. El mismo soporte de cliente de correo electrónico que cualquier otra imagen.

Productos

Un bloque de Productos muestra una cuadrícula de tarjetas de productos de una plantilla compartida. Cada tarjeta puede incluir una imagen, título, descripción, precio y un botón de compra. La plantilla se repite para cada producto.

Haz clic en una tarjeta en el lienzo para activarla y editarla:

Cambia el título, la descripción, el precio, la imagen o el enlace por producto para actualizar solo esa tarjeta.
Cambia el diseño de la plantilla, los colores, el relleno o los elementos que contiene para actualizar todas las tarjetas.

En el panel de configuración, en Fuente, elige de dónde provienen los productos:

Manual: introduce los productos a mano, elígelos de tu Catálogo de productos por ID, o mezcla ambos.
Regla de catálogo: extrae productos automáticamente por categoría y orden de clasificación, resueltos de nuevo desde el catálogo en el momento del envío.
Carrito: muestra los artículos del carrito abandonado actual de cada destinatario.
Recomendaciones: extrae productos clasificados por una estrategia integrada — más vendidos, novedades, de vuelta en stock o bajada de precio — resueltos desde tu catálogo en el momento del envío.

Añadir productos manualmente

Rellena la cuadrícula tú mismo, ya sea introduciendo productos a mano o eligiendo artículos específicos de tu Catálogo de productos por ID. Puedes mezclar ambos en el mismo bloque.

Número de productos: establece cuántas tarjetas mostrar (1–24).
Añadir producto: añade una tarjeta y rellena su título, descripción, precio, imagen y enlace tú mismo.
Elegir del catálogo…: selecciona productos específicos de tu Catálogo de productos en lugar de escribirlos.
Actualizar desde el catálogo: extrae el último título, descripción, precio e imagen para los productos que elegiste del catálogo, en caso de que hayan cambiado desde que los añadiste. No afecta a los productos introducidos a mano.
Imágenes de productos: haz clic en una miniatura para reemplazar la imagen de ese producto.
Enlaces de productos: introduce o edita la URL de cada producto.

Configuración de fuente manual para el bloque de Productos con Añadir producto, Elegir del catálogo, Actualizar desde el catálogo, Imágenes de productos y Enlaces de productos

Extraer productos con una regla de catálogo

Extrae productos automáticamente por categoría y orden de clasificación, sin selección manual.

Categoría: limita a una categoría de catálogo específica, o Todas las categorías.
Ordenar: elige el orden en que se extraen los productos: Más nuevos primero, Precio: de menor a mayor, Precio: de mayor a menor o Título A-Z.
Número de productos: establece un límite de cuántas tarjetas mostrar (1–12).
Actualizar vista previa: recalcula la vista previa del lienzo con el catálogo en este momento.

Configuración de fuente de regla de catálogo para el bloque de Productos con Categoría, Ordenar, Número de productos y Actualizar vista previa

Mostrar artículos del carrito

Renderiza los artículos actuales del carrito abandonado de un destinatario.

Máximo de productos mostrados: establece un límite de cuántas tarjetas mostrar (1–12).
Previsualizar el carrito de un usuario: introduce un ID de usuario o correo electrónico y haz clic en Previsualizar carrito para ver cómo se renderiza el bloque para ese destinatario específico.

Configuración de fuente de carrito para el bloque de Productos con Máximo de productos mostrados y Previsualizar el carrito de un usuario

Obtener productos recomendados

Extrae productos clasificados por una estrategia integrada en lugar de elegirlos tú mismo o escribir una regla de catálogo.

Configuración del bloque de Productos con Fuente establecida en Recomendaciones, un selector de Estrategia establecido en Más vendidos (30 días), Categoría, Número de productos y Actualizar vista previa

Estrategia: elige cómo se clasifican los productos — Más vendidos (7 días), Más vendidos (30 días), Novedades, De vuelta en stock, Bajada de precio, Comprados juntos o Basado en lo que vieron. Seleccionar Recomendaciones reemplaza el control Ordenar de Regla de catálogo con este selector de Estrategia.

Selector de Estrategia expandido mostrando Más vendidos (7 días), Más vendidos (30 días), Novedades, De vuelta en stock, Bajada de precio, Comprados juntos y Basado en lo que vieron

Categoría: limita a una categoría de catálogo específica, o Todas las categorías.
Número de productos: establece un límite de cuántas tarjetas mostrar (1–12).
Actualizar vista previa: recalcula la vista previa del lienzo con el catálogo en este momento.

Estilizar la cuadrícula

Una vez que has elegido una fuente, estas configuraciones controlan cómo se ven la cuadrícula y sus tarjetas. Permanecen iguales sin importar qué fuente uses:

Columnas: elige 1, 2 o 3 tarjetas por fila. En móvil, las tarjetas siempre se apilan en una columna.
Espacio: actívalo para establecer el espacio entre tarjetas. Desactivado usa el valor predeterminado (16px).
Límite de descripción: el límite de caracteres al que se recorta el texto de la descripción, para que las tarjetas mantengan un tamaño consistente.
Plantilla de tarjeta: elige un diseño, luego establece el Fondo de la tarjeta, el Radio de esquina de la tarjeta y el Relleno del contenido para cada tarjeta.
Tamaño y ajuste: se muestra para cada diseño que tiene una imagen. Los mismos controles de Ancho, Altura, Recortar y Ajuste que el tamaño de imagen por diseño del bloque de Tarjeta, dimensionado en relación con el ancho de la tarjeta en lugar de todo el correo electrónico.

La configuración de Estilo del bloque a continuación estiliza el bloque en su conjunto, por separado de las tarjetas dentro de él:

Fondo e Imagen de fondo: establece un color de fondo o una imagen detrás de toda la cuadrícula. Con una imagen establecida, Ajuste elige cómo se sitúa en el bloque — Cubrir la recorta al bloque, Contener ajusta toda la imagen dentro de él — y Punto focal / Establecer posición la coloca. Outlook Desktop muestra solo el color de fondo e ignora la imagen, así que mantén un color legible detrás de ella.
Color del borde, Ancho del borde y Radio de esquina: añade un contorno y esquinas redondeadas alrededor de toda la cuadrícula. Activa Más opciones en Radio de esquina para establecer cada esquina por separado, o déjalo desactivado para aplicar el mismo radio a las cuatro. Gmail y Apple Mail lo renderizan; Outlook Desktop lo ignora y muestra esquinas cuadradas, al igual que lo hace con las imágenes.
Ocultar en móvil y Ocultar en escritorio: oculta todo el bloque en un dispositivo. Consulta Mostrar u ocultar contenido por dispositivo.

Noticias

Un bloque de Noticias muestra una cuadrícula de tarjetas de artículos. Cada tarjeta puede incluir una imagen, fecha, titular, resumen y un enlace de “Leer más”. La plantilla se repite para cada artículo, de la misma manera que lo hace para el bloque de Productos. Un nuevo bloque de Noticias comienza con 2 tarjetas de muestra.

En el panel de configuración, en Fuente, elige de dónde provienen los artículos:

Seleccionados: carga artículos de un feed RSS o Atom una vez, o selecciona artículos específicos a mano. Se copian en el correo electrónico y no vuelven a cambiar.
Feed en vivo: extrae artículos de un feed registrado para tu aplicación, resueltos de nuevo en el momento del envío para que cada destinatario reciba los más nuevos.

Seleccionar artículos de un feed

Haz clic en una tarjeta en el lienzo para activarla y editarla:

Cambia la fecha, el titular, el resumen, la imagen o el enlace por artículo para actualizar solo esa tarjeta.
Cambia el diseño de la plantilla, los colores, el relleno o los elementos que contiene para actualizar todas las tarjetas.

Los artículos se copian en el contenido del correo electrónico una vez que los cargas; no se vuelve a obtener nada en el momento del envío. Las imágenes de los artículos se copian en tu Almacén de medios y se convierten de WebP a JPEG si es necesario, ya que Outlook no puede renderizar WebP.

Pega una URL del feed RSS 2.0 o Atom, luego:

Cargar últimos artículos: reemplaza las tarjetas actuales con los artículos más recientes del feed, el mismo número de tarjetas que ya tienes (2 por defecto).
Seleccionar artículos…: abre un panel que lista hasta 12 de los últimos artículos del feed, con miniatura, titular, fecha, categoría y autor, y elige cuáles añadir. Los artículos seleccionados se añaden a las tarjetas existentes, hasta un total de 12; los artículos que ya están en el lienzo no se pueden seleccionar dos veces.

Panel de configuración de Noticias con Fuente establecida en Seleccionados, un campo de URL de feed y botones de Cargar últimos artículos y Seleccionar artículos

El panel te permite seleccionar artículos específicos a mano en lugar de tomar siempre los más nuevos.

Panel de Seleccionar artículos que lista artículos de feed con miniaturas, titulares, fechas y casillas de verificación para seleccionar

Imágenes de artículos: haz clic en una miniatura para reemplazar la imagen de ese artículo.
Enlaces de artículos: se muestra cuando la plantilla de la tarjeta tiene un enlace vinculado al artículo (el botón predeterminado “Leer más”). Lista cada artículo por titular para que puedas editar o anular su URL de destino, inicialmente extraída del feed.

Extraer artículos de un feed en vivo

Los artículos se obtienen cuando se envía el correo electrónico, por lo que cada destinatario recibe los más frescos. En lugar de seleccionar los artículos tú mismo, elige un feed y un límite:

Panel de configuración de Noticias con Fuente establecida en Feed en vivo, un selector de Feed registrado, filtro de Categoría, contador de Artículos y botón de Actualizar vista previa

Feed registrado: elige un feed ya registrado para tu aplicación, o Todos los feeds de la aplicación para extraer de todos ellos. Este panel solo elige un feed, no registra uno; si aún no existe ninguno, pide a Soporte o a tu equipo de cuenta que añadan uno para tu aplicación.
Filtro de categoría: un filtro de texto libre opcional que se compara con la categoría del artículo del feed (por defecto: cualquier categoría).
Artículos: cuántas tarjetas mostrar (1–12, 3 por defecto).
Actualizar vista previa: recalcula la vista previa del lienzo con el feed en este momento. Si el feed no devuelve artículos, Pushwoosh deja las tarjetas actuales sin cambios; si no se puede acceder al feed, Pushwoosh muestra un error en su lugar.

Estilizar la cuadrícula

Una vez que has elegido una fuente, estas configuraciones controlan cómo se ven la cuadrícula y sus tarjetas. Permanecen iguales sin importar qué fuente uses:

Columnas: elige 1, 2 o 3 tarjetas por fila. En móvil, las tarjetas siempre se apilan en una columna.
Espacio: actívalo para establecer el espacio entre tarjetas. Desactivado usa el valor predeterminado (16px).
Límite de resumen: el límite de caracteres al que se recorta el resumen del artículo, para que las tarjetas mantengan un tamaño consistente.
Plantilla de tarjeta: elige un diseño, luego establece el Fondo de la tarjeta, el Radio de esquina de la tarjeta y el Relleno del contenido para cada tarjeta. Para el diseño Izquierda o Derecha, activa Ajustar texto alrededor de la imagen para que el titular y el resumen fluyan alrededor de la imagen en lugar de mantenerlos en una columna fija. Tamaño y ajuste (Ancho, Altura, Recortar, Ajuste) funciona de la misma manera que el tamaño de imagen por diseño del bloque de Tarjeta, dimensionado en relación con el ancho de la tarjeta.

La configuración de Estilo del bloque a continuación estiliza el bloque en su conjunto, por separado de las tarjetas dentro de él:

Fondo e Imagen de fondo: establece un color de fondo o una imagen detrás de toda la cuadrícula. Con una imagen establecida, Ajuste elige cómo se sitúa en el bloque — Cubrir la recorta al bloque, Contener ajusta toda la imagen dentro de él — y Punto focal / Establecer posición la coloca. Outlook Desktop muestra solo el color de fondo e ignora la imagen, así que mantén un color legible detrás de ella.
Color del borde, Ancho del borde y Radio de esquina: añade un contorno y esquinas redondeadas alrededor de toda la cuadrícula. Activa Más opciones en Radio de esquina para establecer cada esquina por separado, o déjalo desactivado para aplicar el mismo radio a las cuatro. Gmail y Apple Mail lo renderizan; Outlook Desktop lo ignora y muestra esquinas cuadradas, al igual que lo hace con las imágenes.
Ocultar en móvil y Ocultar en escritorio: oculta todo el bloque en un dispositivo. Consulta Mostrar u ocultar contenido por dispositivo.

Guardar y reutilizar bloques

Guarda un bloque para reutilizarlo en este u otros correos electrónicos en lugar de reconstruirlo cada vez.

Haz clic en un bloque (su marco o fondo, no el texto o botón dentro de él) para seleccionarlo. Tarjeta, Columnas y Social son ejemplos de bloques que funcionan de esta manera. Para guardar varios bloques juntos, haz clic con la tecla Mayús en más bloques hermanos, en el lienzo o en el Panel de capas, para extender la selección a un rango contiguo. Guardar no se ofrece para un rango que incluye un bloque ya sincronizado o un marcador de posición de IA vacío.
Haz clic en el icono de marcador en la barra de herramientas del bloque y dale un nombre.

Icono de marcador en la barra de herramientas de un bloque de Tarjeta abriendo un diálogo para nombrar y guardar el bloque

Los bloques guardados aparecen en Bloques guardados en la parte inferior de la pestaña Bloques.

Sección de bloques guardados en la parte inferior de la pestaña Bloques con mosaicos de bloques guardados e iconos de eliminación

Arrastra un bloque guardado al lienzo, o haz clic en él para añadirlo al final del correo electrónico.
Haz clic en la × en el mosaico de un bloque guardado para eliminarlo.

Mantener copias sincronizadas

Cuando guardes un bloque, activa Mantener copias sincronizadas para vincular cada copia insertada a la misma fuente. Edita la fuente una vez, y el cambio se aplica en todas partes donde se use ese bloque, incluidos los correos electrónicos ya programados para enviar.

Guardar un rango de bloques funciona de la misma manera. Pushwoosh envuelve los bloques seleccionados en un Grupo, un bloque contenedor que aparece como su propia fila en el Panel de capas, para que la sincronización tenga una única raíz, luego vincula cada copia insertada a ese grupo. Edita cualquier bloque dentro de él y aplica el cambio para actualizar todo el grupo en todas partes donde se use.

Diálogo de guardado para un rango de 3 bloques con Mantener copias sincronizadas activado

Una copia sincronizada está bloqueada en el lienzo. No puedes editarla directamente. Selecciona la copia para abrir su configuración:

Editar bloque sincronizado: desbloquea esta copia para que puedas cambiarla. Aparece un banner en la parte superior. Haz clic en Aplicar a todos para guardar tus cambios en la fuente y en todas las demás copias, o en Cancelar para descartarlos. Solo puedes desbloquear un bloque sincronizado a la vez.
Actualizar desde la fuente: reemplaza esta copia con la última versión de la fuente.
Desvincular de la fuente: desvincula esta copia de la fuente para que puedas editarla por tu cuenta.

Mientras un bloque sincronizado está desbloqueado para su edición, el resto del correo electrónico está bloqueado para evitar ediciones accidentales:

En el lienzo y en el Panel de capas, todo lo que está fuera del bloque está atenuado y no muestra ningún control de arrastre o menú de tres puntos — hacer clic, arrastrar, duplicar o eliminar esas filas no tiene efecto.
Al seleccionar cualquier cosa fuera del bloque, se muestra Termina de editar el bloque sincronizado para editar el resto del correo electrónico en el panel de configuración en lugar de los campos de ese elemento.
En el Panel de capas, el bloque que se está editando está etiquetado como Bloque sincronizado (editando) con un icono de edición.
El botón Guardar está deshabilitado, con una descripción emergente que explica que guardar ahora almacenaría el correo electrónico con el contenido antiguo del bloque.

Aplica o cancela tus cambios para desbloquear el resto del correo electrónico de nuevo.

Añadir enlaces

Usa el diálogo Insertar/Editar enlace para establecer qué sucede cuando un destinatario hace clic en un botón o en texto seleccionado. Elige un Tipo de acción, luego rellena los campos para esa acción.

Abrir sitio web

Abre un enlace cuando el destinatario hace clic. Introduce la dirección en URL.

Enlace para gestionar preferencias

Añade un enlace al centro de preferencias de suscripción donde los destinatarios pueden elegir qué categorías de correo electrónico reciben. El enlace se inserta automáticamente.

Enlace para cancelar la suscripción

Permite a los destinatarios optar por no participar de acuerdo con las regulaciones y sus preferencias.

También puedes añadir un enlace para cancelar la suscripción en un bloque HTML:

<a href=%%PW_EMAIL_UNSUBSCRIBE%%>Unsubscribe</a>

El marcador de posición %%PW_EMAIL_UNSUBSCRIBE%% se reemplaza con la URL de cancelación de suscripción de Pushwoosh cuando se envía el correo electrónico.

Qué sucede cuando el destinatario hace clic en el enlace para cancelar la suscripción

Si el centro de preferencias de suscripción está habilitado

El destinatario cancela la suscripción solo de la categoría asignada a ese correo electrónico (p. ej., Newsletter). El nombre de la categoría se elimina de su etiqueta Categorías de correo electrónico suscritas.

Aparece una pantalla de confirmación con las opciones Volver a suscribirse y Gestionar preferencias. Más información.

Si el centro de preferencias de suscripción no está habilitado

El destinatario opta por no recibir todos los correos electrónicos de marketing y la etiqueta Correos electrónicos no suscritos se establece en true. Los correos electrónicos transaccionales no se ven afectados y seguirán entregándose. Más información sobre los tipos de mensajes.

Los clics se cuentan en la tasa de cancelación de suscripción en el Historial de mensajes.

Enlace a la versión web

Da a los destinatarios acceso a una versión web del correo electrónico, útil si tienen problemas para verlo en su bandeja de entrada.

No rastrear estadísticas

Abre un enlace cuando el destinatario hace clic, sin contar el clic para las estadísticas de clics de tu correo electrónico. Introduce la dirección en URL.

Enlace de confirmación de formulario de suscripción

Inserta un enlace de confirmación para el envío de un formulario de suscripción (por ejemplo, para confirmar una doble suscripción). Más información sobre la doble suscripción.