![mjml validator mjml validator](https://miro.medium.com/max/1104/1*Nupf5d9tnyOBsx_paop-Gw.png)
Correct me if I'm wrong but I don't think that creating completely static email by hand is a super common scenario. 99% of systems using mjml will have some form of data binding in conjunction with mjml. I believe that it is a mistake for this project to maintain an unopinionated position about templating. The image on the right falls beneath the image on the left, stacking them into a column on Gmail for iOS as well as Inbox for iOS. I would expect the images to remain on the same line, and not break into a column, like so:
#Mjml validator code#
paste code into litmus and run browser previews.minify output using CLI or tool mentioned above.Replace image paths with my own, use correct width of image.Start with the mj-group example from the docs.Here is the relevant section of my code (non-minified):
![mjml validator mjml validator](https://miro.medium.com/max/1400/1*Nupf5d9tnyOBsx_paop-Gw.png)
I have exported my code minified using the CLI command mjml source.mjml -o output.html -config.minify as well as using this tool, which was recommended in a separate issue. Mj-group containing 2 columns with images breaks into a stacked column on Gmail for iOS.
![mjml validator mjml validator](https://work.ryanparag.com/static/c48c9b878006c965fe88eb5647a855ec/d9199/dl-error.png)
Proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Duis aute irure dolor in reprehenderit in voluptate velit esseĬillum dolore eu fugiat nulla pariatur. Quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodoĬonsequat. Tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod Work in that case (small texts in columns) : Proin rutrum enim eget magna efficitur, eu semper augue semper. Lorem ipsum dolor sit amet, consectetur adipiscing elit. mjmlconfig file (for custom components use)Īllows to use the config attribute from. Options for html minifier, see mjml-cli documentation for more info Preserve some tags when inlining css, see mjml-cli documentation for more info Functions must be (xml: string) => string Preprocessors applied to the xml before parsing. Path of file, used for relative paths in mj-includes Option to keep comments in the HTML outputĪvailable values for the validator: 'strict', 'soft', 'skip' You can pass optional options as an object to the mjml2html function: optionĭefault fonts imported in the HTML rendered by HTML Import mjml2html from 'mjml' /* Compile an mjml string */ const htmlOutput = mjml2html ( ` Hello World! `, options ) /* Print the responsive HTML generated and MJML errors if any */ console.