{"id":38461,"date":"2017-07-07T09:19:15","date_gmt":"2017-07-07T14:19:15","guid":{"rendered":"http:\/\/webirix.com\/?p=38461"},"modified":"2017-07-07T09:33:47","modified_gmt":"2017-07-07T14:33:47","slug":"crea-correos-responsive-mjml-framework","status":"publish","type":"post","link":"https:\/\/webirix.com\/en\/crea-correos-responsive-mjml-framework\/","title":{"rendered":"Create Email Responsive with MJML Framework"},"content":{"rendered":"
\"mjml\"<\/div>\n
\n

MJML<\/strong><\/a>\u00a0is a framing language designed to make it easy to create responsive email templates. Its semantic syntax makes the code much easier and understandable, it is also component-based and has a library of common components for emails, which helps speed up development.<\/p>\n

The abstraction that MJML offers allows you to always be up to date with the standards and best practices of the industry, since it is constantly updated based on changes in the specifications of the mail clients, and this guarantees that it will always generate valid HTML code and optimized.<\/span><\/p>\n

Installation<\/h2>\n

MJML is written in\u00a0NodeJS<\/strong>\u00a0so to install it you only need to run the following command line in your terminal.<\/p>\n

npm i -g mjml\r\n<\/pre>\n
This will allow you to run MJML from any location.<\/p>\n
Create template<\/h2>\n
Once you have created your template with MJML you only need to run this command to convert it to a valid HMTL template.<\/p>\n
mjml -r template.mjml\r\n<\/pre>\n
You can also specify a different name for the resulting template.<\/p>\n
mjml -r template.mjml -o mail.html\r\n<\/pre>\n
If you don't want to be typing the command every time you make a change to see the result, MJML also allows you to observe and render each change.<\/p>\n
mjml -w template.mjml\r\n<\/pre>\n
Basic example<\/h2>\n
The following code is a basic example of a template with MJML code.
\nVisit the\u00a0documentation<\/a>\u00a0for more information.<\/p>\n
 \t\r\n \t\t \r\n\t\t\t\r\n \t\t\r\n \t\r\n \t\r\n \t\t\r\n \t\t\t\r\n \t\t\tEasy and Quick Responsive Discover\r\n        \r\n \t\r\n<\/pre>\n<\/div>\n
MJML is a framing language designed to make it easy to create responsive email templates. Its semantic syntax makes the code much easier and understandable, it is also component-based and has a library of common components for emails, which helps speed up development. The abstraction that MJML offers allows you to always be up to date with the standards and best practices of the industry, since it is constantly updated based on changes in the specifications of the mail clients, and this guarantees that it will always generate valid HTML code and optimized. Installation MJML is written in NodeJS so to install it you only need to run the following command line in your terminal. npm i -g mjml This will allow you to run MJML from any location. Create template Once you have created your template with MJML you only need to run this command to convert it to a valid HMTL template. mjml -r template.mjml You can also specify a different name for the resulting template. mjml -r template.mjml -o mail.html If you don't want to be typing the command every time you make a change to see the result, MJML also allows you to observe and render each change. mjml -w template.mjml Basic example The following code is a basic example of a template with MJML code. Visit the documentation for more information. Easy and Quick Responsive Discover<\/p>","protected":false},"excerpt":{"rendered":"
MJML is a framing language designed to make it easy to create responsive email templates. Its semantic syntax makes the code much easier and understandable, it is also component-based and has a library of common components for emails, which helps speed up development. The abstraction that ...<\/p>","protected":false},"author":24,"featured_media":38476,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2179],"tags":[],"class_list":["post-38461","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-frameworks"],"jetpack_featured_media_url":"https:\/\/webirix.com\/wp-content\/uploads\/2017\/07\/mjml.png","_links":{"self":[{"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/posts\/38461","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/users\/24"}],"replies":[{"embeddable":true,"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/comments?post=38461"}],"version-history":[{"count":1,"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/posts\/38461\/revisions"}],"predecessor-version":[{"id":38462,"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/posts\/38461\/revisions\/38462"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/media\/38476"}],"wp:attachment":[{"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/media?parent=38461"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/categories?post=38461"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webirix.com\/en\/wp-json\/wp\/v2\/tags?post=38461"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}