最終更新日：2019.06.10
公開日：2017.12.09

レシピ

Swift Mailer

Swift MailerでHTMLメールを送信する

PHPのメール送信ライブラリ「SwiftMailer」を使った、HTMLメールの送信方法について解説します。

この記事のポイント

SwitftMailerライブラリでHTMLメールを送る
画像を含めたHTMLメールを送る

Swift MailerでHTMLメールを送る

Swift Mailerライブラリを使うと、基本的なHTMLメールは簡単に送ることができます。

メール送信の基本的な部分については「Swift Mailerのインストール&メールを送信する」で解説した内容を使用します。

Swift Mailerライブラリの公式サイトはこちら。
Swift Mailer公式サイト(英語)

工数のかかるHTMLメール

HTMLメールは通常のテキスト形式と比べて、主に次のような手間がかかります。

デザイン
HTMLコーディング
主要なメーラーでの表示確認

メーラーによってHTMLメールの表示に誤差があるため、3つ目のメーラー表示確認作業は地味ですが大変な作業です。
しかし通常のテキスト形式よりも効果が上がりやすい(コンバージョンに繋がりやすい)という大きなメリットがあるため、ぜひ活用していきたいところ。

メールの中に画像を表示できることも、単調になりがちなテキスト形式よりも読んでもらいやすくなる利点があります。

基本的なHTMLメールを送る

まずはシンプルなHTMLメールを送ってみましょう。

swiftmailer.php

<?php
require_once 'vendor/autoload.php';

// 送信設定
$transport = new Swift_SmtpTransport('localhost', 25);
$transport->setUsername('username');
$transport->setPassword('password');

$mailer = new Swift_Mailer($transport);

// メール作成
$message = new Swift_Message();
$message->setSubject('HTMLメールのテスト');
$message->setFrom(['noreply@gray-code.com' => 'GRAYCODE']);
$message->setTo(['taroyamada@sample.com']);

// メール本文を作成
$message->setBody('<html>
<p>ちょっと休憩で<a href="http://www.starbucks.co.jp/" target="_blank">スターバックス</a>へ</p>
</html>', 'text/html');

// メール送信
$result = $mailer->send($message);

HTMLメールの中身は「// メール本文を作成」部分で指定しています。
試しに送ってみるということでhtmlタグ、pタグ、aタグのみ使用しました。

正常にメールが送信されると、指定した宛先へ次のようなメールが届きます。

正常に受信したメール例

リンクをクリックすると正常にスターバックスのサイトが表示されます。

上記コードの中でHTMLメールとして必須なものは、setBodyメソッドの第2パラメータで指定したContent-Type「text/html」です。
Content-Typeの指定があれば、本文はHTMLが含まれるものとして処理されます。

逆にContent-Typを指定しなかったり、「text/plain」として送ってしまうと、HTMLタグが全て通常のテキストとして処理されてしまうので注意してください。

Content-Typeを指定しなかった時のHTMLメール

スタイルシートを適用したHTMLメールを送る

続いて、もう少し実用的なHTMLメールを送信してみましょう。

実際にHTMLメールを送る場合はスタイルシートを適用する形がほとんどです。
しかし、HTMLメールはスタイルシートの外部読み込みができず、さらにstyleタグも使えないため、基本的にはインライン形式で指定する必要があります。

次のような表示となるHTMLをメールとして送信します。

もとのHTML

swiftmailer.php

<?php

--- 途中省略 ---

// メール本文を作成
$message->setBody('<html>
<body style="margin: 0; padding: 0; font-size: 100%; background: #f7f7f7;">
<div style="padding: 10px 0; text-align: center;">
<img src="'.$message->embed(Swift_Image::fromPath('images/logo.png')).'" alt="GRAYCODE" style="width: 100px; height: auto; vertical-align: top;">
</div>
<h1 style="margin-bottom: 50px; padding: 20px 0; width: 100%; color: #fff; font-size: 129%; font-weight: normal; letter-spacing: 0.2em; text-align: center; background: #2992e3;">PHPプログラミング</h1>
<p style="margin: 0 5% 50px; font-size: 100%; text-align: center; line-height: 1.6em;">多くのWebアプリケーション開発で使われているPHPプログラミングについて、<br>入門向けから実践に役立つ情報まで幅広く解説しています。</p>
<p style="margin-bottom: 50px; text-align: center;"><a href="https://gray-code.com/php/" style="display: inline-block; padding: 10px 20px; color: #3994e2; text-decoration: none; border: 2px solid #3994e2;">こちらから</a></p>
<p style="padding: 10px 5%; color: #fff; font-size: 79%; text-align: center; background: #555;">Copyright©2014 GRAYCODE.</p>
</body>
</html>', 'text/html');

// メール送信
$result = $mailer->send($message);

スタイルシートをインライン表記しているため、ソースがダダーッとわかりづらくなってしまっていますが、もとのHTMLは非常にシンプルです。

もとのHTML

<body>
<div class="header"><img src="images/logo.png" alt="GRAYCODE"></div>
<h1>PHPプログラミング</h1>
<p class="text1">多くのWebアプリケーション開発で使われているPHPプログラミングについて、<br>入門向けから実践に役立つ情報まで幅広く解説しています。</p>
<p class="btn"><a href="https://gray-code.com/php/">こちらから</a></p>
<div class="footer">Copyright©2014 GRAYCODE.</div>
</body>

ひと手間必要な画像の埋め込み

画像が必要なimgタグについては、通常のHTMLのままsrc属性で指定しても表示されません。

<img src="'.$message->embed(Swift_Image::fromPath('images/logo.png')).'" alt="GRAYCODE" style="width: 100px; height: auto; vertical-align: top;">

Swift_ImageクラスのfromPathメソッドで表示したい画像のパスを指定した上で、embedメソッドにオブジェクトを渡します。
今回はロゴ画像の1つだけですが、表示したい画像の数だけ同じ処理を記述してください。

Note

HTMLメールでは基本的にHTML5で当たり前のように使っているタグが未対応な点に注意してください。
headerタグやarticleタグなどはもちろん、画像についてもSVG形式は使用できません。

正常にHTMLメールが送信されると、メーラーでは次のような表示がされます。

Gメールでの表示例：

GメールでのHTMLメール表示例

Outlookでの表示例：

OutlookでのHTMLメール表示例

こちらの記事は役に立ちましたか？

ありがとうございます。
もしよろしければ、あわせてフィードバックや要望などをご入力ください。

コメントありがとうございます！
運営の参考にさせていただきます。