<!doctype html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1"> <base target="_blank"> <style> body { background-color: #F0F1F3; font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, sans-serif; font-size: 15px; line-height: 26px; margin: 0; color: #444; } pre { background: #f4f4f4f4; padding: 2px; } table { width: 100%; border: 1px solid #ddd; } table td { border-color: #ddd; padding: 5px; } .wrap { background-color: #fff; padding: 30px; max-width: 525px; margin: 0 auto; border-radius: 5px; } .button { background: #0055d4; border-radius: 3px; text-decoration: none !important; color: #fff !important; font-weight: bold; padding: 10px 30px; display: inline-block; } .button:hover { background: #111; } .footer { text-align: center; font-size: 12px; color: #888; } .footer a { color: #888; margin-right: 5px; } .gutter { padding: 30px; } img { max-width: 100%; height: auto; } a { color: #0055d4; } a:hover { color: #111; } @media screen and (max-width: 600px) { .wrap { max-width: auto; } .gutter { padding: 10px; } } </style> </head> <body style="background-color: #F0F1F3;font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, sans-serif;font-size: 15px;line-height: 26px;margin: 0;color: #444;"> <div class="gutter" style="padding: 30px;"> </div> <div class="wrap" style="background-color: #fff;padding: 30px;max-width: 525px;margin: 0 auto;border-radius: 5px;"> <p>Hello {{ .Subscriber.Name }}</p> <p> <strong>Order number: </strong> {{ .Tx.Data.order_id }}<br /> <strong>Shipping date: </strong> {{ .Tx.Data.shipping_date }}<br /> </p> <br /> <p> Transactional templates supports arbitrary parameters. Render them using <code>.Tx.Data.YourParamName</code>. For more information, see the transactional mailing <a href="https://listmonk.app/docs/transactional">documentation</a>. </p> </div> <div class="footer" style="text-align: center;font-size: 12px;color: #888;"> </div> </body> </html>