How To Code An Email Receipt Template With MJML

We are developers, like you. And what we hate above all in coding is to repeat ourselves. So when it comes to writing email templates, we want to provide our users with the best tools to produce content in the most efficient way possible, whether you want to know how to code an e-receipt or just update your welcome emails.

To speed up the development of responsive emails, we’ve already told you about MJML, the open-source email framework we’ve created. If you’re not familiar with it, go check it out right away. You can thank us later.

But even if MJML can help you save quite a lot of time and ease the process, you’ll probably want more. We hear you.


A templating language for your transactional emails

Today, flexibility and personalization are a must-have in the email industry. Transactional emails imply more and more complex business logic, and one can often struggle to try to juggle a lot of different templates, when they could just have one personalized email that adapts to several use cases.

Having a separate template for men and another one for women, or creating specific campaigns to recommend different things based on your customer’s previous purchases is not viable. It is in this kind of situations that a templating language comes in handy.

OK, let’s be a bit naive and accept that you could write your own. But to be able to implement a tokenizer and a grammar, you need to have a good knowledge in the field and, at the end of the day, you might just be reinventing the wheel when you could have been focusing on your core business instead…

You could instead use nice libraries such as Handlebars, Jinja or Twig, but then you’ll still need to write or host a dedicated service to handle the templating processing.

Mailjet’s Templating Language

We have the solution. Because at Mailjet we know the value of a fully integrated templating language, we created our own templating language with our Transactional Send API in mind. Our idea: one template to rule them all, just with a single API call.

So, let’s recap: MJML for producing responsive HTML emails without effort, plus a templating language to bring them to life with conditional blocks and variables.

This combo can change your life as a developer. But, enough words, you’ll definitely want some action. So we’ve decided to show you how to create and send awesome transactional emails, step by step.


The “How to code” tutorial: what you need to know

We’re rolling out a series of tutorials, all of which will explore a very common use-case, providing numerous examples, code snippets and nice visuals. We’ve even created an easy-to-execute tool, written with NodeJS, to test emails under actual conditions. To use it, you’ll just need valid credentials for both MJML API and Mailjet Transactional Send API, but don’t worry if you’re a newcomer: applying for the MJML API beta and creating a Mailjet account are totally free.

Our “How To Code” series has four parts. Check them out now:


How to code a receipt email template: Quick Introduction

From online shoe stores to indie music platforms, any company selling a product online will have to send a receipt. You may think this is a simple task but, actually, there are several elements you’ll need to consider.

Let’s review them briefly, before jumping over to our tutorial, from the more obvious ones to the less:

  1. You will have to loop over the list of items (cart, abandoned cart, recommendations, etc.) and display them.
  2. You need to display the price and may have to do some calculus directly in the email logic (Total, VAT and other taxes). Be careful, as you may use different currencies!
  3. You need to include some basic billing information (billing address, order number, etc.), but you can also provide more personalized information (for instance, you could warn your users that their registered credit card is about to expire).
  4. If there’s shipping, you should display the delivery address.
  5. Your user may have to forward the e-receipt for accounting purposes, so you should ease this workflow.
  6. You can insert marketing content to your receipt, such as a history of previous items or new promotions based on what your user just bought.
  7. If your website supports multiple languages, your emails should too.

Preview of the receipt email template


How to code a receipt email template: Over to Github!

Sounds like something you’re already doing? Or are you not sure how to implement some of these elements?

Worry not, we’ll tackle all these needs, and more, in our dedicated Github tutorial for coding email receipt templates with MJML.

On our Github tutorial you’ll find:

  • Detailed explanations.
  • Code samples to implement and adapt.
  • Examples of a receipt email and its different parts.

Ready to see it in action?

Time to jump over to Github.

Github tutorial: How to code a receipt email


Embrace Mailjet’s New Multi-Channel Experience With SMS API

