Meteor JS: How to set up templates in html to send email ?

For do this you can use the package :


Example :

To call : ( My mail.js file )

sendConfirmationLinkUser: function(userId,email){
 var url = Meteor.absoluteUrl() + "confirmation/email/" +userId;
 var html = SSR.render('userConfirmationMail', {url:url});
 var subject = "Email Confirmation ";
 var to = email;
 try{'sendMail',to, subject, html);
 throw Meteor.Error(err.reason);


  • Here you can pass values and collections for your Template.
 var html = SSR.render('userConfirmationMail', {url:url});

In this example I send for there a url attribute, but you can pass N values like :

 var html = SSR.render('userConfirmationMail', {url:url, value2:value2, value3:value3});

  • When you will use this values you need call this.value2, this.url, etc …

Make the template : ( Javascript File )


  • Here you can implement the helpers and functions that you will need to build your email.
SSR.compileTemplate("userConfirmationMail", Assets.getText("emailTemplates/userConfirmationMail.html"));

    getConfirmationURL: function() {
        return this.url;

Tips: :

SSR.compileTemplate("userConfirmationMail", Assets.getText("emailTemplates/userConfirmationMail.html"));
  • You will call by this name : userConfirmationMail
  • This is the path in your application :  “emailTemplates/userConfirmationMail.html”

userConfirmationMail.html ( HTML file)

In this file you need put your html code.

<html lang="pt-Br" xmlns="">
    <!--[if gte mso 9]>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width">
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">


<body style="width: 100% !important;min-width: 100%;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100% !important;margin: 0;padding: 0;background-color: #FFFFFF">
<style id="media-query">
    /*  Media Queries */
    @media only screen and (max-width: 500px) {
        .prova {
            width: 500px; }
        table[class="body"] img {
            width: 100% !important;
            height: auto !important;


Tips :

  • For you call any helper method use : {{getHelperMethodName}}
  • The HTML files need be in the private directory in your application.

Screen Shot 2015-10-14 at 5.03.18 PM

  • All styles need be in this file.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s