コミュニケーションの主役は、電子メールからチャットアプリへと変わりつつありますが、マスプロモーションや保存性のある通知手段として、今でも電子メールは一定の役割を果たしています。
現在主流となっているほとんどのメーラはHTMLメールをサポートしており、HTMLタグとスタイルシートを組み合わせることでレスポンシブデザインをはじめとする高度な表現が可能となっていますが、ブラウザのHTMLとは違った独特の癖や制約があり、メール用のHTMLを直接コーディングすることは大きな苦痛を伴います。
今回紹介するLaravel MJMLというライブラリを利用することで、コンポーネント化されたタグを組み合わせるだけで、レスポンシブかつ洗練されたデザインのHTMLメールを簡単に送信することができます。
MJMLそのものの説明はこちら
https://mjml.io/
#前提条件
PHP7.1以上
Laravel 5.6以上
npmがインストールされていること
#Laravel MJMLライブラリのインポート
composer create-project --prefer-dist laravel/laravel nicemail "5.8.*"
cd nicemail
composer require asahasrabuddhe/laravel-mjml
php artisan vendor:publish
( Tag: laravel-mailを選択)
npm install --save mjml
#テスト用コマンドの生成
php artisan make:command MailTestCommand
#空のテンプレートを作成
touch resources/views/mail.blade.php
#設定ファイルを作成
touch config/mjml.php
下記の内容をコピー
(この手順は公式ページには記載がありませんが、私の環境ではこれを実行しないと動作しませんでした)
<?php
/**
* Configuration for Laravel MJML Package.
*/
return [
'auto_detect_path' => true,
/*
* The path to the MJML binary
*/
// 'path_to_binary' => '',
];
ここまで用意ができましたら、
にアクセスして、送りたいメールのレイアウトを作成します。
（特になければ、一旦デフォルトで表示されている内容そのままでもいいです）
作成したMJMLをコピーして、上で作成したmail.blade.phpに貼り付けます。
<mjml>
<mj-body>
<mj-section>
<mj-column>
<mj-image width="100px" src="/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 World</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>
#テストメールを作成
php artisan make:mail TestMail
上で作成したファイルに下記の内容をコピー
<?php
namespace App\Mail;
use Asahasrabuddhe\LaravelMJML\Mail\Mailable;
use Illuminate\Bus\Queueable;
use Illuminate\Queue\SerializesModels;
class TestMail extends Mailable
{
use Queueable, SerializesModels;
/**
* Create a new message instance.
*
* @return void
*/
public function __construct()
{
//
}
/**
* Build the message.
*
* @return $this
*/
public function build()
{
return $this->mjml("mail");
}
}
#実行用コマンドを作成
php artisan make:command MailTestCommand
<?php
namespace App\Console\Commands;
use App\Mail\PurchaseReportMail;
use App\Mail\TestMail;
use Illuminate\Console\Command;
use Illuminate\Support\Facades\Mail;
class MailTestCommand extends Command
{
/**
* The name and signature of the console command.
*
* @var string
*/
protected $signature = 'test:mail';
/**
* The console command description.
*
* @var string
*/
protected $description = 'MJML test';
/**
* Create a new command instance.
*
* @return void
*/
public function __construct()
{
parent::__construct();
}
/**
* Execute the console command.
*
* @return mixed
*/
public function handle()
{
Mail::to("changeme@example.com")->send(new TestMail());
}
}
("changeme@example.com"の部分は、ご自身のメールアドレスに変更してください)
上記設定後
php artisan test:mail
でコマンドを実行することで、"Test Mail"という件名のメールが送られるはずです。
変数埋め込み等Bladeの機能を利用することができるため、非常に強力かつ使いやすいライブラリだと思います。
HTMLメールを送る必要があるときは、ぜひ利用をご検討ください。