LaravelでHTMLメールに画像を埋め込む方法【embed()を使ってロゴを表示】
Laravelでは、Mailableクラスを使ってHTMLメールを簡単に送信できます。
しかし、HTMLメール内にロゴなどの画像を表示しようとすると「リンク先がブロックされて表示されない」という問題がよく起こります。
この記事では、embed() ヘルパを使って 画像をメール本文に直接埋め込む方法 を紹介します。
サンプル構成
|
1 2 3 4 5 6 7 8 9 10 |
app/ ├── Mail/ │ └── WelcomeMail.php resources/ ├── views/ │ └── mail/ │ └── welcome.blade.php ├── mail/ └── myservice-logo.png |
Mailableクラス側のコード
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<?php namespace App\Mail; use Illuminate\Bus\Queueable; use Illuminate\Mail\Mailable; use Illuminate\Queue\SerializesModels; class WelcomeMail extends Mailable { use Queueable, SerializesModels; public function build() { return $this->subject('Welcome to MyService') ->view('mail.welcome'); } } |
HTMLメール（Bladeテンプレート）
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<!-- resources/views/mail/welcome.blade.php --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> body { font-family: sans-serif; background-color: #f8fafc; color: #333; } .header { text-align: center; padding: 24px 0; } .content { background: #fff; padding: 24px; border-radius: 8px; max-width: 600px; margin: 0 auto; } .footer { text-align: center; color: #777; font-size: 13px; margin-top: 24px; } </style> </head> <body> <div class="header"> <img src="{{ $message->embed(resource_path('mail/myservice-logo.png')) }}" alt="MyService Logo" width="120"> </div> <div class="content"> <h1>Welcome to MyService!</h1> Thank you for registering. Please click the button below to set your password and start using your account. <p style="text-align:center;margin:24px 0;"> <a href="{{ $url }}" style="background:#0f4c81;color:#fff;padding:12px 24px;border-radius:6px;text-decoration:none;">Set Your Password</a> </p> </div> <div class="footer"> © {{ date('Y') }} MyService </div> </body> </html> |
embed() の仕組み
$message->embed()は、メール送信時に 画像をBase64エンコードして添付 し、本文内で<img src="cid:xxxx">として埋め込みます。resource_path('mail/myservice-logo.png')のようにresources/mail/フォルダに置くと整理しやすいです。- 外部URLで画像を読み込むよりも安全で、受信側でのブロックを回避できます。
画像が表示されない場合のチェックポイント
- メールクライアントがHTMLメールをブロックしていないか
- ファイルパスが正しいか（
resource_path()の中の階層） - 画像形式（png / jpg / gif など）が一般的なものか
まとめ
Laravelのメール送信では、$message->embed() を使うことで安全かつ確実に画像を埋め込めます。
ロゴやヘッダー画像を入れると、通知メールやサインアップメールが一気にプロダクトらしく見えるようになります。
📎 実際に使える例：
|
1 2 3 |
<img src="{{ $message->embed(resource_path('mail/myservice-logo.png')) }}" alt="MyService Logo"> |