Well, fellow API enthusiasts, we just launched something new that should get your attention. Something that pairs perfectly with email. Something that opens up new doors for an improved customer relationship. Something that we, as a transactional solution leader, needed to bring: Short Text Messaging!

Commonly known by the sweet name SMS, it’s one of the most efficient channels of communication that can boost your contact engagement!

As an API wizard, there are two main factors that you usually consider: how useful is this new integration, and how easy is it to implement? We take both these factors into account when developing API solutions, and so after months of hard work, here comes the newest one – our SMS API. This is a feature for those who love simple and effective APIs, allowing you to send SMS all around the world in just 5 lines of code!

Right now, this release is focused on transactional messages, but we aim to evolve these features with new components in the future. As a developer, if you see room for improvement and ways to collaborate with us, your feedback will help us make this feature even greater!


So, why is the SMS API useful to you?

Text messaging is one of the most impactful channels for direct communication. According to the Mobilesquared report, 90% of SMS are opened and read within 3 minutes after reception, and 72% of users are interested in receiving transactional SMS.

Given these figures, SMS sending presents a huge opportunity for businesses to engage with their clients.

For instance, you may want to increase security by enabling two-factor authentication for your users, send them useful notifications to increase customer engagement, or display payment confirmations on their phones to verify successful transactions. All of the above benefit from instant sending and a quick way of viewing the messages – and what is quicker than checking your phone to see the SMS you just received?


Any requirements before I start sending?

To send SMS messages, you need two things – funds in your SMS wallet and a Bearer token to authenticate your requests.

Token authentication is a different method from the one used for emails, but just as easy. Simply create your token in the front-end, then use the token value in the Authorization header of your payload. For security purposes we don’t keep the token values – once you create it, you need to copy it locally in order to use it.


Generate Bearer Token for SMS


Time for some code, don’t you think?

We’ve talked enough about the benefits of sending transactional SMS – it’s time to see how it’s done, and what else is possible with Mailjet’s SMS API!


Send your SMS

Sending an SMS message is done with a simple HTTP call on the /sms-send endpoint. The payload consists of a JSON body with 3 properties – To (recipient’s phone number), From (customizable sender ID) and Text (the message content).

Nothing to it, right?


Detailed Error and Success Payloads

In order to help you quickly find sending issues, we implemented strict checks on your input payload. This means you’ll get synchronous feedback on what went wrong, scaling down your debugging time. See the below example of an error payload:

The success reporting is also quite detailed, providing information about, among other things, the message sender and recipient, Status and Cost.


What about Statistics?

You can easily retrieve lists of SMS messages with an HTTP call on the /sms endpoint. You can filter by message delivery status, recipient’s phone number, time period etc.

The response will include a list of messages matching the conditions you have set with the filter values, starting from the most recently created one.

In case you only need the count of the messages, use the /sms/count endpoint instead, and the response will show the number of messages matching your filter settings.

You will also be able to export lists of messages using the /sms/export endpoint.


Where can I learn more?

See our dedicated SMS API Guide to learn how to use its capabilities. And, of course, take a look at the SMS API Reference or detailed information on the endpoints, properties and available filters.


What’s Next

Glad you asked. Sending transactional messages is just the first step into the SMS world and the beginning of a long series of awesome developments for Mailjet’s API users. Here’s what is on the agenda for the next few months:

  • Beyond Transactional: Additional features to the V1 will allow you to book your own short code for sending SMS and MMS, as well as enhanced tracking and statistics.
  • Marketing campaigns: By building bridges between emails and SMS to manage your contacts or your marketing campaigns, you will be able to engage your customers in a new yet more accurate multichannel experience.
  • Conversational Messaging: 2-way SMS or the possibility to retrieve responses to any SMS you send with us will establish the bedrock for any automated marketing, chat apps or bots.

Facilitated Collaboration And Advanced E-mail Template Management, New At Mailjet!

Ho, ho, ho… No, it’s not Christmas yet, but it’s easy to see why you might think so at Mailjet!

