Cómo enviar un correo HTML en Power Automate con un diseño de Mailvex

Una notificación interna debe presentar la información con claridad y seguir siendo fácil de actualizar. Puedes preparar el diseño en Mailvex y utilizar el HTML en Power Automate, manteniendo el envío en tu cuenta Microsoft 365. Así conservas el proyecto visual para los cambios posteriores.

Comienza con un flujo manual que envía texto estático a tu propia dirección. Después de revisar el correo recibido, añade el paso opcional de personalización del nombre. Las instrucciones utilizan funciones documentadas por Microsoft; esta guía no describe una ejecución real de envío realizada por nuestro equipo.

1. Revisa las cuentas y el entorno

Necesitas acceso a Power Automate, permiso para crear el flujo en el entorno elegido y una cuenta laboral o educativa con un buzón compatible con el conector Office 365 Outlook. En algunas interfaces, el grupo aparece como Microsoft 365 Outlook. Outlook.com es un conector independiente para cuentas personales; no intercambies ambos sin revisar el escenario.

Office 365 Outlook está clasificado como Standard. Eso no hace obligatoria una licencia Premium para esta ruta: existen condiciones elegibles para flujos personales, no compartidos, con conectores estándar. La licencia del buzón, el acceso al entorno y los permisos de la organización siguen siendo necesarios.

En Mailvex, utiliza una cuenta con el correo confirmado y cuota de exportación disponible. El plan puede añadir la firma de Mailvex al resultado. Prepara una imagen propia, una dirección real para el botón y tu propio buzón para recibir la prueba. La transferencia es manual, mediante el HTML exportado de Mailvex.

2. Prepara una notificación estática en Mailvex

Selecciona Usar plantilla en el catálogo o Usar esta plantilla en sus detalles. Prefiere una columna sencilla con logotipo, título, texto y un botón. Un ejemplo reutilizable es el título “Actualización disponible”, seguido de “Consulta la información publicada en nuestra página de referencia” y el botón “Ver información”. Adapta el contenido a tu caso y utiliza una URL real tuya.

• Sustituye imágenes, título, texto y pie por el contenido de prueba. Comprueba también el idioma y el preheader.
• Elimina variables sin valor real, como {{first_name}}, y conserva los enlaces de servicio necesarios con destinos válidos.
• En los bloques con Condición de visibilidad (ESP), desactiva Mostrar según condición si la regla no forma parte del ejemplo. Simular la vista previa no elimina la condición exportada.
• Comprueba el destino final del botón, incluidos sus parámetros, y la lectura en la vista previa estrecha.

Las imágenes deben abrirse sin iniciar sesión en el editor. El modo Mailvex conserva URLs alojadas; las imágenes externas pueden permanecer en otros hosts. El modo Propio requiere archivos en las direcciones configuradas: seleccionar una base no los sube. El HTML copiado no adjunta automáticamente las imágenes al correo de Outlook.

3. Copia el HTML completo una vez

Abre Exportar HTML. En Formato de variables (ESP), mantén mailvex para este ejemplo estático y selecciona Copiar HTML. Ese perfil no conecta una cuenta Microsoft ni completa datos de personas. Los valores de demostración de la vista previa no deben tratarse como datos presentes en el código exportado.

Conserva el documento completo, con su estructura y estilos. No separes el contenido de body y el CSS. Si quieres una copia local, guarda el código ya copiado en un archivo .html. Descargar HTML es una alternativa, no otro paso obligatorio; copiar y descargar son acciones de exportación diferentes.

Guarda también el proyecto visual original. Será la fuente de los próximos cambios. El archivo ayuda a comparar versiones, pero no sustituye el proyecto editable ni demuestra cómo se verá el mensaje después de pasar por Power Automate y el cliente de correo.

4. Crea el flujo manual y configura el envío

En Power Automate, abre Create > Instant cloud flow. Escribe un Flow name reconocible, elige Manually trigger a flow y selecciona Create. No añadas campos al disparador en esta primera prueba. Agrega Send an email (V2) de Office 365 Outlook y autoriza la conexión permitida por tu organización.

Dentro del editor de Body, selecciona </>, elimina el contenido anterior y pega el HTML completo. Ese es el control editable del cuerpo. La pestaña Code view de la acción muestra el JSON subyacente en modo de lectura y no es donde debes pegar el correo. La acción V2 ya recibe HTML; no es necesario activar un campo IsHtml separado.

5. Ejecuta una vez y revisa el correo recibido

Comprueba el destinatario y guarda con Save. Utiliza Test > Manually > Test, después Run flow y Done. Esa ejecución envía un mensaje real. Abre el historial de ejecuciones y los resultados de la acción; luego busca el correo en tu propio buzón, incluida la carpeta de spam.

• Comprueba remitente, asunto, texto, acentos, preheader y pie.
• Abre el botón y verifica su destino final. No utilices solamente su apariencia como validación.
• Observa imágenes, espacios, ancho y tamaño del texto en computadora y celular.
• Si el equipo utiliza diferentes versiones de Outlook, revisa las relevantes. Navegador, aplicación móvil y escritorio pueden mostrar diferencias.

