Cómo personalizar emails transaccionales en PrestaShop 8 de forma profesional

Cómo personalizar emails transaccionales en PrestaShop 8 de forma profesional
Solucionex
16
Jun 25

Los emails transaccionales son una parte crítica de la experiencia de compra: confirman pedidos, notifican envíos, gestionan contraseñas... y son una gran oportunidad para reforzar tu marca, generar confianza y añadir valor al cliente.

En este artículo te enseñamos a personalizar profesionalmente los emails de PrestaShop 8, manteniendo compatibilidad con futuras actualizaciones.


📬 ¿Qué son los emails transaccionales?

Son los correos que PrestaShop envía automáticamente en eventos clave:

  • Confirmación de pedido (order_conf)

  • Confirmación de cuenta (account)

  • Cambio de contraseña (password_query)

  • Envío (shipped)

  • Estado del pedido (order_changed)

  • Etc.

Todos están en /mails/ y pueden tener versiones por idioma (/es/, /en/...).


🛠️ ¿Dónde están los archivos?

PrestaShop 8 usa tanto archivos .tpl antiguos como el nuevo sistema Twig para emails más modernos.

Plantillas antiguas:

/mails/es/order_conf.html
/mails/es/order_conf.txt

Plantillas modernas:

/themes/tu-tema/mails/

🧩 Opción 1: Personalizar plantillas HTML y TXT directamente

Si usas el sistema clásico:

   Ve a /mails/es/.

   Copia order_conf.html y order_conf.txt.

   Modifica el HTML: añade logotipo, colores de marca, texto legal, etc.

Ejemplo de código personalizado en order_conf.html:

<p>Hola {$firstname},</p>
<p>Gracias por tu pedido #{$order_name}. Aquí tienes el resumen:</p>
<table>
  <tr><td>Producto</td><td>Precio</td></tr>
  {foreach from=$products item=product}
    <tr><td>{$product.name}</td><td>{$product.price}</td></tr>
  {/foreach}
</table>
<p><strong>💡 Consejo:</strong> Guarda este email como comprobante.</p>

✅ Consejo: Puedes usar {if} y {$variables} como en Smarty.

🧩 Opción 2: Usar plantillas de email desde el tema (Twig en PS 8)

PrestaShop 8 permite sobrescribir emails con plantillas .twig directamente desde el tema.

📁 Ruta personalizada:

/themes/classic/mails/es/order_conf.html.twig

Esto tiene prioridad sobre los archivos del sistema. Puedes adaptar cualquier plantilla HTML aquí con tu branding y estructura deseada.


🧪 Cómo añadir variables personalizadas a los emails

Si quieres mostrar datos no incluidos por defecto (como un campo personalizado o un comentario), necesitas usar hooks o sobrescribir la clase Mail.

📄 Ejemplo para order_conf:

En tu módulo:

public function hookActionEmailSendBefore($params)
{
    if ($params['template'] === 'order_conf') {
        $order = new Order((int) $params['template_vars']['{order_id}']);
        $params['template_vars']['{extra_info}'] = 'Este pedido se procesará en 24h.';
    }
}
Y en el email:
<p>{$extra_info}</p>

🧠 Puedes incluir info del módulo, notas del cliente, descuentos especiales...


🎨 Añadir diseño profesional

Puedes usar estilos inline CSS compatibles con Gmail y Outlook:

<p style="color: #444; font-family: Arial; font-size: 14px;">
  ¡Gracias por comprar en <strong>TuTienda.com</strong>!
</p>

Para botones:

<a href="{$shop_url}" style="background: #007bff; color: #fff; padding: 10px 20px; text-decoration: none; border-radius: 5px;">
  Visita nuestra tienda
</a>

🧼 Consejo: No edites directamente /mails/

Si actualizas PrestaShop, podrías perder cambios. Lo ideal es:

  • Usar sobrescrituras en /themes/tu-tema/mails/

  • O copiar las plantillas en un módulo si vas a distribuirlo o mantenerlo centralizado.


🧪 Prueba tus emails antes de enviar

Usa módulos como "Mail Alerts" o la función integrada de PrestaShop 8 para enviar pruebas desde:

Parámetros Avanzados → Correo → Enviar un correo de prueba

También puedes usar herramientas como Mailtrap.io o Mailhog para capturar correos localmente durante desarrollo.


✅ Conclusión

Con un poco de trabajo puedes transformar los correos de PrestaShop en una herramienta de marketing y confianza. Personaliza colores, tipografías, mensajes y añade valor real para tus clientes.