Have you been very nice this year? Probably, because today we have six gifts for you that you can unwrap under the tree (the tree being your Mailjet account – play along ;)).

We are proud to announce the arrival of a bunch of improvements and new features. In a few minutes, you will learn about everything you can now benefit from as soon as you next log in.

A more advanced collaboration with Mailjet

In order to prevent the back and forth in the steps leading to template publication, we have implemented features to let you take on the role of each of your team’s members.

  • 🎁 A lock to secure your favorite sections

Locked Sections

Set which employees can edit a template’s sections to protect the content or your design.

This feature is only available for Premium subscriptions.

  • 🎁 Advanced restrictions for better collaboration



Improve collaboration between your teams using advanced settings to define who has the right to block sections, manage your gallery or edit your templates.   

This feature is only available for Premium plans, on Crystal and above.

A more advanced template management

To prevent errors and make it easier to fix them, here are two new features that will put your mind at ease.

  • 🎁 Publication history to go back in time


Select the template of your choice and see up to five previous versions published, allowing you to go back to a previous version at any moment.  

  • 🎁 Draft status for your templates


Save changes to your templates without needing to publish them by using Draft mode. That way, you can work on your Marketing, Automated or Transactional email templates without affecting those already in production. Additionally, you can allow some members of your team to continue working on drafts without granting them the right to publish.

Better organization, effortlessly

Since we know that there is nothing greater than immediately finding what you’re looking for, these features let you gain precious time:   

  • 🎁 Advanced search to find things in the bat of an eyelash


In your gallery, you now have access to a search field that lets you find templates or template categories by simply typing the name, the desired language or the label of your choosing.


We also added a new scrolling menu to let you organize your templates the way you like. You can now sort them in alphabetical order, or by last modified or creation date.

  • 🎁 Labels to better organize your template gallery


You can now add labels to your templates to easily find them in your gallery using their color or apply a filter to group them together easily when you are searching for them in the search field.

This feature is only available for Premium subscriptions.

So, isn’t it time to go make a hot chocolate, set your computer on your lap(yes, using it as a heating pad is a well-known trick) and unwrap all your gifts?

Stay tuned – in the next few days, we will present these new features in greater detail so that you can get the most out of them.

Come meet us in person at Mailjet ! :)
While you wait, tell us what you think of your gifts on Twitter and who knows, maybe some new gifts will land under the tree before Christmas ;).

Send API 3.1 Reaches General Availability

We gave you a sneak peek a couple of months ago, but now we’re finally here. The time has come to say goodbye to our beloved Send API version 3, and unveil our most improved version,  v3.1!

Over the past three years, our Send API has been doing a great job at routing all your transactional emails, and thanks to your valuable feedback, we’re now ready to introduce its latest version, which is here to make your sending experience even better.

Ladies and gentlemen, after months of hard work and many valuable lessons learned from our developers community during its beta, Send API 3.1 is ready to become our official and stable version. Cue applause.

Don’t worry, we’ll continue to support Send API 3.0, but we’re sure you’re going to love v3.1!


So, why did we decide it was time for a new version?

Let’s be honest, no matter how much we enjoy finding hacks and workarounds, there’s not a developer out there that wouldn’t prefer a pain-free experience while at work. And yes, we know how painful API calls can get, especially when you combine little to no documentation with erratic behaviors, obscure input, response payloads…

So, to make your life easier and your work more manageable, we decided to focus on providing our users with a seamless Send API onboarding journey. We provide you with a complete documentation made by developers for developers, and meaningful payloads to offer a smooth experience.

And to make this new version even more advanced, with a real focus on performance and scalability, we decided to rebuild it entirely from scratch, moving away from our previous code in Free Pascal and opting for a new tech stack based on Golang, Cassandra and Kafka, to name a few. Sounds good, right?


Awesome! Show me the code, please?

The first thing you’ll notice is how much the onboarding user experience has improved in this new version. Want to see it in action? Check them out here:

