A delicious way to manage email templates.
Tempie is nothing special when it comes to the actual templates. It utilizes handlebars to process HTML templates, which is well known and proven as far as templates go. What Tempie does provide is a flexible loading mechanism that allows you to organize your templates in several different ways. It will also handle compiling CSS into the HTML and generate a text-only version of the email.
npm install tempie
Once installed, all you need to do is include it and save some template files.
var tempie = ;//...some more codevar myEmail = tempie;//myEmail"subject": "Welcome User!""html": "<html><head>...</head><body>Welcome <em>Tony Stark</em>!</body></html>""text": "Welcome Tony Stark!"
There are a few different ways you can organize your templates, but the preferred method is each template being in its own folder inside a templates directory. Each file must share the same name in order to be loaded.
- MyProject - myproject.js - templates - newuser - newuser.html - newuser.css - newuser.json
You can also just throw all the files inside the templates directory if you find subfolders annoying. As long as the files have the same name, Tempie will find them in both cases.
- MyProject - myproject.js - templates - newuser.html - newuser.css - newuser.json
The HTML and CSS files are self explanatory, with the HTML file being a handlebars template. Treat the template as the body of the HTML document, with the CSS file being added to a style tag in the head. A text-only version will also automatically generated from the processed template and added to the returned object.
The JSON file holds anything that you wish to be part of the email object returned when loaded. Typically these are things like the subject, the "from" email, etc. There is no restrictions and what you can add, but the only field that will currently be defaulted if not present is the subject.
"subject": "Welcome User!"
If you prefer a single json configuration for all of your email templates, you can create an emails.json file in the templates root. Keep in mind this will not be reloaded on each load call, so you have to use separate JSON files for "hot loading" of new templates.
- MyProject - myproject.js - templates - emails.json - newuser.html - newuser.css
The only difference in structure is the emails.json requires the top-level to have the name of the template as the key.
"newuser":"subject": "Welcome User!"