Group 2



Your components can be parsed as standard HTML or as MJML.

By default, we use the HTML parser.


MJML is a framework that looks somewhat like HTML, but is created to make creating responsive email templates much easier.

There are two ways to enable MJML parsing.

Using the API

To use the MJML API, you first need to obtain credentials.

Once you have the credentials, make sure to define them in the config file.


This requires a little more configuration.

  • First, set mjml.mode to node in the config file
  • Make sure Node and MJML (npm install mjml) are installed and the paths to node_binary and mjml.binary are configured correctly in the config file

Enable MJML in the editor

Make sure the Jeffreyvr\DropBlockEditor\Parsers\Mjml::class is added as a parser in your config file.

Also set an MJML-template as the base like so (where your-mjml-template is a reference to a blade template containing your mjml base template):

@livewire('dropblockeditor', [
    'title' => 'Your example campaign',
    'base' => 'your-mjml-template'


Parsing MJML does make the editor slightly slower compared to HTML. This is mainly because it relies on API response times or the Node process taking some time (depending on the mode you have configured).