Sending messages

Whether you’re sending one or more messages, it will be as simple as making a single HTTP call on the /v3.1/send endpoint. Send API will accept a JSON payload with a single Messages array property containing up to 100 messages. Clear and easy, isn’t it?

New detailed error and success payloads

Thanks to the feedback we received from our community, we decided it was time for a drastic improvement on our response payloads. We now perform strict checks on all your input payload, which means you’ll receive synchronous feedback about what went wrong, in order to cut down your debugging time. On our side, this also means a reduced number of malformed emails entering our system. Check out this example of an error payload.

Something worth noting is that these errors are generated for each message independently, and only the sending process of the failing messages will be blocked.

Our success reporting is also more detailed than it used to be. Success payloads provide, for instance, a MessageHref property, a URL that points to the API endpoint on which to retrieve the message metadata. Tracking your emails straight from the sending has never been easier.

Both success and error payloads are now sent together, in the same order followed by the input payload messages, to make checking the fail or pass status of your messages much easier.

URL Tagging

Sending emails fast, at scale is one side of the business, but being able to monitor how much they perform is critical. Our mission is to offer you all the tools you need to be able to achieve this. Thanks to Send API v3.1, you can now provide us with the proper tracking markers and we’ll make sure all the links your emails contain are properly tagged and report back to you.


Sandbox mode

Sending emails for development purposes comes with a cost (yeah, they still count towards your plan’s email quota), and you’re never fully protected from delivering undesired emails to your customers. Whether you’re experimenting with the API for the first time or just checking your code, there might be times when you’d like to test an email payload without having to send a real email. To make your life easier as a developer, we’ve incorporated a brand new sandbox mode. In your input payload, set SandboxMode to true. This will tell the Send API to process your messages as if you wanted to send them, without actually sending them, so you can properly test and troubleshoot your message easily!

Do you speak C#? Now, we do!

Are you a C# developer? .NET has no secrets for you? This announcement will please you! To help you leverage Mailjet APIs’ programmatic power for all your email campaigns, today we’re releasing a new wrapper dedicated to C#/.Net development, working on .NET Standard 1.1 (.NET Core 1.0 and .NET Framework 4.5).

Integrated with Visual Studio, VS Intellisense and the MSDN documentation, this new wrapper supports both the v3.0 and v3.1 APIs.

A world of APIs at hand

Following the same logic as our RESTful APIs, the C# wrapper will make you save a lot of time and complexity when it comes to managing API resources or sending emails. For instance, here’s how to make a call to the SendAPI with a few lines of code:

Is that all?

“That’s all?”, I hear you say. Quite simple, isn’t it? And the other REST actions aren’t any more complicated. But don’t take it at face value and have a look at the wrapper documentation for more detailed examples.

Tell me how to install it!

You can’t wait to use it already? To install this new wrapper, head over to its GitHub directory (under MIT License), or use NuGet package manager directly with the following command:

PM> Install-Package Mailjet.Api

That’s it! You’re all set, now go develop awesome C#/.NET applications with Mailjet! We’d love to hear more about your projects and listen to your feedback. Tell us what you think about this new wrapper on Twitter or contact us by email.

Mailjet's wrappers

Do you want to learn more about what Mailjet can offer you as a developer? Check out Mailjet for Developers and subscribe to our dev-only newsletter. Our Github account is also awaiting your visit, with lots of useful tools and plugins.

Templating Language + MJML: How To Code A Personalized Digest Email

Times flies! This is the last week of our new series of tutorial: for a month, we have shared with you how to create transactional emails templates step by step, using MJML, the open-source email framework with 5100+ ⭐ on Github, and Mailjet’s templating language.

To finish with a bang, we’ll end this series showing you how to implement an efficient personalized digest email.

Sending a digest email, a quick introduction

A digest email is a summary sent on a regular basis (daily or weekly, for instance). These emails convey information in a “digestible” way, mimicking paper publications such as the old popular Reader’s Digest. This format is fast and convenient to read and, therefore, very well received by users.

