MjmlBundle
, (*1)
Bundle to use MJML 3 and 4 with Symfony >= 3., (*2)
Installation
Applications that use Symfony Flex
Open a command console, enter your project directory and execute:, (*3)
$ composer require notfloran/mjml-bundle
Applications that don't use Symfony Flex
Step 1: Download the Bundle
Open a command console, enter your project directory and execute the
following command to download the latest stable version of this bundle:, (*4)
$ composer require notfloran/mjml-bundle
This command requires you to have Composer installed globally, as explained
in the installation chapter
of the Composer documentation., (*5)
Step 2: Enable the Bundle
Then, enable the bundle by adding it to the list of registered bundles
in the app/AppKernel.php file of your project:, (*6)
// app/AppKernel.php
// ...
class AppKernel extends Kernel
{
public function registerBundles()
{
$bundles = [
// ...
new NotFloran\MjmlBundle\MjmlBundle(),
];
// ...
}
// ...
}
Renderer
For the moment only one renderer is available, the binary renderer., (*7)
Binary
Install MJML, (*8)
$ npm install mjml
Then you need to update the configuration:, (*9)
# config/packages/mjml.yaml
mjml:
renderer: binary # default: binary
options:
binary: '%kernel.project_dir%/node_modules/.bin/mjml' # default: mjml
node: '/Users/user/.nvm/versions/node/v10.16.0/bin/node' # default: null
minify: true # default: false
validation_level: skip # default: strict. See https://mjml.io/documentation/#validating-mjml
The node option is there for those who have problems with $PATH, see #35., (*10)
Custom
First you must create a class which implements NotFloran\MjmlBundle\Renderer\RendererInterface, then declare it as a service., (*11)
And finally you have to change the configuration:, (*12)
# config/packages/mjml.yaml
mjml:
renderer: 'service'
options:
service_id: 'App\Mjml\MyCustomRenderer'
PHP Config
If you're using symfony 5 and want to configure this bundle with PHP files instead of YAML:, (*13)
// config/packages/mjml.php
<?php declare(strict_types=1);
use Symfony\Component\DependencyInjection\Loader\Configurator\ContainerConfigurator;
return static function (ContainerConfigurator $configurator): void
{
$configurator->extension('mjml', [
'renderer' => 'binary',
'options' => [
'binary' => '%kernel.project_dir%/node_modules/.bin/mjml',
'minify' => true,
'validation_level' => 'skip'
]
]);
};
API
The bundle has no official integration with the MJML API., (*14)
You can create your own integration by using juanmiguelbesada/mjml-php and following this gist : https://gist.github.com/notFloran/ea6bab137be628f6a0c19054e08e6906., (*15)
Usage
Use "mjml" twig tag
{# mail/example.mjml.twig #}
{% block email_content %}
{% mjml %}
<mjml>
<mj-body>
<mj-section>
<mj-column>
<mj-image width="100px" src="https://mjml.io/assets/img/logo-small.png"></mj-image>
<mj-divider border-color="#F45E43"></mj-divider>
<mj-text font-size="20px" color="#F45E43" font-family="helvetica">
Hello {{ name }} from MJML and Symfony
</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>
{% endmjml %}
{% endblock %}
public function sendEmail(MailerInterface $mailer)
{
// The MJMl body is rendered by the mjml tag in the twig file
$htmlBody = $this->renderView('templates/mail/example.mjml.twig', ['name' => 'Floran']);
$email = (new Email())
->from('my-app@example.fr')
->to('me@example.fr')
->subject('Hello from MJML!')
->html($htmlBody);
$mailer->send($email);
// ...
}
Use "mjml" service
{# templates/mail/example.mjml.twig #}
<mjml>
<mj-body>
<mj-section>
<mj-column>
<mj-image width="100px" src="https://mjml.io/assets/img/logo-small.png"></mj-image>
<mj-divider border-color="#F45E43"></mj-divider>
<mj-text font-size="20px" color="#F45E43" font-family="helvetica">
Hello {{ name }} from MJML and Symfony
</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>
use NotFloran\MjmlBundle\Renderer\RendererInterface;
// ...
public function sendEmail(MailerInterface $mailer, RendererInterface $mjml)
{
$mjmlBody = $this->renderView('templates/mail/example.mjml.twig', ['name' => 'Floran']);
$htmlBody = $mjml->render($mjmlBody);
$email = (new Email())
->from('my-app@example.fr')
->to('me@example.fr')
->subject('Hello from MJML!')
->html($htmlBody);
$mailer->send($email);
// ...
}
SwiftMailer integration
❗ This integration is deprecated and will be removed in the next major version., (*16)
Declare the following service:, (*17)
NotFloran\MjmlBundle\SwiftMailer\MjmlPlugin:
tags: [swiftmailer.default.plugin]
Create a SwiftMailer message with a MJML body (without {% mjml %}) and with text/mjml as content-type:, (*18)
$message = (new \Swift_Message('Hello Email'))
->setFrom('send@example.com')
->setTo('recipient@example.com')
->setBody(
$this->renderView('mail/example.mjml.twig'),
'text/mjml'
);
$mailer->send($message);
The plugin will automatically render the MJML body and replace the body with the rendered HTML., (*19)
In the case where a spool is used: the MJML content is save in the spool and render when the spool is flushed., (*20)
License
MjmlBundle is licensed under the MIT license., (*21)
Wallogit.com
