Sending HTML emails from Node.JS using MailGun

Question

I send email notifications to my users from my app but currently I only send it as a text. I would like to send it HTML emails which are styled.

Currently I tried this:

var data = {
              from: 'my app',
              to: user.email,
              subject: 'Welcome',
              html: '<div style="width: 500px; height: 400px: background: #ebebeb; color: #ddd"><p>Hi  + "user.firstName" + \n ,this email is to inform you that has added their bio to the knowledge Base \n</p></div>'
           };

Compiling the above code does not work, it does not like the styles I have put in. I have created a separate HTML file within my local directory for each type of email I want send and I would like to be able to attach that html file to my email.

Something like this:

var data = {
              from: 'my app',
              to: user.email,
              subject: 'Welcome',
              html: welcomeToSiteEmail.html
           };

Is the above possible? Any help will be greatly appreciated.

I also ran into this and the `mailgun-js` module didn't support the very important `template` property (I believe this is what you want, instead of the `html` property). I found this github project https://github.com/mailgun/node-prelaunch has a working solution where they combine the templating of nodemailer with the mailgun-js transport. If this answers your question, I can pull out the code which specifically handles this and create an answer. — santeko, Sep 10 '16 at 01:56

duncanhall · Answer 1 · 2017-09-18T09:43:20.237

You can use mailgun-js together with mailcomposer to send HTML formatted emails.

The mailgun-js docs include an example:

var domain = 'mydomain.mailgun.org';
var mailgun = require('mailgun-js')({ apiKey: "YOUR API KEY", domain: domain });
var mailcomposer = require('mailcomposer');

var mail = mailcomposer({
  from: 'you@samples.mailgun.org',
  to: 'mm@samples.mailgun.org',
  subject: 'Test email subject',
  body: 'Test email text',
  html: '<b> Test email text </b>'
});

mail.build(function(mailBuildError, message) {

    var dataToSend = {
        to: 'mm@samples.mailgun.org',
        message: message.toString('ascii')
    };

    mailgun.messages().sendMime(dataToSend, function (sendError, body) {
        if (sendError) {
            console.log(sendError);
            return;
        }
    });
});

score 7 · Answer 2 · edited Nov 11 '19 at 11:16

Alternately, you could check out nodemailer on npm. It's a great package: easy to use and extensive documentation. With nodemailer, you can do something like this

var nodemailer = require('nodemailer');

var transport = nodemailer.createTransport({
      host: 'smtp.mailgun.org',
      port: 587,
      secure: false,
      tls: { ciphers: 'SSLv3' },
      auth: {
        user: '<Mailgun SMTP login>',
        pass: '<Mailgun SMTP password>'
      }
    });

transport.sendMail({
        from: '<Mailgun SMTP login>',
        to: ['bob@example.com', 'bill@foobarbaz.com', /*etc*/],
        subject: 'Fancy Email',
        text: 'still send some text to be on the safe side',
        html: { path: 'path/to/email.html' }
    }, callback)
// also returns a promise.

However, I would suggest being very thorough in your design of html emails. Writing html email is very different from html in the web. There's a much wider variety of email clients that do will render your html differently, and some, Outlook for Windows and gmail web for example, will not treat your html very nicely. Litmus has some nice resources regarding best practices for designing html emails.

My suggestion would be to use foundation for emails for your styling, use inky to simplify the semantics of writing html email, and inline-css to inline all of your styles. Even if you use alternate methods of sending the mail, check out these resources for designing it. They will save you lots of headache.

Great extra tips - I've used Litmus for a long time - what a time saver! Also I just found this for storing the auth credentials: https://www.npmjs.com/package/buttercup — scipilot, Jun 28 '18 at 23:33
I had to use "pass" not "password" for the SMPT transport options. — scipilot, Jun 29 '18 at 05:42
I would strongly second Hayden Braxton I use mailchimp to layout out HTML - their wysiwyg email creator is excellent and renders very well. You can send yourself a test email and then view the HTML to extract it. — Chanoch, Jan 19 '21 at 22:51

Sending HTML emails from Node.JS using MailGun

2 Answers2