What will you need to code a digest email template?

Digest emails come in handy when you want to engage your users. In fact, their high frequency, the value they convey and the personalized touch are great advantages that tend to drive higher engagement. In this tutorial, we’ll mainly look at the three following points:

  1. How to loop over your data using our templating language’s “for” loops.
  2. How to personalize your email using variables.
  3. How to determine the frequency with which your reader opens your emails, using templating language built-in functions.

Here’s a quick preview of what it could look like:

A loop to display them all

A digest usually contains four kinds of data: a title, an image, a short description of the article and a link to the article. Sending a digest with only one article is very uncommon, so you’ll have to deal with an array of data. The best way to iterate over it and access every item’s object is to use templating language “for” loops.

Personalize all the things

Put yourself in your reader’s shoes for a minute.Do you feel your digest has been built expressly for you? Of course, it is composed of a curated list created by your backend algorithms, but is it enough to feel it’s dedicated to you only? When you send an email with Mailjet, you can use contact properties to tailor the message to the right reader, using the data you added for each contact. Combine them with templating language variables and you’ll be able to display your user’s data to make they experience really unique.

What, is it Monday already?

The frequency of an email digest template is key. You will have some everyday readers, and some who only open your digest once every few months. With our predefined templating language functions, you will be able to adjust your template based on the frequency of open and click events.

We bet you can’t wait to see it in action. So let’s jump over our step-by-step tutorial on Github.

We’ve also created an easy-to-execute tool, written with NodeJS, to test emails under actual conditions. To use it, you’ll just need valid credentials for both the MJML API and Mailjet’s Transactional Send API. Don’t worry if you’re a newcomer: applying to the MJML API beta and creating a Mailjet account are totally free.

Loved this one but have missed our previous tutorials? You should definitively have a look at those too, they are pretty cool:
How to create an e-commerce receipt email
How to send a welcome series email
How to deliver abandoned cart email

Do you want to be the first to know about our next tutorials? Subscribe to our dev-only newsletter now. And if you want to chat with us, come and say “hi” on Twitter.

Templating Language + MJML: How To Code An Abandoned Cart Email

If you’re a thorough follower of our tutorials, you may already know that, till the end of April, we’re showing you how to create and send awesome transactional emails step by step.

Today, we’re going to see how to implement an efficient abandoned cart email using MJML, the open-source email framework with 5100+ ⭐ on Github open-source email framework, and our templating language. Here’s a quick preview:

abandoned cart preview

Sending an abandoned cart email, a quick introduction

When a customer adds products to their cart but fails to check out, it doesn’t mean the sale is definitively over. Indeed, sending an email is a remarkably effective tactic to reduce your churn rate. Here are some numbers for you: 50% of abandoned cart emails are opened, and more than a third of them trigger clicks to redirect customers to the website.

This high rate can be easily explained: customers often abandon their carts without meaning to do so, be it because of website crashes or times out (sure, that never happens to yours), or simply because the buying process was overcomplicated. This is why an abandoned cart email can be a successful way to re-engage customers, guide them through to the last step in your buying process or allow them to recover lost purchases.

A proper abandoned cart email should include the following:

  1. the items left in the cart;
  2. an incentive, such as a discount or a special deal, personalised for your user;
  3. some new articles your user may prefer.

Let’s focus on these points.

Your user has abandoned its cart items. Clearly, this means they don’t want them anymore?

Well, not necessarily. You see, humans are complicated. They may have reconsidered their decision to buy first but, eventually decide that they do want to purchase after all.

You should enable them to resume their shopping experience, just where they left it. This implies that your email template should display the abandoned cart, just as it looks on your website, both in terms of design and in terms of the items left behind. Easy to say when you’re using the [name here any trendy JS framework], but how do you do this in an email? The solution: use our templating language loops and variables directly into your email to display a cart based on raw JSON data.