Una acción completada correctamente no demuestra llegada a la bandeja de entrada ni precisión visual. Tampoco hay garantía de conservar íntegramente el CSS de head, comentarios MSO o VML. Si necesitas repetir, comprueba primero la ejecución anterior: cada nueva prueba puede enviar otro mensaje.

6. Opcional: personaliza solo el nombre con cuatro Compose

Añade esta extensión después de aprobar la versión estática. En Mailvex, coloca PA_NAME_SLOT exactamente una vez en texto visible, por ejemplo “¡Hola, PA_NAME_SLOT!”. No lo pongas en el asunto, preheader, enlace, atributo, CSS ni imagen. El botón mantiene su URL fija real.

En el encabezado, abre Enlace «Ver en el navegador» y desactiva Mostrar enlace. La versión alojada es una copia separada y no recibe las sustituciones posteriores de Power Automate. Exporta nuevamente cuando tengas cuota y comprueba que el código incluya una sola aparición intacta de PA_NAME_SLOT.

Entre el disparador manual y Send an email (V2), utiliza + y Add an action, busca Compose y selecciona la acción de Data Operation. Añade cuatro de estas acciones en secuencia. Haz clic en el título para cambiar el nombre de cada una inmediatamente, antes de las expresiones dependientes. Utiliza los nombres siguientes para que coincidan las referencias.

RecipientName_raw: el nombre como texto normal

En la primera Compose, define el nombre RecipientName_raw. En Inputs, escribe Ana & Bruno como texto normal. No utilices fx ni escribas el nombre ya codificado como HTML. Ese valor fijo permite comprobar la sustitución sin conectar datos de producción.

RecipientName_html: trata únicamente el texto del nombre

En la segunda Compose, utiliza RecipientName_html. Abre fx en Inputs, introduce la expresión siguiente y selecciona Add. No añadas @ ni @{...} y conserva las comillas simples ASCII.

replace( replace( replace( string( outputs('RecipientName_raw') ), '&', '&amp;' ), '<', '&lt;' ), '>', '&gt;' )

El orden trata primero el carácter &, después los signos < y >. Para la entrada fija, el resultado intermedio esperado es Ana &amp; Bruno. El tratamiento se limita a texto HTML normal: no valida URLs ni sirve para insertar valores en atributos. Nunca apliques esta expresión al documento HTML completo.

Email_html: el documento revisado

En la tercera Compose, utiliza Email_html y pega el HTML completo de la nueva exportación en Inputs normal, sin comillas adicionales ni fx. Ese contenido debe incluir el marcador y conservar la estructura del correo. El proyecto visual permanece guardado en Mailvex.

Email_ready: sustituye el marcador

En la cuarta Compose, utiliza Email_ready. En fx, introduce la expresión y confirma con Add. Conserva la escritura exacta de los nombres de las acciones y del marcador; no adivines referencias si tu flujo utiliza nombres diferentes.

replace( outputs('Email_html'), 'PA_NAME_SLOT', outputs('RecipientName_html') )

En Body de la acción de envío, elimina todo el contenido anterior, incluidos posibles párrafos o envoltorios del código fuente. Inserta únicamente el contenido dinámico Outputs de Email_ready. Otra opción es utilizar fx en ese campo y añadir esta expresión:

outputs('Email_ready')

No pegues la palabra Outputs ni la fórmula como texto normal. Mantén To fijo en tu dirección. Guarda y repite la prueba manual: en el resultado de Email_ready, el marcador debe haber desaparecido; en el correo mostrado, el saludo debe decir Ana & Bruno. Son los resultados esperados de la composición, no el relato de una ejecución nuestra.

Problemas frecuentes y qué revisar

Cómo mantener la notificación después de la primera prueba

Edita el proyecto original en Mailvex y exporta la nueva versión. En el flujo estático, actualiza Body mediante </>. En el personalizado, actualiza Email_html y conserva Body apuntando a Email_ready. Revisa otra vez el marcador único y el enlace de visualización en el navegador desactivado.

Registra qué versión del proyecto y del flujo aprobaste. Un cambio en Mailvex no actualiza automáticamente el HTML guardado en Power Automate. Repite la revisión del mensaje recibido después de cambios importantes; comprueba la cuota antes de exportar nuevas correcciones.

Preguntas frecuentes

¿Puedo utilizar un nombre procedente de otro disparador?

Después de validar el ejemplo, mapea el campo real de nombre como texto simple en RecipientName_raw. Comprueba la estructura de los datos recibidos y selecciona el campo correspondiente, sin reutilizar una ruta de otro flujo. El resto del tratamiento puede seguir separado del HTML.

¿Puedo añadir tablas dinámicas o varios destinatarios?

Eso amplía el alcance. Las tablas requieren decisiones propias de diseño y tratamiento de cada valor; varios destinatarios requieren revisar entradas, límites y duplicados. Este flujo manual permite validar una notificación individual, no es un tutorial de campañas masivas.

¿Necesito utilizar un perfil Outlook al exportar?

Para la muestra estática, utiliza mailvex. El perfil define el formato de variables, no la conexión de envío. La cuenta Microsoft se autoriza en Power Automate, y las acciones Compose realizan la personalización opcional.