Gestion des Templates de Mails
Cette page documente le travail de refonte des templates d’emails pour le site signaletique-inox.fr. Ces modèles couvrent une variété de situations, offrant une communication claire, professionnelle et cohérente avec l'identité visuelle de la boutique.
Objectifs de la refonte
Amélioration de la clarté :
Revoir la structure et le contenu pour garantir une compréhension rapide par les clients.
Utilisation d’un ton formel mais chaleureux.
Cohérence visuelle :
Uniformisation des couleurs, polices et mise en page pour refléter l’identité graphique du site.
Ajout du logo et d'éléments visuels de la marque.
Optimisation responsive :
Garantir une lecture agréable sur tous les appareils, y compris les smartphones et tablettes.
Adaptation à différentes situations :
Création ou mise à jour des templates pour des scénarios variés, assurant que chaque étape du parcours client est couverte.
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body
style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation"
style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">
Bonjour {firstname} {lastname},</p>
<p style="font-size: 16px; color: #777; margin-bottom: 20px; text-align: center;">Merci d'avoir effectué
vos achats sur {shop_name}!</p>
<br>
<strong style="color: #283d4e;">COMMANDE {order_name} - EN ATTENTE DE PAIEMENT </strong>
<p>Nous avons bien enregistré votre commande ayant pour référence <strong style="color: #283d4e;">{order_name}</strong>. Celle-ci vous sera <strong style="color: #283d4e;">envoyée dès réception de votre paiement</strong>.</p>
<br>
<strong style="color: #283d4e;">POUR RAPPEL, VOUS AVEZ SÉLECTIONNÉ LE MODE DE PAIEMENT PAR VIREMENT BANCAIRE.</strong>
<p>Voici les informations dont vous avez besoin pour effectuer ce virement :</p>
<p><strong style="color: #283d4e;">Montant :</strong> {total_paid}</p>
<p><strong style="color: #283d4e;">Titulaire du compte :</strong> {bankwire_owner}</p>
<p><strong style="color: #283d4e;">Détails du compte :</strong> {bankwire_details}</p>
<p><strong style="color: #283d4e;">Adresse de la banque :</strong> {bankwire_address}</p>
<br>
<!-- Section d'assistance -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; text-align: center; margin-top: 20px;">
Besoin d'aide ?</p>
<p style="text-align: center;">Vous pouvez accéder à tout moment au suivi de votre commande et
télécharger votre facture dans <a style="color: #337ff1;" href="{history_url}">"Historique des
commandes"</a> de la rubrique <a style="color: #337ff1;" href="{my_account_url}">"Mon
compte"</a> sur notre site.</p>
<p style="text-align: center;">Si vous avez un compte invité, vous pouvez suivre votre commande dans la
section <a style="color: #337ff1;" href="{guest_tracking_url}?id_order={order_name}">"Suivi
invité"</a> de notre site.</p>
<p style="text-align: center;">N'hésitez pas à nous suivre sur les réseaux sociaux</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body
style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation"
style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">
Bonjour {firstname} {lastname},</p>
<p style="font-size: 16px; color: #777; margin-bottom: 20px; text-align: center;">Merci d'avoir effectué
vos achats sur {shop_name}!</p>
<br>
<strong style="color: #283d4e;">COMMANDE {order_name} - EN ATTENTE DE PAIEMENT PAR CHÈQUE </strong>
<p>Nous avons bien enregistré votre commande ayant pour référence <strong style="color: #283d4e;">{order_name}</strong>. Celle-ci vous sera <strong style="color: #283d4e;">envoyée dès réception de votre paiement</strong>.</p>
<br>
<strong style="color: #283d4e;">VOUS AVEZ CHOISI DE PAYER PAR CHÈQUE</strong>
<p>Voici les informations dont vous avez besoin pour effectuer le paiement :</p>
<p><strong style="color: #283d4e;">Montant :</strong> {total_paid}</p>
<p><strong style="color: #283d4e;">À l'ordre de :</strong> {cheque_name}</p>
<p><strong style="color: #283d4e;">Veuillez envoyer votre chèque à l'adresse suivante :</strong> {cheque_address}</p>
<br>
<!-- Section d'assistance -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; text-align: center; margin-top: 20px;">
Besoin d'aide ?</p>
<p style="text-align: center;">Vous pouvez accéder à tout moment au suivi de votre commande et
télécharger votre facture dans <a style="color: #337ff1;" href="{history_url}">"Historique des
commandes"</a> de la rubrique <a style="color: #337ff1;" href="{my_account_url}">"Mon
compte"</a> sur notre site.</p>
<!-- <p style="text-align: center;">Si vous avez un compte invité, vous pouvez suivre votre commande dans la
section <a style="color: #337ff1;" href="{guest_tracking_url}?id_order={order_name}">"Suivi
invité"</a> de notre site.</p> -->
<p style="text-align: center;">N'hésitez pas à nous suivre sur les réseaux sociaux</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation" style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%; overflow: hidden;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">BRAVO !</p>
<p style="font-size: 16px; color: #777; margin-bottom: 20px;">Une nouvelle commande a été passée sur votre boutique {shop_name} par {firstname} {lastname} ({email}).</p>
<div style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Détails de la commande</div>
<p><strong>Commande :</strong> {order_name} passée le {date}</p>
<p><strong>Paiement :</strong> {payment}</p>
<p><strong>Délai de livraison estimé :</strong> {estimate_delivery}</p>
<!-- Table des produits -->
<div style="overflow-x: auto;">
<table style="width: 100%; border-collapse: collapse; font-size: 14px;">
<thead>
<tr>
<th style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">Image</th>
<th style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">Produit</th>
<th style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">Prix unitaire</th>
<th style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">Quantité</th>
<th style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">Prix total</th>
</tr>
</thead>
<tbody>
<tr>
{items}
</tr>
</tbody>
</table>
</div>
<!-- Résumé des montants -->
<div style="margin-top: 20px;">
<table style="width: 100%; border-collapse: collapse; font-size: 15px;">
<tbody>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Sous-total des produits :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_products}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Réductions :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_discounts}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Frais de livraison :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_shipping}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Emballage cadeau :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_wrapping}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">TVA :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_tax_paid}</span>
</td>
</tr>
<tr style="background-color: #f1f1f1;">
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Total payé :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_paid}</span>
</td>
</tr>
</tbody>
</table>
</div>
<!-- Adresse et transporteur -->
<div style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Transporteur</div>
<p>{carrier}</p>
<div style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Adresse de livraison</div>
<p>{delivery_block_html}</p>
<div style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Adresse de facturation</div>
<p>{invoice_block_html}</p>
<!-- Message client -->
<div style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Message du client</div>
<p>{message}</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body
style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation"
style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">
Bonjour {firstname} {lastname},</p>
<p style="font-size: 16px; color: #777; margin-bottom: 20px; text-align: center;">Merci d'avoir effectué
vos achats sur {shop_name}!</p>
<!-- Détails de la commande -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Détails de la
commande</p>
<p><strong>Commande :</strong> {order_name} passée le {date}</p>
<p><strong>Paiement :</strong> {payment}</p>
<p><strong>Délai de livraison estimé :</strong> {estimate_delivery}</p>
<!-- Table des produits -->
<div style="overflow-x: auto; margin-top: 20px;">
<table style="width: 100%; border-collapse: collapse; font-size: 14px;">
<thead>
<tr>
<th style="width: 0px; padding: 0; border: none;"></th>
<th
style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">
Produit</th>
<th
style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">
Prix unitaire</th>
<th
style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">
Quantité</th>
<th
style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">
Prix total</th>
</tr>
</thead>
<tbody>
<!-- Affiche les produits dans une cellule complète pour éviter la mise en colonne automatique -->
<tr>
<td>
{products}
</td>
</tr>
<!-- Affiche les remises ou réductions sous les produits dans une seule cellule couvrant toute la largeur -->
<tr>
<td>
{discounts}
</td>
</tr>
</tbody>
</table>
</div>
<!-- Résumé des montants -->
<div style="margin-top: 20px;">
<table style="width: 100%; border-collapse: collapse; font-size: 15px;">
<tbody>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Produits :</span>
<span
style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_products}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Réductions :</span>
<span
style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_discounts}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Paquet cadeau :</span>
<span
style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_wrapping}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Frais de livraison :</span>
<span
style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_shipping}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;"> TVA totale :</span>
<span
style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_tax_paid}</span>
</td>
</tr>
<tr style="background-color: #f1f1f1;">
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #283d4e; font-weight: bold; font-size: 16px;">Total payé
:</span>
<span
style="color: #283d4e; font-weight: bold; font-size: 16px; margin-left: 5px;">{total_paid}</span>
</td>
</tr>
</tbody>
</table>
</div>
<!-- Section d'assistance -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; text-align: center; margin-top: 20px;">
Besoin d'aide ?</p>
<p style="text-align: center;">Vous pouvez accéder à tout moment au suivi de votre commande et
télécharger votre facture dans <a style="color: #337ff1;" href="{history_url}">"Historique des
commandes"</a> de la rubrique <a style="color: #337ff1;" href="{my_account_url}">"Mon
compte"</a> sur notre site.</p>
<p style="text-align: center;">Si vous avez un compte invité, vous pouvez suivre votre commande dans la
section <a style="color: #337ff1;" href="{guest_tracking_url}?id_order={order_name}">"Suivi
invité"</a> de notre site.</p>
<p style="text-align: center;">N'hésitez pas à nous suivre sur les réseaux sociaux</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation" style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%; overflow: hidden;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">BRAVO !</p>
<p style="font-size: 16px; color: #777; margin-bottom: 20px;">Une nouvelle commande a été passée sur votre boutique {shop_name} par {firstname} {lastname} ({email}).</p>
<div style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Détails de la commande</div>
<p><strong>Commande :</strong> {order_name} passée le {date}</p>
<p><strong>Paiement :</strong> {payment}</p>
<p><strong>Délai de livraison estimé :</strong> {estimate_delivery}</p>
<!-- Table des produits -->
<div style="overflow-x: auto;">
<table style="width: 100%; border-collapse: collapse; font-size: 14px;">
<thead>
<tr>
<th style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">Référence</th>
<th style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">Produit</th>
<th style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">Prix unitaire</th>
<th style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">Quantité</th>
<th style="padding: 12px; border: 1px solid #e0e0e0; text-align: center; background-color: #283d4e; color: #ffffff; font-weight: bold;">Prix total</th>
</tr>
</thead>
<tbody>
<tr>
{items}
</tr>
</tbody>
</table>
</div>
<!-- Résumé des montants -->
<div style="margin-top: 20px;">
<table style="width: 100%; border-collapse: collapse; font-size: 15px;">
<tbody>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Sous-total des produits :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_products}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Réductions :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_discounts}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Frais de livraison :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_shipping}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Emballage cadeau :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_wrapping}</span>
</td>
</tr>
<tr>
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">TVA :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_tax_paid}</span>
</td>
</tr>
<tr style="background-color: #f1f1f1;">
<td style="padding: 10px; border-top: 1px solid #e0e0e0; text-align: right;">
<span style="color: #333; font-weight: bold;">Total payé :</span>
<span style="color: #283d4e; font-weight: bold; font-size: 18px; margin-left: 5px;">{total_paid}</span>
</td>
</tr>
</tbody>
</table>
</div>
<!-- Adresse et transporteur -->
<div style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Transporteur</div>
<p>{carrier}</p>
<div style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Adresse de livraison</div>
<p>{delivery_block_html}</p>
<div style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Adresse de facturation</div>
<p>{invoice_block_html}</p>
<!-- Message client -->
<div style="font-size: 18px; color: #283d4e; font-weight: bold; margin: 25px 0 10px;">Message du client</div>
<p>{message}</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body
style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation"
style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">
Bonjour {firstname} {lastname},</p>
<p style="font-size: 16px; color: #777; margin-bottom: 20px; text-align: center;">Merci d'avoir effectué
vos achats sur {shop_name}!</p>
<br>
<strong style="color: #283d4e;">COMMANDE {order_name} - PAIEMENT ACCEPTÉ </strong>
<p>Le paiement pour votre commande ayant pour référence <strong style="color: #283d4e;">{order_name}</strong> a été accepté.</p>
<p>L'édition des factures est désormais dématérialisée. Vous trouverez votre document en pièce jointe.</p>
<br>
<!-- Section d'assistance -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; text-align: center; margin-top: 20px;">
Besoin d'aide ?</p>
<p style="text-align: center;">Vous pouvez accéder à tout moment au suivi de votre commande et
télécharger votre facture dans <a style="color: #337ff1;" href="{history_url}">"Historique des
commandes"</a> de la rubrique <a style="color: #337ff1;" href="{my_account_url}">"Mon
compte"</a> sur notre site.</p>
<p style="text-align: center;">Si vous avez un compte invité, vous pouvez suivre votre commande dans la
section <a style="color: #337ff1;" href="{guest_tracking_url}?id_order={order_name}">"Suivi
invité"</a> de notre site.</p>
<p style="text-align: center;">N'hésitez pas à nous suivre sur les réseaux sociaux</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body
style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation"
style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">
Bonjour {firstname} {lastname},</p>
<br>
<strong style="color: #283d4e;">COMMANDE {order_name} - ERREUR DE PAIEMENT </strong>
<p>Un problème a été constaté pour le paiement de votre commande sur <strong style="color: #283d4e;">{shop_name}</strong> ayant pour référence <strong style="color: #283d4e;">{order_name}</strong>. Veuillez nous contacter le plus rapidement possible.</p>
<strong style="color: #283d4e;">Nous ne pouvons malheureusement pas expédier votre commande tant que nous n'avons pas reçu votre paiement.</strong>
<br>
<!-- Section d'assistance -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; text-align: center; margin-top: 20px;">
Besoin d'aide ?</p>
<p style="text-align: center;">Vous pouvez accéder à tout moment au suivi de votre commande et
télécharger votre facture dans <a style="color: #337ff1;" href="{history_url}">"Historique des
commandes"</a> de la rubrique <a style="color: #337ff1;" href="{my_account_url}">"Mon
compte"</a> sur notre site.</p>
<p style="text-align: center;">Si vous avez un compte invité, vous pouvez suivre votre commande dans la
section <a style="color: #337ff1;" href="{guest_tracking_url}?id_order={order_name}">"Suivi
invité"</a> de notre site.</p>
<p style="text-align: center;">N'hésitez pas à nous suivre sur les réseaux sociaux</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body
style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation"
style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">
Bonjour {firstname} {lastname},</p>
<p style="font-size: 16px; color: #777; margin-bottom: 20px; text-align: center;">Merci d'avoir effectué
vos achats sur {shop_name}!</p>
<br>
<strong style="color: #283d4e;">COMMANDE {order_name} - PAIEMENT ACCEPTÉ </strong>
<p>Le paiement pour votre commande ayant pour référence <strong style="color: #283d4e;">{order_name}</strong> a été accepté.</p>
<br>
<!-- Section d'assistance -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; text-align: center; margin-top: 20px;">
Besoin d'aide ?</p>
<p style="text-align: center;">Vous pouvez accéder à tout moment au suivi de votre commande et
télécharger votre facture dans <a style="color: #337ff1;" href="{history_url}">"Historique des
commandes"</a> de la rubrique <a style="color: #337ff1;" href="{my_account_url}">"Mon
compte"</a> sur notre site.</p>
<p style="text-align: center;">Si vous avez un compte invité, vous pouvez suivre votre commande dans la
section <a style="color: #337ff1;" href="{guest_tracking_url}?id_order={order_name}">"Suivi
invité"</a> de notre site.</p>
<p style="text-align: center;">N'hésitez pas à nous suivre sur les réseaux sociaux</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body
style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation"
style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">
Bonjour {firstname} {lastname},</p>
<p style="font-size: 16px; color: #777; margin-bottom: 20px; text-align: center;">Commande <strong style="color: #283d4e;">{order_name}</strong> - En cours de Préparation / Fabrication</p>
<br>
<p>Votre commande sur <strong><a href="{shop_url}" style="color: #283d4e; text-decoration: none;">{shop_name}</a></strong> ayant pour référence <strong style="color: #283d4e;">{order_name}</strong> a été transmise au responsable d'atelier et est en cours de préparation / fabrication.</p>
<p>Le délai de votre commande est estimé au <strong style="color: #283d4e;">{date_livraison}</strong>.</p>
<br>
<!-- Section d'assistance -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; text-align: center; margin-top: 20px;">
Besoin d'aide ?</p>
<p style="text-align: center;">Vous pouvez accéder à tout moment au suivi de votre commande et
télécharger votre facture dans <a style="color: #337ff1;" href="{history_url}">"Historique des
commandes"</a> de la rubrique <a style="color: #337ff1;" href="{my_account_url}">"Mon
compte"</a> sur notre site.</p>
<p style="text-align: center;">Si vous avez un compte invité, vous pouvez suivre votre commande dans la
section <a style="color: #337ff1;" href="{guest_tracking_url}?id_order={order_name}">"Suivi
invité"</a> de notre site.</p>
<p style="text-align: center;">N'hésitez pas à nous suivre sur les réseaux sociaux</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body
style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation"
style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">
Bonjour {firstname} {lastname},</p>
<br>
<strong style="color: #283d4e;">COMMANDE {order_name} - REMBOURSEMENT EFFECTUÉ </strong>
<p>Nous avons procédé au remboursement de votre commande sur <strong style="color: #283d4e;">{shop_name}</strong> portant la référence <strong style="color: #283d4e;">{order_name}</strong>.</p>
<br>
<!-- Section d'assistance -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; text-align: center; margin-top: 20px;">
Besoin d'aide ?</p>
<p style="text-align: center;">Vous pouvez accéder à tout moment au suivi de votre commande et
télécharger votre facture dans <a style="color: #337ff1;" href="{history_url}">"Historique des
commandes"</a> de la rubrique <a style="color: #337ff1;" href="{my_account_url}">"Mon
compte"</a> sur notre site.</p>
<p style="text-align: center;">Si vous avez un compte invité, vous pouvez suivre votre commande dans la
section <a style="color: #337ff1;" href="{guest_tracking_url}?id_order={order_name}">"Suivi
invité"</a> de notre site.</p>
<p style="text-align: center;">N'hésitez pas à nous suivre sur les réseaux sociaux</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Confirmation de commande - {shop_name}</title>
</head>
<body
style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation"
style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="https://signaletique-inox.fr/themes/default-bootstrap/img/logo.png" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">
Bonjour {firstname} {lastname},</p>
<p style="font-size: 16px; color: #777; margin-bottom: 20px; text-align: center;">Merci d'avoir effectué
vos achats sur {shop_name}!</p>
<br>
<strong style="color: #283d4e;">COMMANDE {order_name} - EXPÉDIÉ </strong>
<p>Votre commande sur <strong style="color: #283d4e;">{shop_name}</strong> ayant pour référence <strong style="color: #283d4e;">{order_name}</strong> vient d'être expédiée.</p>
<p>Votre colis sera livré dans les <strong style="color: #283d4e;">48 / 72h</strong> par la poste.</p>
<br>
<!-- Section d'assistance -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; text-align: center; margin-top: 20px;">
Besoin d'aide ?</p>
<p style="text-align: center;">Vous pouvez accéder à tout moment au suivi de votre commande et
télécharger votre facture dans <a style="color: #337ff1;" href="{history_url}">"Historique des
commandes"</a> de la rubrique <a style="color: #337ff1;" href="{my_account_url}">"Mon
compte"</a> sur notre site.</p>
<!-- <p style="text-align: center;">Si vous avez un compte invité, vous pouvez suivre votre commande dans la
section <a style="color: #337ff1;" href="{guest_tracking_url}?id_order={order_name}">"Suivi
invité"</a> de notre site.</p> -->
<p style="text-align: center;">N'hésitez pas à nous suivre sur les réseaux sociaux</p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Retard - {shop_name}</title>
</head>
<body
style="font-family: 'Open Sans', sans-serif; color: #555454; background-color: #f9f9f9; margin: 0; padding: 0; width: 100%;">
<table role="presentation"
style="max-width: 1000px; margin: auto; background-color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 8px; width: 100%;">
<!-- En-tête avec logo et bannière -->
<tr>
<td style="padding: 20px; text-align: center;">
<img src="{shop_image_url}" alt="{shop_name} Logo"
width="250" height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<tr>
<td style="height: 20px;"> </td> <!-- Espace de 20px entre les images -->
</tr>
<tr>
<td style="text-align: center;">
<img src="https://signaletique-inox.fr/img/cms/banniere-top.jpg" alt="Bannière" width="600"
height="auto" style="display: block; margin: 0 auto;">
</td>
</tr>
<!-- Contenu principal -->
<tr>
<td style="padding: 30px; color: #555454;">
<p style="font-size: 24px; color: #283d4e; font-weight: bold; margin-top: 10px; text-align: center;">
Bonjour {firstname} {lastname},</p>
<p style="font-size: 16px; color: #777; margin-bottom: 20px; text-align: center;">Commande <strong style="color: #283d4e;">{order_name}</strong> - Retard</p>
<br>
<p>Nous vous informons que votre commande <strong style="color: #283d4e;">{order_name}</strong>, initialement prévue pour une livraison le <strong style="color: #283d4e;">{estimate_delivery}</strong>, a malheuresement pris du retard. Nous nous excusons sincèrement pour ce désagrément.</p>
<p>Nos équipes travaillent activement pour expédier votre commande dans les meilleurs délais. Nous vous tiendrons informé(e) dès qu’elle sera expédiée.</p>
<p>Merci pour votre patience et votre compréhension.</p>
<p>Cordialement,</p>
<p>L'équipe Lacier</p>
<br>
<!-- Section d'assistance -->
<p style="font-size: 18px; color: #283d4e; font-weight: bold; text-align: center; margin-top: 20px;">
Besoin d'aide ?</p>
<p style="text-align: center;">Vous pouvez accéder à tout moment au suivi de votre commande et
télécharger votre facture dans <a style="color: #337ff1;" href="{history_url}">"Historique des
commandes"</a> de la rubrique <a style="color: #337ff1;" href="{my_account_url}">"Mon
compte"</a> sur notre site.</p>
<p style="text-align: center;">Si vous avez un compte invité, vous pouvez suivre votre commande dans la
section <a style="color: #337ff1;" href="{guest_tracking_url}?id_order={order_name}">"Suivi
invité"</a> de notre site.</p>
<p style="text-align: center;">N'hésitez pas à nous suivre sur les réseaux sociaux</p>
<br>
<p style="text-align: center; font-size: 12px; color: #777;">Cet email est généré automatiquement par notre système. Veuillez ne pas y répondre directement. </p>
</td>
</tr>
<!-- Pied de page -->
<tr>
<td style="background-color: #283d4e; color: #ffffff; padding: 20px; text-align: center; font-size: 18px;">
<p><a href="{shop_url}" style="color: #ffffff; text-decoration: none;">{shop_name}</a></p>
</td>
</tr>
</table>
</body>
</html>
Last updated