Oh, that didn’t seem that expensive!

Some customers abandon their carts because they initially thought your products were cheaper. What is it with all these taxes and shipping costs you’re adding to the final bill?
To win back these customers, the best way is to issue a discount or offer them free shipping, in the form of a deal that looks as if it was directly branded for them. To do this, add blocks to your template that only show up under specific conditions. In this tutorial, conditional blocks come to the rescue.

Now that I’ve got your attention, may I present you this other very cool product?

Abandoned cart emails can provide a nice opportunity to present other products. You surely have a nice algorithm for recommendations – use it to generate some JSON data and, with our templating language, display nice personalized blocks directly in your email.

Time to jump on Github

OK, enough theory. Now it’s time to write an awesome abandoned cart template yourself.

Have you missed the previous tutorials? Check them out here:
How to create an e-commerce receipt email
How to send a welcome series email

We’ve also created an easy-to-execute tool, written with NodeJS, to test emails under actual conditions. To use it, you’ll just need valid credentials for both the MJML API and Mailjet’s Transactional Send API. Don’t worry if you’re a newcomer: applying to the MJML API beta and creating a Mailjet account are totally free.

Do you want to be informed about the next tutorials? Subscribe to our dev-only newsletter or come and say “hi” on Twitter and join us for a chat.

Templating Language + MJML: How To Code A Welcome Email

Last week, we introduced you to our new series of tutorials: until the end of April, we will be showing you how to create and send awesome transactional emails step by step, using MJML, our 5100+ ⭐ on Github open-source email framework, and our templating language. Each tutorial covers a very common use-case, providing a large set of examples, code snippets, and nice visuals.

Today, we’re going to see how to implement an efficient welcome email. Here’s a quick preview:

email preview

Sending welcome emails – a quick introduction

We know you are an email veteran, and the double opt-in has no more secrets for you. So, during the signup process, you asked your user to confirm their email address. This verification step is now over. You can open yet another bottle of champagne, you have one true new user interested in your product. Congratulations.

But then you start to wonder. It could be that users browse your website right now, or come back later. And you know people. Chances are, they’ll have other things to do, they’ll forget and never come back.
So you need to grab their attention again. Why not use the valid email address they offered you willingly?

Welcome emails are indeed a powerful way to communicate because users are expecting them. When you enter a store as a consumer, you expect friendly greetings, useful information or good advice. While this behavior is common for most customers, that doesn’t imply they’re all the same. It is important to take your user’s tastes or habits into account, in order to create relevant messages. We can see you starting to panic: how many templates would you have to write?

Don’t freak out! Leveraging the power of our templating language, we will show you how to create a customized welcome series, using only a single template. In this tutorial, we will:

  1. Create blocks that display different elements according to your user data (location, gender… think segmentation!)
  2. Learn how to set a templating language variable and leverage it to display personalized data.
  3. Use templating language functions to transform text.

Ready to start writing an awesome welcome email template?
Time to jump over to Github.

We’ve also created an easy-to-execute tool written with NodeJS to test emails under real conditions. To use it, you’ll just need valid credentials for both MJML API and Mailjet Transactional Send API, but don’t worry if you’re a newcomer – applying to join the MJML API beta and creating a Mailjet account are totally free.

Do you want to be informed about the next tutorials? Subscribe to our dev-only newsletter today and ensure you’re up the first to know what’s on. And if you want to chat with us, come and say “hi” on Twitter.

Join The Party: MJML Just Turned One

Back in the day, email coding was such a nightmare… And then, one year ago, MJML happened. What was simply a very cool tool designed for our own product became a huge success when we decided to offer it to the open-source community. We’re very proud of what MJML has achieved in only one year, so we decided to throw a month-long online party. We’ve been celebrating with the community throughout February, but for those who missed it, here is a recap of what happened.

MJML turned one and we can’t stop celebrating

birthday mad girl

A 2016 retrospective (or what an awesome year we all had)

