{"id":13387,"date":"2025-05-15T00:00:00","date_gmt":"2025-05-15T00:00:00","guid":{"rendered":"https:\/\/www.mailgun.com\/blog\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/"},"modified":"2026-04-30T04:28:09","modified_gmt":"2026-04-30T04:28:09","slug":"comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande","status":"publish","type":"blog","link":"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/","title":{"rendered":"Cr\u00e9er des sc\u00e9narios d&#8217;emails transactionnels pour les confirmations de commande avec l&rsquo;API de Mailgun"},"content":{"rendered":"\n<p>Unlike marketing emails, transactional emails (such as order confirmations, shipping notifications, and password resets) are triggered by specific user actions and provide real-time updates on their interactions with your platform. They help build trust, cut down on support questions, and make for a smooth shopping experience.<\/p>\n\n<p>Order confirmations are particularly important, as they let your customers know their purchase was successful and provide the user with a record of the transaction details.<\/p>\n\n<p>In this tutorial, you&rsquo;ll learn how to build a transactional email workflow for order confirmations using Mailgun&rsquo;s API.<\/p>\n\r\n    <nav data-content-type=\"longform\" class=\"toc-block longform-spacings px-5 py-6 px-md-6 px-lg-7 py-md-7 bg-light fs-sm rounded-lg\" aria-labelledby=\"toc-title-5261\"><p class=\"h5 m-0\" id=\"toc-title-5261\">Table of contents<\/p><div class=\"d-flex mt-3\"><div class=\"w-auto fw-bold text-accent d-flex me-2\">01<\/div><div class=\"d-flex flex-column\"><a class=\"fw-bold scrollme link-body-color text-accent\" href=\"#implementing-transactional-email-workflows-for-order-confirmations\">Implementing transactional email workflows for order confirmations<\/a><\/div><\/div><div class=\"d-flex mt-3\"><div class=\"w-auto fw-bold text-accent d-flex me-2\">02<\/div><div class=\"d-flex flex-column\"><a class=\"fw-bold scrollme link-body-color text-accent\" href=\"#the-application-interface\">The application interface<\/a><\/div><\/div><div class=\"d-flex mt-3\"><div class=\"w-auto fw-bold text-accent d-flex me-2\">03<\/div><div class=\"d-flex flex-column\"><a class=\"fw-bold scrollme link-body-color text-accent\" href=\"#setting-up-the-mailgun-connection\">Setting up the Mailgun connection<\/a><\/div><\/div><div class=\"d-flex mt-3\"><div class=\"w-auto fw-bold text-accent d-flex me-2\">04<\/div><div class=\"d-flex flex-column\"><a class=\"fw-bold scrollme link-body-color text-accent\" href=\"#designing-the-email-template\">Designing the email template<\/a><\/div><\/div><div class=\"d-flex mt-3\"><div class=\"w-auto fw-bold text-accent d-flex me-2\">05<\/div><div class=\"d-flex flex-column\"><a class=\"fw-bold scrollme link-body-color text-accent\" href=\"#implementing-the-email-sending-functionality\">Implementing the email sending functionality<\/a><\/div><\/div><div class=\"d-flex mt-3\"><div class=\"w-auto fw-bold text-accent d-flex me-2\">06<\/div><div class=\"d-flex flex-column\"><a class=\"fw-bold scrollme link-body-color text-accent\" href=\"#integrating-with-application-events\">Integrating with application events<\/a><\/div><\/div><div class=\"d-flex mt-3\"><div class=\"w-auto fw-bold text-accent d-flex me-2\">07<\/div><div class=\"d-flex flex-column\"><a class=\"fw-bold scrollme link-body-color text-accent\" href=\"#testing-the-workflow\">Testing the workflow<\/a><\/div><\/div><div class=\"d-flex mt-3\"><div class=\"w-auto fw-bold text-accent d-flex me-2\">08<\/div><div class=\"d-flex flex-column\"><a class=\"fw-bold scrollme link-body-color text-accent\" href=\"#monitoring-and-managing-emails\">Monitoring and managing emails<\/a><\/div><\/div><div class=\"d-flex mt-3\"><div class=\"w-auto fw-bold text-accent d-flex me-2\">09<\/div><div class=\"d-flex flex-column\"><a class=\"fw-bold scrollme link-body-color text-accent\" href=\"#wrapping-up\">Wrapping up<\/a><\/div><\/div><\/nav>\n<h2 class=\"wp-block-heading\"><b>Implementing transactional email workflows for order confirmations<\/b><\/h2>\n\n<p>Before you begin, make sure you have a <a href=\"https:\/\/login.mailgun.com\/login\/\" target=\"_tabs\" rel=\"noopener noreferrer\">Mailgun account<\/a> and <a href=\"https:\/\/nodejs.org\/\" target=\"_tabs\" rel=\"noopener noreferrer\">Node.js<\/a> installed on your machine.<\/p>\n\n<p>Once your account is registered and activated, click <b>Get started<\/b> and then <b>Create an API Key<\/b> to provide a short description of the key. Once it&rsquo;s generated, copy and save the API key somewhere safe.<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-3951\" width=\"1728\" height=\"924\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/1__2_.png\" alt=\"API Key\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/1__2_.png 1728w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/1__2_-300x160.png 300w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/1__2_-768x411.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/1__2_-1024x548.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/1__2_-1536x821.png 1536w\" sizes=\"(max-width: 1728px) 100vw, 1728px\" \/><\/figure>\n\n<p>This key will be used to authenticate your requests to Mailgun&rsquo;s API.<\/p>\n\n<p>To keep things simple, clone the following UI repository and set up the environment variables by running the following <code>npm<\/code> commands:<\/p>\n    <div data-content-type=\"longform\" class=\"code-snippet longform-spacings rounded-lg overflow-hidden shadow \" data-count=\"1\">\r\n        <ul class=\"nav nav-buttons code-snippet__tabs longform-except position-relative d-flex gap-2 flex-wrap p-3\" role=\"tablist\">\r\n\r\n                            \r\n                    \r\n                        <li class=\"nav-item\" role=\"presentation\">\r\n                            <button class=\"nav-link active\" data-bs-toggle=\"tab\" data-bs-target=\"#code_0\" type=\"button\" role=\"tab\" aria-controls=\"code_0\" aria-selected=\"true\">\r\n                                PHP                            <\/button>\r\n                        <\/li>\r\n\r\n                    \r\n                            \r\n        <\/ul>\r\n        <div class=\"code-snippet__tab-content tab-content overflow-hidden\">\r\n\r\n                            \r\n                    <div class=\"tab-pane show active\" id=\"code_0\" role=\"tabpanel\" aria-labelledby=\"code_0\">\r\n                        <pre class=\"w-100 h-100 m-0 line-numbers language-PHP\">\r\n                            <code class=\"language-PHP\">\r\n\r\n                                $ git clone https:\/\/github.com\/Ikeh-Akinyemi\/draftdev-mailgunnerrn$ cd draftdev-mailgunner; npm install rn$ echo -e &quot;MAILGUN_API_KEY=your_api_key_here\nMAILGUN_DOMAIN=your_domain_here\nPORT=8080&quot; &gt;&gt; .env\r\n                            <\/code>\r\n                        <\/pre>\r\n                    <\/div>\r\n                                    <\/div>\r\n    <\/div>\r\n\n<p>This command adds the mailgun.js, form-data, cors, dotenv, and express libraries for use in the backend server and creates some placeholder values for the Mailgun API key and domain in a .env file that you&rsquo;ll update during the tutorial.<\/p>\n\n<p>The Mailgun domain gives you the option of setting up your own custom domain or using a sandbox for testing purposes. You&rsquo;ll use a sandbox domain in this tutorial. You can find Mailgun&rsquo;s sandbox domain by navigating to <b>Send &gt; Sending &gt; Domain settings<\/b> on your dashboard and clicking the <b>Select<\/b> button in the <b>API<\/b> integration option:<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-3957\" width=\"1746\" height=\"1040\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/2__2_.png\" alt=\"Mailgun API Sandbox\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/2__2_.png 1746w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/2__2_-300x179.png 300w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/2__2_-768x457.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/2__2_-1024x610.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/2__2_-1536x915.png 1536w\" sizes=\"(max-width: 1746px) 100vw, 1746px\" \/><\/figure>\n\n<p>Your sandbox domain is included in the boilerplates provided for Mailgun setup. Remember to update the value of MAILGUN_DOMAIN (currently your_domain_here) inside the .env file.<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-3967\" width=\"1744\" height=\"1038\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/3__2_.png\" alt=\"Domain Update\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/3__2_.png 1744w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/3__2_-300x179.png 300w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/3__2_-768x457.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/3__2_-1024x609.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/3__2_-1536x914.png 1536w\" sizes=\"(max-width: 1744px) 100vw, 1744px\" \/><\/figure>\n\n<p>If you want to set up a custom domain, follow the instructions detailed in <a href=\"https:\/\/youtu.be\/VI6aXV4YbdI\" target=\"_tabs\" rel=\"noopener noreferrer\">this YouTube tutorial<\/a>.<\/p>\n\n<h2 class=\"wp-block-heading\">The application interface<\/h2>\n\n<p>In this scenario, you&rsquo;ll be working with a simple shopping cart application built with HTML, CSS, and JavaScript. The application allows users to add items to their cart, adjust quantities, and proceed to checkout. When the user confirms their purchase, the application sends a request to the backend to process the order and send a confirmation email. To preview the UI, open the <code>ui\/index.html<\/code> file in the browser or run the Python command <code>python3 -m http.server -d=.\/ui:<\/code><\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-3993\" width=\"1750\" height=\"1048\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/4__3_.png\" alt=\"Shopping Cart Example\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/4__3_.png 1750w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/4__3_-300x180.png 300w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/4__3_-768x460.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/4__3_-1024x613.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/4__3_-1536x920.png 1536w\" sizes=\"(max-width: 1750px) 100vw, 1750px\" \/><\/figure>\n\n<p>This UI is designed to be intuitive, with a focus on providing a seamless checkout experience. The backend handles the heavy lifting, including processing orders and sending confirmation emails.<\/p>\n\n<h2 class=\"wp-block-heading\">Setting up the Mailgun connection<\/h2>\n\n<p>To integrate Mailgun into your backend, you need to initialize the Mailgun client using your API key. Here&rsquo;s how to set up the connection in your Node.js backend:<\/p>\n    <div data-content-type=\"longform\" class=\"code-snippet longform-spacings rounded-lg overflow-hidden shadow \" data-count=\"1\">\r\n        <ul class=\"nav nav-buttons code-snippet__tabs longform-except position-relative d-flex gap-2 flex-wrap p-3\" role=\"tablist\">\r\n\r\n                            \r\n                    \r\n                        <li class=\"nav-item\" role=\"presentation\">\r\n                            <button class=\"nav-link active\" data-bs-toggle=\"tab\" data-bs-target=\"#code_0\" type=\"button\" role=\"tab\" aria-controls=\"code_0\" aria-selected=\"true\">\r\n                                PHP                            <\/button>\r\n                        <\/li>\r\n\r\n                    \r\n                            \r\n        <\/ul>\r\n        <div class=\"code-snippet__tab-content tab-content overflow-hidden\">\r\n\r\n                            \r\n                    <div class=\"tab-pane show active\" id=\"code_0\" role=\"tabpanel\" aria-labelledby=\"code_0\">\r\n                        <pre class=\"w-100 h-100 m-0 line-numbers language-PHP\">\r\n                            <code class=\"language-PHP\">\r\n\r\n                                const formData = require(&#039;form-data&#039;);rnconst Mailgun = require(&#039;mailgun.js&#039;);rnrnconst mailgun = new Mailgun(formData);rnconst mg = mailgun.client({ username: &#039;api&#039;, key: process.env.MAILGUN_API_KEY });rnconst MAILGUN_DOMAIN = process.env.MAILGUN_DOMAIN;\r\n                            <\/code>\r\n                        <\/pre>\r\n                    <\/div>\r\n                                    <\/div>\r\n    <\/div>\r\n\n<p>This code initializes the Mailgun client, which will be used to send transactional emails. Make sure to update the value of <code>MAILGUN_API_KEY<\/code> (currently <code>your_api_key_here<\/code>) inside your .env file before continuing.<\/p>\n\n<p>Test the connection by sending a sample test email:<\/p>\n    <div data-content-type=\"longform\" class=\"code-snippet longform-spacings rounded-lg overflow-hidden shadow \" data-count=\"1\">\r\n        <ul class=\"nav nav-buttons code-snippet__tabs longform-except position-relative d-flex gap-2 flex-wrap p-3\" role=\"tablist\">\r\n\r\n                            \r\n                    \r\n                        <li class=\"nav-item\" role=\"presentation\">\r\n                            <button class=\"nav-link active\" data-bs-toggle=\"tab\" data-bs-target=\"#code_0\" type=\"button\" role=\"tab\" aria-controls=\"code_0\" aria-selected=\"true\">\r\n                                PHP                            <\/button>\r\n                        <\/li>\r\n\r\n                    \r\n                            \r\n        <\/ul>\r\n        <div class=\"code-snippet__tab-content tab-content overflow-hidden\">\r\n\r\n                            \r\n                    <div class=\"tab-pane show active\" id=\"code_0\" role=\"tabpanel\" aria-labelledby=\"code_0\">\r\n                        <pre class=\"w-100 h-100 m-0 line-numbers language-PHP\">\r\n                            <code class=\"language-PHP\">\r\n\r\n                                mg.messages.create(&#039;&lt;your-domain.com&gt;&#039;, {rn    from: &quot;Excited User &lt;mailgun@your-domain.com&gt;&quot;,rn    to: [&quot;test@example.com&quot;],rn    subject: &quot;Hello&quot;,rn    text: &quot;Testing some Mailgun awesomeness!&quot;rn})rn.then(msg =&gt; console.log(msg)) \/\/ logs response datarn.catch(err =&gt; console.error(err)); \/\/ logs any error\r\n                            <\/code>\r\n                        <\/pre>\r\n                    <\/div>\r\n                                    <\/div>\r\n    <\/div>\r\n\n<p>You can use the sandbox domain provided by Mailgun for testing, but you need to add at least one verified email for testing (up to five). To verify your test email address, go to <b>Send &gt; Sending &gt; Domain settings<\/b> in your Mailgun dashboard. Then, enter your email address in the designated input field and click <b>Add<\/b>. Mailgun will send a verification email to this address.<\/p>\n\n<p>Check your inbox and click the <b>I Agree<\/b> verification link to complete the process and register as an authorized test recipient:<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-4002\" width=\"1738\" height=\"1048\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/5__3_.png\" alt=\"Verification Link\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/5__3_.png 1738w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/5__3_-300x181.png 300w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/5__3_-768x463.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/5__3_-1024x617.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/5__3_-1536x926.png 1536w\" sizes=\"(max-width: 1738px) 100vw, 1738px\" \/><\/figure>\n\n<h2 class=\"wp-block-heading\">Designing the email template<\/h2>\n\n<p>Transactional emails often require dynamic content, like the user&rsquo;s name, order details, and shipping information, which is why you need to create an HTML template with placeholders for dynamic data. Here&rsquo;s an example of a simple order confirmation template:<\/p>\n    <div data-content-type=\"longform\" class=\"code-snippet longform-spacings rounded-lg overflow-hidden shadow \" data-count=\"1\">\r\n        <ul class=\"nav nav-buttons code-snippet__tabs longform-except position-relative d-flex gap-2 flex-wrap p-3\" role=\"tablist\">\r\n\r\n                            \r\n                    \r\n                        <li class=\"nav-item\" role=\"presentation\">\r\n                            <button class=\"nav-link active\" data-bs-toggle=\"tab\" data-bs-target=\"#code_0\" type=\"button\" role=\"tab\" aria-controls=\"code_0\" aria-selected=\"true\">\r\n                                HTML                            <\/button>\r\n                        <\/li>\r\n\r\n                    \r\n                            \r\n        <\/ul>\r\n        <div class=\"code-snippet__tab-content tab-content overflow-hidden\">\r\n\r\n                            \r\n                    <div class=\"tab-pane show active\" id=\"code_0\" role=\"tabpanel\" aria-labelledby=\"code_0\">\r\n                        <pre class=\"w-100 h-100 m-0 line-numbers language-markup\">\r\n                            <code class=\"language-markup\">\r\n\r\n                                &lt;!DOCTYPE html&gt;rn&lt;html&gt;rn&lt;head&gt;rn    &lt;title&gt;Order Confirmation&lt;\/title&gt;rn&lt;\/head&gt;rn&lt;body&gt;rn    &lt;h1&gt;Thank you for your order, {{name}}!&lt;\/h1&gt;rn    &lt;p&gt;Your order number is {{orderNumber}}.&lt;\/p&gt;rn    &lt;p&gt;We will ship your items to {{shippingAddress}}.&lt;\/p&gt;rn&lt;\/body&gt;rn&lt;\/html&gt;\r\n                            <\/code>\r\n                        <\/pre>\r\n                    <\/div>\r\n                                    <\/div>\r\n    <\/div>\r\n\n<p>You can use a templating engine like <a href=\"https:\/\/handlebarsjs.com\/\" target=\"_tabs\" rel=\"noopener noreferrer\">Handlebars<\/a> or <a href=\"https:\/\/ejs.co\/#features\" target=\"_tabs\" rel=\"noopener noreferrer\">EJS<\/a> to replace the placeholders with actual data before sending the email. You can also use <a href=\"https:\/\/help.mailgun.com\/hc\/en-us\/articles\/6923289387675-Email-Templates-Editor\" target=\"_tabs\" rel=\"noopener noreferrer\">Mailgun&rsquo;s intuitive visual builder<\/a> to create beautiful, responsive email templates without any coding knowledge.<\/p>\n\n<p>In this article, you&rsquo;ll use the simplest form of templating: string interpolation using JavaScript template literals. This approach allows you to set up an HTML email template populated with the necessary dynamic data:<\/p>\n    <div data-content-type=\"longform\" class=\"code-snippet longform-spacings rounded-lg overflow-hidden shadow \" data-count=\"1\">\r\n        <ul class=\"nav nav-buttons code-snippet__tabs longform-except position-relative d-flex gap-2 flex-wrap p-3\" role=\"tablist\">\r\n\r\n                            \r\n                    \r\n                        <li class=\"nav-item\" role=\"presentation\">\r\n                            <button class=\"nav-link active\" data-bs-toggle=\"tab\" data-bs-target=\"#code_0\" type=\"button\" role=\"tab\" aria-controls=\"code_0\" aria-selected=\"true\">\r\n                                PHP                            <\/button>\r\n                        <\/li>\r\n\r\n                    \r\n                            \r\n        <\/ul>\r\n        <div class=\"code-snippet__tab-content tab-content overflow-hidden\">\r\n\r\n                            \r\n                    <div class=\"tab-pane show active\" id=\"code_0\" role=\"tabpanel\" aria-labelledby=\"code_0\">\r\n                        <pre class=\"w-100 h-100 m-0 line-numbers language-PHP\">\r\n                            <code class=\"language-PHP\">\r\n\r\n                                function emailTemplate(order) {rn  \/\/ Format items for emailrn  const itemsList = order.items.map(item =&gt; {rn    return `rn      &lt;tr&gt;rn        &lt;td style=&quot;padding: 10px 0; border-bottom: 1px solid #eee;&quot;&gt;rn          ${item.name}rn        &lt;\/td&gt;rn        &lt;td style=&quot;padding: 10px 0; border-bottom: 1px solid #eee; text-align: center;&quot;&gt;rn          ${item.quantity}rn        &lt;\/td&gt;rn        &lt;td style=&quot;padding: 10px 0; border-bottom: 1px solid #eee; text-align: right;&quot;&gt;rn          $${item.price.toFixed(2)}rn        &lt;\/td&gt;rn        &lt;td style=&quot;padding: 10px 0; border-bottom: 1px solid #eee; text-align: right;&quot;&gt;rn          $${(item.price * item.quantity).toFixed(2)}rn        &lt;\/td&gt;rn      &lt;\/tr&gt;rn    `;rn  }).join(&#039;&#039;);rn};\r\n                            <\/code>\r\n                        <\/pre>\r\n                    <\/div>\r\n                                    <\/div>\r\n    <\/div>\r\n\n<p>This code iterates over an order&rsquo;s items to generate a table-like receipt of the customer&rsquo;s order. The returned value, <code>itemsList<\/code>, is a string literal that will be used to build the rest of the email template like this:<\/p>\n    <div data-content-type=\"longform\" class=\"code-snippet longform-spacings rounded-lg overflow-hidden shadow \" data-count=\"1\">\r\n        <ul class=\"nav nav-buttons code-snippet__tabs longform-except position-relative d-flex gap-2 flex-wrap p-3\" role=\"tablist\">\r\n\r\n                            \r\n                    \r\n                        <li class=\"nav-item\" role=\"presentation\">\r\n                            <button class=\"nav-link active\" data-bs-toggle=\"tab\" data-bs-target=\"#code_0\" type=\"button\" role=\"tab\" aria-controls=\"code_0\" aria-selected=\"true\">\r\n                                PHP                            <\/button>\r\n                        <\/li>\r\n\r\n                    \r\n                            \r\n        <\/ul>\r\n        <div class=\"code-snippet__tab-content tab-content overflow-hidden\">\r\n\r\n                            \r\n                    <div class=\"tab-pane show active\" id=\"code_0\" role=\"tabpanel\" aria-labelledby=\"code_0\">\r\n                        <pre class=\"w-100 h-100 m-0 line-numbers language-PHP\">\r\n                            <code class=\"language-PHP\">\r\n\r\n                                function emailTemplate(order) {rn    ...rnrn  \/\/ Create email HTML templatern  const emailHtml = `rn    &lt;!DOCTYPE html&gt;rn    &lt;html&gt;rn    &lt;head&gt;rn      &lt;style&gt;rn        body { font-family: Arial, sans-serif; line-height: 1.6; color: #333; }rn        .container { max-width: 600px; margin: 0 auto; }rn        .header { background-color: #f8f9fa; padding: 20px; text-align: center; }rn        .content { padding: 20px; }rn        .order-details { margin-top: 20px; }rn        .order-table { width: 100%; border-collapse: collapse; }rn        .order-table th { text-align: left; padding: 10px 0; border-bottom: 2px solid #ddd; }rn        .footer { margin-top: 30px; text-align: center; font-size: 14px; color: #777; }rn        .total-row { font-weight: bold; }rn      &lt;\/style&gt;rn    &lt;\/head&gt;rn    &lt;body&gt;rn      &lt;div class=&quot;container&quot;&gt;rn        &lt;div class=&quot;header&quot;&gt;rn          &lt;h2&gt;Order Confirmation&lt;\/h2&gt;rn          &lt;p&gt;Thank you for your purchase!&lt;\/p&gt;rn        &lt;\/div&gt;rnrn        &lt;div class=&quot;content&quot;&gt;rn          &lt;p&gt;Hello ${order.customer.name},&lt;\/p&gt;rnrn          &lt;p&gt;Your order has been confirmed. Here are your order details:&lt;\/p&gt;rnrn          &lt;div class=&quot;order-details&quot;&gt;rn            &lt;p&gt;&lt;strong&gt;Order ID:&lt;\/strong&gt; ${order.id}&lt;\/p&gt;rn            &lt;p&gt;&lt;strong&gt;Order Date:&lt;\/strong&gt; ${new Date(order.createdAt).toLocaleString()}&lt;\/p&gt;rnrn            &lt;table class=&quot;order-table&quot;&gt;rn              &lt;thead&gt;rn                &lt;tr&gt;rn                  &lt;th&gt;Item&lt;\/th&gt;rn                  &lt;th style=&quot;text-align: center;&quot;&gt;Qty&lt;\/th&gt;rn                  &lt;th style=&quot;text-align: right;&quot;&gt;Price&lt;\/th&gt;rn                  &lt;th style=&quot;text-align: right;&quot;&gt;Total&lt;\/th&gt;rn                &lt;\/tr&gt;rn              &lt;\/thead&gt;rn              &lt;tbody&gt;rn                ${itemsList}rn                &lt;tr&gt;rn                  &lt;td colspan=&quot;3&quot; style=&quot;text-align: right; padding-top: 20px;&quot;&gt;&lt;strong&gt;Subtotal:&lt;\/strong&gt;&lt;\/td&gt;rn                  &lt;td style=&quot;text-align: right; padding-top: 20px;&quot;&gt;&lt;strong&gt;$${order.subtotal.toFixed(2)}&lt;\/strong&gt;&lt;\/td&gt;rn                &lt;\/tr&gt;rn                &lt;tr&gt;rn                  &lt;td colspan=&quot;3&quot; style=&quot;text-align: right;&quot;&gt;&lt;strong&gt;Tax:&lt;\/strong&gt;&lt;\/td&gt;rn                  &lt;td style=&quot;text-align: right;&quot;&gt;&lt;strong&gt;$${order.tax.toFixed(2)}&lt;\/strong&gt;&lt;\/td&gt;rn                &lt;\/tr&gt;rn                &lt;tr class=&quot;total-row&quot;&gt;rn                  &lt;td colspan=&quot;3&quot; style=&quot;text-align: right; padding-top: 10px;&quot;&gt;&lt;strong&gt;Total:&lt;\/strong&gt;&lt;\/td&gt;rn                  &lt;td style=&quot;text-align: right; padding-top: 10px;&quot;&gt;&lt;strong&gt;$${order.total.toFixed(2)}&lt;\/strong&gt;&lt;\/td&gt;rn                &lt;\/tr&gt;rn              &lt;\/tbody&gt;rn            &lt;\/table&gt;rn          &lt;\/div&gt;rnrn          &lt;div style=&quot;margin-top: 30px;&quot;&gt;rn            &lt;p&gt;&lt;strong&gt;Shipping Address:&lt;\/strong&gt;&lt;\/p&gt;rn            &lt;p&gt;rn              ${order.shipping.address}&lt;br&gt;rn              ${order.shipping.city}, ${order.shipping.state} ${order.shipping.zipCode}rn            &lt;\/p&gt;rn          &lt;\/div&gt;rnrn          &lt;div style=&quot;margin-top: 30px;&quot;&gt;rn            &lt;p&gt;&lt;strong&gt;Payment Method:&lt;\/strong&gt; ${order.payment.method} (ending in ${order.payment.last4})&lt;\/p&gt;rn          &lt;\/div&gt;rnrn          &lt;div style=&quot;margin-top: 30px;&quot;&gt;rn            &lt;p&gt;If you have any questions about your order, please contact our customer support.&lt;\/p&gt;rn            &lt;p&gt;Thank you for shopping with us!&lt;\/p&gt;rn          &lt;\/div&gt;rn        &lt;\/div&gt;rnrn        &lt;div class=&quot;footer&quot;&gt;rn          &lt;p&gt;This is an automated email, please do not reply to this message.&lt;\/p&gt;rn          &lt;p&gt;\u00a9 2025 Your Company. All rights reserved.&lt;\/p&gt;rn        &lt;\/div&gt;rn      &lt;\/div&gt;rn    &lt;\/body&gt;rn    &lt;\/html&gt;rn  `;rnrn  return emailHtml;rn}\r\n                            <\/code>\r\n                        <\/pre>\r\n                    <\/div>\r\n                                    <\/div>\r\n    <\/div>\r\n\n<p>Here, you combine the receipt with the rest of an HTML template string containing customer details. The HTML contains basic styling for the email template.<\/p>\n\n<p>Learn more from our <a href=\"https:\/\/www.mailgun.com\/fr\/blog\/email\/modeles-d-emails-transactionnels-html\/\">transactional email templates<\/a> page, including downloading free templates.<\/p>\n\n<h2 class=\"wp-block-heading\">Implementing the email sending functionality<\/h2>\n\n<p>Now that your template is ready, it&rsquo;s time to write the function that sends the email using Mailgun&rsquo;s API. Here&rsquo;s how you can implement this functionality in your backend:<\/p>\n    <div data-content-type=\"longform\" class=\"code-snippet longform-spacings rounded-lg overflow-hidden shadow \" data-count=\"1\">\r\n        <ul class=\"nav nav-buttons code-snippet__tabs longform-except position-relative d-flex gap-2 flex-wrap p-3\" role=\"tablist\">\r\n\r\n                            \r\n                    \r\n                        <li class=\"nav-item\" role=\"presentation\">\r\n                            <button class=\"nav-link active\" data-bs-toggle=\"tab\" data-bs-target=\"#code_0\" type=\"button\" role=\"tab\" aria-controls=\"code_0\" aria-selected=\"true\">\r\n                                PHP                            <\/button>\r\n                        <\/li>\r\n\r\n                    \r\n                            \r\n        <\/ul>\r\n        <div class=\"code-snippet__tab-content tab-content overflow-hidden\">\r\n\r\n                            \r\n                    <div class=\"tab-pane show active\" id=\"code_0\" role=\"tabpanel\" aria-labelledby=\"code_0\">\r\n                        <pre class=\"w-100 h-100 m-0 line-numbers language-PHP\">\r\n                            <code class=\"language-PHP\">\r\n\r\n                                async function sendOrderConfirmationEmail(order) {rn  try {rnrn    let emailHtml = emailTemplate(order)rnrn    \/\/ Send email via Mailgunrn    const response = await mg.messages.create(MAILGUN_DOMAIN, {rn      from: `Your Store &lt;orders@${MAILGUN_DOMAIN}&gt;`,rn      to: order.customer.email,rn      subject: `Order Confirmation #${order.id}`,rn      html: emailHtml,rn      &#039;o:tag&#039;: [&#039;order-confirmation&#039;],rn      &#039;o:tracking&#039;: truern    });rnrn    console.log(&#039;Email sent successfully:&#039;, response);rn    return response;rnrn  } catch (error) {rn    console.error(&#039;Error sending confirmation email:&#039;, error);rn    throw error;rn  }rn}\r\n                            <\/code>\r\n                        <\/pre>\r\n                    <\/div>\r\n                                    <\/div>\r\n    <\/div>\r\n\n<p>This function takes an order object, constructs the email content, and sends it using Mailgun&rsquo;s API. The <code>o:tag<\/code> and <code>o:tracking<\/code> options allow you to track the email&rsquo;s delivery and engagement.<\/p>\n\n<p>Now, let&rsquo;s test the implementation with a simple order object to see if it works:<\/p>\n    <div data-content-type=\"longform\" class=\"code-snippet longform-spacings rounded-lg overflow-hidden shadow \" data-count=\"1\">\r\n        <ul class=\"nav nav-buttons code-snippet__tabs longform-except position-relative d-flex gap-2 flex-wrap p-3\" role=\"tablist\">\r\n\r\n                            \r\n                    \r\n                        <li class=\"nav-item\" role=\"presentation\">\r\n                            <button class=\"nav-link active\" data-bs-toggle=\"tab\" data-bs-target=\"#code_0\" type=\"button\" role=\"tab\" aria-controls=\"code_0\" aria-selected=\"true\">\r\n                                PHP                            <\/button>\r\n                        <\/li>\r\n\r\n                    \r\n                            \r\n        <\/ul>\r\n        <div class=\"code-snippet__tab-content tab-content overflow-hidden\">\r\n\r\n                            \r\n                    <div class=\"tab-pane show active\" id=\"code_0\" role=\"tabpanel\" aria-labelledby=\"code_0\">\r\n                        <pre class=\"w-100 h-100 m-0 line-numbers language-PHP\">\r\n                            <code class=\"language-PHP\">\r\n\r\n                                const testOrder = {rn  id: &quot;TEST123&quot;,rn  customer: {rn    name: &quot;Test User&quot;,rn    email: &quot;your-verified-email@example.com&quot; \/\/ Use one of your verified emails for testingrn  },rn  items: [rn    { name: &quot;Test Product&quot;, quantity: 1, price: 29.99 }rn  ],rn  subtotal: 29.99,rn  tax: 2.99,rn  total: 32.98,rn  shipping: {rn    address: &quot;123 Test Street&quot;,rn    city: &quot;Test City&quot;,rn    state: &quot;TS&quot;,rn    zipCode: &quot;12345&quot;rn  },rn  payment: {rn    method: &quot;Credit Card&quot;,rn    last4: &quot;4242&quot;rn  },rn  createdAt: new Date()rn};rnrnsendOrderConfirmationEmail(testOrder)rn  .then(response =&gt; {rn    console.log(&#039;Test email sent successfully!&#039;);rn    console.log(&#039;Message ID:&#039;, response.id);rn    console.log(&#039;Message status:&#039;, response.status);rn  })rn  .catch(error =&gt; {rn    console.error(&#039;Failed to send test email:&#039;, error.message);rn  });\r\n                            <\/code>\r\n                        <\/pre>\r\n                    <\/div>\r\n                                    <\/div>\r\n    <\/div>\r\n\n<p>Run this code with node <code>.\/src\/server.js<\/code> and check your inbox (remember to use a verified email for the <code>testOrder.customer.email <\/code>value if you&rsquo;re using Mailgun&rsquo;s sandbox domain). You should receive a basic order confirmation email with the test data:<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-4021\" width=\"1742\" height=\"1392\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/6__3_.png\" alt=\"Order Confirmation Image\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/6__3_.png 1742w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/6__3_-1024x818.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/6__3_-768x614.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/6__3_-1536x1227.png 1536w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/6__3_-300x240.png 300w\" sizes=\"(max-width: 1742px) 100vw, 1742px\" \/><\/figure>\n\n<p>In this setup, any error that occurs is bubbled up to the caller, and the <code>.catch <\/code>method logs it to the standard output. This approach allows you to quickly identify and troubleshoot any issues that might occur during the email sending process.<\/p>\n\n<p>In the next section, you&rsquo;ll connect this to your frontend so you can send real order data from customer checkouts.<\/p>\n\n<h2 class=\"wp-block-heading\">Integrating with application events<\/h2>\n\n<p>To ensure that the email workflow is triggered automatically when an order is confirmed, you need to set up an <a href=\"https:\/\/nodejs.org\/api\/events.html\" target=\"_tabs\" rel=\"noopener noreferrer\">event listener<\/a> or <a href=\"https:\/\/expressjs.com\/en\/guide\/routing.html\" target=\"_tabs\" rel=\"noopener noreferrer\">route<\/a> in your application.<\/p>\n\n<p>Here, you&rsquo;ll set up an Express.js application and define a route that handles order confirmations while calling the <code>sendOrderConfirmationEmail<\/code> function:<\/p>\n    <div data-content-type=\"longform\" class=\"code-snippet longform-spacings rounded-lg overflow-hidden shadow \" data-count=\"1\">\r\n        <ul class=\"nav nav-buttons code-snippet__tabs longform-except position-relative d-flex gap-2 flex-wrap p-3\" role=\"tablist\">\r\n\r\n                            \r\n                    \r\n                        <li class=\"nav-item\" role=\"presentation\">\r\n                            <button class=\"nav-link active\" data-bs-toggle=\"tab\" data-bs-target=\"#code_0\" type=\"button\" role=\"tab\" aria-controls=\"code_0\" aria-selected=\"true\">\r\n                                PHP                            <\/button>\r\n                        <\/li>\r\n\r\n                    \r\n                            \r\n        <\/ul>\r\n        <div class=\"code-snippet__tab-content tab-content overflow-hidden\">\r\n\r\n                            \r\n                    <div class=\"tab-pane show active\" id=\"code_0\" role=\"tabpanel\" aria-labelledby=\"code_0\">\r\n                        <pre class=\"w-100 h-100 m-0 line-numbers language-PHP\">\r\n                            <code class=\"language-PHP\">\r\n\r\n                                const express = require(&#039;express&#039;);rnconst cors = require(&#039;cors&#039;);rn...rnrn\/\/ Load environment variablesrnrequire(&#039;dotenv&#039;).config();rnrn\/\/ Initialize Expressrnconst app = express();rnconst PORT = process.env.PORT || 3000;rnrn\/\/ Middlewarernapp.use(cors());rnapp.use(express.json());rnrnconst orders = [];rnrnapp.post(&#039;\/api\/orders&#039;, async (req, res) =&gt; {rn  try {rn    \/\/ Validate required fieldsrn    if (!req.body.items || !req.body.customer || !req.body.customer.email) {rn      return res.status(400).json({ rn        success: false, rn        error: &#039;Missing required order information&#039; rn      });rn    }rnrn    \/\/ Generate order IDrn    const orderId = Date.now().toString(36) + Math.random().toString(36).substr(2, 5).toUpperCase();rnrn    \/\/ Create order objectrn    const order = {rn      id: orderId,rn      ...req.body,rn      status: &#039;confirmed&#039;,rn      createdAt: new Date()rn    };rnrn    \/\/ Save order (to database in a real app)rn    orders.push(order);rnrn    \/\/ Send confirmation emailrn    await sendOrderConfirmationEmail(order);rnrn    \/\/ Return success responsern    res.status(201).json({rn      success: true,rn      order: {rn        id: order.id,rn        status: order.status,rn        createdAt: order.createdAtrn      },rn      message: &#039;Order created successfully and confirmation email sent.&#039;rn    });rnrn  } catch (error) {rn    console.error(&#039;Error processing order:&#039;, error);rn    res.status(500).json({rn      success: false,rn      error: &#039;Failed to process order&#039;rn    });rn  }rn});\r\n                            <\/code>\r\n                        <\/pre>\r\n                    <\/div>\r\n                                    <\/div>\r\n    <\/div>\r\n\n<p>The <code>\/api\/orders<\/code> route handles incoming order requests, creates an <code>order<\/code> object, and sends a confirmation email using the <code>sendOrderConfirmationEmail<\/code> function. The rest of the route includes a simple error reporting logic, but in production, you might want to implement a retry mechanism or a more robust error handler.<\/p>\n\n<h2 class=\"wp-block-heading\">Testing the workflow<\/h2>\n\n<p>To test the setup so far, you need to modify the <code>\/ui\/index.html<\/code> file. First, find the line of code where the <code>orderData<\/code> object is defined and update the customer&rsquo;s email property (<code>orderData.customer.email<\/code>) to use one of your verified emails. You also need to update the <code>api<\/code> constant to point to the URL of your server.<\/p>\n\n<p>Then, open the <code>\/ui\/index.html <\/code>file in a browser and trigger the checkout process by selecting items for checkout and clicking the <b>Checkout Selected Items<\/b> button. This should open a confirmation dialog where you can click <b>Confirm Purchase<\/b> to complete the checkout process:<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-5031\" width=\"1734\" height=\"1046\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/7__2_.png\" alt=\"Confirm Order Image\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/7__2_.png 1734w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/7__2_-300x181.png 300w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/7__2_-768x463.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/7__2_-1024x618.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/7__2_-1536x927.png 1536w\" sizes=\"(max-width: 1734px) 100vw, 1734px\" \/><\/figure>\n\n<p>Check your email inbox and verify that the email was sent and correctly rendered with the dynamic content. If you used the sandbox domain, you may need to check your spam folder:<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-5032\" width=\"1742\" height=\"1470\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/8__2_.png\" alt=\"Order Confirmation Email Image\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/8__2_.png 1742w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/8__2_-300x253.png 300w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/8__2_-768x648.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/8__2_-1024x864.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/8__2_-1536x1296.png 1536w\" sizes=\"(max-width: 1742px) 100vw, 1742px\" \/><\/figure>\n\n<p>Remember to test how your application handles errors, such as invalid email addresses or API downtimes, by intentionally using incorrect values and verifying that your error handling works as expected.<\/p>\n\n<p>All the code used in this tutorial is available on <a href=\"https:\/\/github.com\/Ikeh-Akinyemi\/draftdev-mailgunner\" target=\"_tabs\" rel=\"noopener noreferrer\">GitHub<\/a>.<\/p>\n\n<h2 class=\"wp-block-heading\">Monitoring and managing emails<\/h2>\n\n<p>Mailgun provides detailed metrics and tracking features that allow you to monitor the performance of your transactional emails. You can track delivery rates and open rates in addition to handling bounces or failures directly from the Mailgun dashboard.<\/p>\n\n<p>To access the logs of each email sent, navigate to the <b>Send &gt; Reporting &gt; Logs<\/b> section in your Mailgun account. Here, you can see the timestamp and status of each email sent, including whether it was delivered, opened, or rejected:<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-5033\" width=\"1742\" height=\"1050\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/9__2_.png\" alt=\"Email logs image\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/9__2_.png 1742w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/9__2_-300x181.png 300w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/9__2_-768x463.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/9__2_-1024x617.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/9__2_-1536x926.png 1536w\" sizes=\"(max-width: 1742px) 100vw, 1742px\" \/><\/figure>\n\n<p>You can click any log entry to view its full details, like <code>geolocation<\/code> for opened emails, <code>delivery-status<\/code> for delivered emails, and others:<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-5034\" width=\"1760\" height=\"1056\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/10__1_.png\" alt=\"Email Log Details Image\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/10__1_.png 1760w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/10__1_-300x180.png 300w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/10__1_-768x461.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/10__1_-1024x614.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/10__1_-1536x922.png 1536w\" sizes=\"(max-width: 1760px) 100vw, 1760px\" \/><\/figure>\n\n<p>You can also go to <b>Send &gt; Reporting &gt; Metrics<\/b> to view a graphical breakdown of key email metrics, including the sent, delivered, failed, and opened count:<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" class=\"wp-image-5035\" width=\"1746\" height=\"1058\" src=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/11__1_.png\" alt=\"Key Email Metrics Image\" srcset=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/11__1_.png 1746w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/11__1_-300x182.png 300w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/11__1_-768x465.png 768w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/11__1_-1024x620.png 1024w, https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/11__1_-1536x931.png 1536w\" sizes=\"(max-width: 1746px) 100vw, 1746px\" \/><\/figure>\n\n<h2 class=\"wp-block-heading\">Wrapping up<\/h2>\n\n<p>You\u2019ve just built a working order confirmation workflow with Mailgun\u2019s API. <\/p>\n\n<p>Transactional emails like these keep customers informed right after checkout, cutting down on support tickets and improving trust without extra overhead. Order confirmations aren\u2019t the only w<a href=\"https:\/\/www.mailgun.com\/blog\/email\/transactional-email-unsung-hero\/\" target=\"_tabs\" rel=\"noopener noreferrer\">orkflows that matter to consumers.<\/a> Check out our tutorial on <a href=\"https:\/\/www.mailgun.com\/blog\/dev-life\/how-to-build-transactional-password-reset-email-workflows\/\" target=\"_tabs\" rel=\"noopener noreferrer\">password resets<\/a> to keep optimizing your transactional emails. <\/p>\n\r\n    <aside data-content-type=\"longform\"  class=\"banner-block longform-spacings rounded-lg shadow-lg px-5 py-6 px-md-6 py-md-7 p-lg-7 bg-light\" data-theme=\"dark\" aria-labelledby=\"banner-block-block_3dc93319f94b85ccd0a8cdf51e99da9a\">\r\n                    <p class=\"text-uppercase section-caption text-body-color\">\r\n                Sign Up            <\/p>\r\n                            <p class=\"h4 text-accent fw-bold\" id=\"banner-block-block_3dc93319f94b85ccd0a8cdf51e99da9a\">\r\n                It&rsquo;s easy to get started. And it&rsquo;s free.            <\/p>\r\n                            <div class=\"mb-0 text-body-color\">\r\n                                    <div class=\"content-body mb-0 text-body-color\">See what you can accomplish with the world\u2019s best email delivery platform.<\/div>\r\n                            <\/div>\r\n        \r\n        <div class=\"text-start mt-5\"><a href=\"https:\/\/signup.mailgun.com\/new\/signup\"  class=\"btn btn-secondary\" >Get started<\/a><\/div>\r\n    <\/aside>\r\n\r\n","protected":false},"excerpt":{"rendered":"<p>Unlike marketing emails, transactional emails (such as order confirmations, shipping notifications, and password resets) are triggered by specific user actions and provide real-time updates on their interactions with your platform. They help build trust, cut down on support questions, and make for a smooth shopping experience. Order confirmations are particularly important, as they let your [&hellip;]<\/p>\n","protected":false},"author":7,"featured_media":3952,"menu_order":0,"template":"","meta":{"_acf_changed":true,"footnotes":""},"blog_category":[19],"class_list":["post-13387","blog","type-blog","status-publish","has-post-thumbnail","hentry","blog_category-dev-life"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Build transactional order confirmation workflows with Mailgun - Transactional Email API Service For Developers | Mailgun<\/title>\n<meta name=\"description\" content=\"Learn how to create transactional order confirmation email workflows using Mailgun&#039;s API. Follow along in our developer tutorial for our best practices.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Build transactional order confirmation workflows with Mailgun - Transactional Email API Service For Developers | Mailgun\" \/>\n<meta property=\"og:description\" content=\"Learn how to create transactional order confirmation email workflows using Mailgun&#039;s API. Follow along in our developer tutorial for our best practices.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/\" \/>\n<meta property=\"og:site_name\" content=\"Transactional Email API Service For Developers | Mailgun\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-30T04:28:09+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/MG-Blog-Dev-Life.png\" \/>\n\t<meta property=\"og:image:width\" content=\"720\" \/>\n\t<meta property=\"og:image:height\" content=\"448\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"9 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/blog\\\/dev-life\\\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\\\/\",\"url\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/blog\\\/dev-life\\\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\\\/\",\"name\":\"Build transactional order confirmation workflows with Mailgun - Transactional Email API Service For Developers | Mailgun\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/blog\\\/dev-life\\\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/blog\\\/dev-life\\\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.mailgun.com\\\/wp-content\\\/uploads\\\/2025\\\/07\\\/MG-Blog-Dev-Life.png\",\"datePublished\":\"2025-05-15T00:00:00+00:00\",\"dateModified\":\"2026-04-30T04:28:09+00:00\",\"description\":\"Learn how to create transactional order confirmation email workflows using Mailgun's API. Follow along in our developer tutorial for our best practices.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/blog\\\/dev-life\\\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\\\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/blog\\\/dev-life\\\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/blog\\\/dev-life\\\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.mailgun.com\\\/wp-content\\\/uploads\\\/2025\\\/07\\\/MG-Blog-Dev-Life.png\",\"contentUrl\":\"https:\\\/\\\/www.mailgun.com\\\/wp-content\\\/uploads\\\/2025\\\/07\\\/MG-Blog-Dev-Life.png\",\"width\":720,\"height\":448},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/blog\\\/dev-life\\\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Blog\",\"item\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Cr\u00e9er des sc\u00e9narios d&#8217;emails transactionnels pour les confirmations de commande avec l&#8217;API de Mailgun\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/#website\",\"url\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/\",\"name\":\"Transactional Email API Service For Developers | Mailgun\",\"description\":\"Powerful Transactional Email APIs that enable you to send, receive, and track emails, built with developers in mind. Learn more today!\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/#organization\",\"name\":\"Transactional Email API Service For Developers | Mailgun\",\"url\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.mailgun.com\\\/wp-content\\\/uploads\\\/2025\\\/06\\\/cropped-android-chrome-512x512-1.png\",\"contentUrl\":\"https:\\\/\\\/www.mailgun.com\\\/wp-content\\\/uploads\\\/2025\\\/06\\\/cropped-android-chrome-512x512-1.png\",\"width\":512,\"height\":512,\"caption\":\"Transactional Email API Service For Developers | Mailgun\"},\"image\":{\"@id\":\"https:\\\/\\\/www.mailgun.com\\\/fr\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Build transactional order confirmation workflows with Mailgun - Transactional Email API Service For Developers | Mailgun","description":"Learn how to create transactional order confirmation email workflows using Mailgun's API. Follow along in our developer tutorial for our best practices.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/","og_locale":"fr_FR","og_type":"article","og_title":"Build transactional order confirmation workflows with Mailgun - Transactional Email API Service For Developers | Mailgun","og_description":"Learn how to create transactional order confirmation email workflows using Mailgun's API. Follow along in our developer tutorial for our best practices.","og_url":"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/","og_site_name":"Transactional Email API Service For Developers | Mailgun","article_modified_time":"2026-04-30T04:28:09+00:00","og_image":[{"width":720,"height":448,"url":"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/MG-Blog-Dev-Life.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/","url":"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/","name":"Build transactional order confirmation workflows with Mailgun - Transactional Email API Service For Developers | Mailgun","isPartOf":{"@id":"https:\/\/www.mailgun.com\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/#primaryimage"},"image":{"@id":"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/#primaryimage"},"thumbnailUrl":"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/MG-Blog-Dev-Life.png","datePublished":"2025-05-15T00:00:00+00:00","dateModified":"2026-04-30T04:28:09+00:00","description":"Learn how to create transactional order confirmation email workflows using Mailgun's API. Follow along in our developer tutorial for our best practices.","breadcrumb":{"@id":"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/#primaryimage","url":"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/MG-Blog-Dev-Life.png","contentUrl":"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/07\/MG-Blog-Dev-Life.png","width":720,"height":448},{"@type":"BreadcrumbList","@id":"https:\/\/www.mailgun.com\/fr\/blog\/dev-life\/comment-creer-des-scenarios-d-emails-transactionnels-de-confirmation-de-commande\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.mailgun.com\/fr\/"},{"@type":"ListItem","position":2,"name":"Blog","item":"https:\/\/www.mailgun.com\/fr\/blog\/"},{"@type":"ListItem","position":3,"name":"Cr\u00e9er des sc\u00e9narios d&#8217;emails transactionnels pour les confirmations de commande avec l&#8217;API de Mailgun"}]},{"@type":"WebSite","@id":"https:\/\/www.mailgun.com\/fr\/#website","url":"https:\/\/www.mailgun.com\/fr\/","name":"Transactional Email API Service For Developers | Mailgun","description":"Powerful Transactional Email APIs that enable you to send, receive, and track emails, built with developers in mind. Learn more today!","publisher":{"@id":"https:\/\/www.mailgun.com\/fr\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.mailgun.com\/fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/www.mailgun.com\/fr\/#organization","name":"Transactional Email API Service For Developers | Mailgun","url":"https:\/\/www.mailgun.com\/fr\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.mailgun.com\/fr\/#\/schema\/logo\/image\/","url":"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/06\/cropped-android-chrome-512x512-1.png","contentUrl":"https:\/\/www.mailgun.com\/wp-content\/uploads\/2025\/06\/cropped-android-chrome-512x512-1.png","width":512,"height":512,"caption":"Transactional Email API Service For Developers | Mailgun"},"image":{"@id":"https:\/\/www.mailgun.com\/fr\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.mailgun.com\/fr\/wp-json\/wp\/v2\/blog\/13387","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mailgun.com\/fr\/wp-json\/wp\/v2\/blog"}],"about":[{"href":"https:\/\/www.mailgun.com\/fr\/wp-json\/wp\/v2\/types\/blog"}],"author":[{"embeddable":true,"href":"https:\/\/www.mailgun.com\/fr\/wp-json\/wp\/v2\/users\/7"}],"version-history":[{"count":0,"href":"https:\/\/www.mailgun.com\/fr\/wp-json\/wp\/v2\/blog\/13387\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.mailgun.com\/fr\/wp-json\/wp\/v2\/media\/3952"}],"wp:attachment":[{"href":"https:\/\/www.mailgun.com\/fr\/wp-json\/wp\/v2\/media?parent=13387"}],"wp:term":[{"taxonomy":"blog_category","embeddable":true,"href":"https:\/\/www.mailgun.com\/fr\/wp-json\/wp\/v2\/blog_category?post=13387"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}