Skip to content
This repository has been archived by the owner on Jul 20, 2022. It is now read-only.

mjml-aspnetcore/mjml-aspnetcore

Repository files navigation

mjml-aspnetcore

Nuget NuGet version

MJML is a responsive email templating system. You can find more information on MJML here: https://mjml.io/. Current Version: 4.6.3

As of v1.3.0, Mjml-AspNetCore uses Jering.Javascript.NodeJS (https://github.com/JeringTech/Javascript.NodeJS) to invoke NodeJS.

A render script has been bundled and will call the MJML renderer and return the compiled script.

var prehtml = "<mjml><mj-body></mj-body></mjml>";
var result = await _mjmlServices.Render(prehtml);

You can also use JSON instead of XML, as described here: https://mjml.io/documentation/#using-mjml-in-json

var view = 
@"{
    tagName: 'mjml',
    attributes: {},
    children: [{
        tagName: 'mj-body',
        attributes: {},
        children: [{
            tagName: 'mj-section',
            attributes: {},
            children: [{
                tagName: 'mj-column',
                attributes: {},
                children: [{
                    tagName: 'mj-image',
                    attributes: {
                        'width': '100px',
                        'src': '/assets/img/logo-small.png'
                    }
                },
                {
                    tagName: 'mj-divider',
                    attributes: {
                        'border-color' : '#F46E43'
                    }
                }, 
                {
                    tagName: 'mj-text',
                    attributes: {
                        'font-size': '20px',
                        'color': '#F45E43',
                        'font-family': 'Helvetica'
                    },
                    content: 'Hello World'
                }]
            }]
        }]
    }]
}";
var result = await mjml.RenderFromJson(view);

You can add dependancy support in your startup.cs file like this:

// add render services
services.AddMjmlServices(o =>
{
    if (Environment.IsDevelopment())
    {
        o.DefaultKeepComments = true;
        o.DefaultBeautify = true;
    }
    else
    {
        o.DefaultKeepComments = false;
        o.DefaultMinify = true;
    }
});