When we released MJML, we knew our product was addressing a real pain point., but nothing could have prepared us for this amazing growth. Adopted by the community at an incredible speed, MJML has been featured as a top trend on platforms such as Product Hunt and Github.

MJML numbers

To give you some numbers, MJML has been forked 329 times and is heading over 5000 stars on Github. NPM downloads are also impressive, exceeding 80,000 as of today. And these figures are still growing.

The hype is real. MJML now even has its dedicated tutorial on Smashing Magazine, the reference website for web developers and designers, and some would say it’s in its way to become the new standard for email coding. ;)

This success is really due to the amazing people around here who have supported MJML since the beginning. To thank the MJML community, we created a dedicated retrospective page featuring all the major events that took place last year, giving top billing to each of the MJML contributors. And this is just our first present.

Want to learn more about it? Check out our MJML birthday post on Medium.

lord of the ring

An API to rule them all

MJML itself is coded in JavaScript and relies on the power of React and Node.js. Until today, if you wanted to integrate MJML directly into your app, you had to run it on your own NodeJS server, and wrap your application logic around it. This wasn’t an overly complicated process, but, as usual, it’s always a matter of time and resources. The community was longing for something more straightforward, so we decided to create the MJML API. Our objective: to make the MJML engine free from any language or dependency. And what’s more agnostic than HTTP?

Let’s say you want to create your own drag and drop responsive email builder. You want to leverage the power of MJML (and we do encourage you to do so). All it takes to get responsive HTML is now a simple HTTP POST request to the MJML API. The data is shaped in a JSON representation, ready to be used by your application. Imagine the possibilities!

It’s not too late to test the MJML API, which is currently in public beta. Head over to and click on the big orange button “Join the beta”. The MJML API’s documentation could come in handy as you’re uncovering all of the new possibilities the MJML API can open up for you.

Want to get even more from MJML? Time to look at our third present. Learn more about integrating MJML in your app in this Medium post.


Bow ties Accordions are cool

2017 is clearly the year of interactivity in emails, and MJML is on its way to become the standard in what is already much more than a trend.

doctor who
Accordions, Doctor, accordions. There’s no mj-bowtie yet.

Indeed, even though email has been around for a while, it can still be very hard to get interaction tricks right, mostly because of the lack of standardization among email clients. Don’t fall into despair, though: MJML is here to fight by your side.

Last November, we released the very cool mj-carousel. You read it. A true interactive carousel. In an email. Yep.

Now, it’s a child’s play to display several images without lengthening your template, a feature that comes in handy when you have to present a product for instance. And because there’s never enough interactive components, allow us to introduce you to the mj-accordion.

mjml grandpa
Maybe not this one…

Because emails with a lot of content are generally a nightmare on mobile, mj-accordion comes in useful when you want to deliver a lot of information in a concise way. Content is stacked into tabs and users can expand them at will. If responsive styles are not supported (mostly on desktop clients), tabs are then unwrapped and your content is readable at once. Yep, you’re reading it right: adding a mj-accordion to your template is just a win-win situation.

Curious? Just try the mj-accordion live now.

star wars

On the road again

Last but not least, our fourth MJML present is, once again, more than a simple gift. Because online celebrating is cool, but nothing will replace human contact, the MJML team has decided to travel all around the world to meet the MJML community in the flesh.

Four events are planned in four different cities, Paris, New York, London and Berlin. The MJML team will organize meetups and conferences, with key speakers from within the email community. A lot of surprises await, so, if you don’t want to miss a thing, stay tuned by joining the MJML slack and following MJML twitter account.

Meanwhile, be sure to have a look at MJML’s ambitious roadmap for 2017. And, with MJML 4 coming soon as a full rewrite to improve performances and ease of use, the story’s still to be written.

MJML is going on tour! If you want to learn more about our global events, check out our post on Medium.


Any wishes for the future of MJML? Let’s continue the party on Twitter using the hashtag #MJMLBirthday.