テンプレート機能の運用例のご紹介

佐藤（@awwa500）です。
Webアプリケーションにはつきもののユーザへのメール送信機能ですが、弊社プロダクトサイトでも、SendGridの様々な機能を活用してメール送信を行っています。今回は、この中からテンプレート周りの運用例をご紹介します。

これからアプリケーションにメール送信機能を実装しようとしている、もしくは既に実装済みだけどメールコンテンツの編集周りで悩んでいる、といった方のご参考になれば幸いです。

なお、今回対象とするのはいわゆる「トランザクションメール（SMTPまたはWeb APIで送信されるメール）」です。ユーザ登録、パスワードリセット、各種設定変更など、アプリケーション側の様々なイベントに応じて送信されるメールのことを指します。一斉配信系のマーケティングメール機能の運用についてはまたの機会にご紹介したいと思います。

SendGridのテンプレート機能

SendGridではLegacy TemplateとTransactional Templateの2種類のテンプレート機能が用意されており、これらを組み合わせることで柔軟なテンプレート運用が行なえます。

Legacy Template
HTMLメールのデザインを統一するために利用される機能です。Webポータルからテンプレートを登録して有効化しておくだけで、全てのトランザクションメールにテンプレートが適用されます。「Legacy」となっていますが、昔からあった機能という意味で、今でも現役の機能です。
Transactional Template
後から追加されたテンプレート機能です。「Legacy～」と違って、元々はテンプレートの編集管理作業とアプリケーションの実装を切り分けることを目的とした機能です。このため、複数種類のテンプレートを管理できるのと、それぞれバージョン管理できるのが特徴です。メール送信時にテンプレートを指定して使用します。

これまでの経緯

本プロダクトサイトを立ち上げた当初は、単純にサイトから送信するメールのデザインを統一する目的でLegacy Templateのみを利用していました。この当時は、メール送信時にアプリケーション側で本文を指定する作りになっており、業務フローの変更に伴う本文の修正の度にアプリケーションのデプロイが必要でした。はじめのうちはこのような構成でも問題なかったのですが、以下のような理由からTransactional Templateを導入することになりました。

送信するメールの種類が増えてきた
よりスピーディに業務フローの変更に対応する必要が出てきた

設定例

では、具体的な設定例をご紹介します。

Legacy Template

まずはLegacy Templateです。こちらの機能では、デザインを統一する目的でロゴやフッタなどのデザイン要素を登録しています。
Legacy Templateは「Settings > Mail Settings > Legacy Email Template」を有効化すると使えるようになります。

Legacy Template設定

こんな感じの枠だけが登録されているイメージです。実際の本文を挿入する位置には<% body %>タグを入れておきます。

Legacy Templateイメージ

Transactional Template

Transactional Templateでは、メールの種類毎（現在11種類）にテンプレートを登録しています。ポイントとしては、Transactional TemplateではHTML、Plain共にシンプルなテキストのみを登録し、デザイン的な要素（フォントのサイズや色など）を排除している点です。デザイン要素はLegacy Templateに集約して管理を一元化します。
また、メールの内容を変更する際は、新しいバージョンを追加して、テスト後にACTIVE設定を切り替えます。こうすることで、デプロイ作業が不要になり、メール本文の更新や切り戻しが簡単に行えます。
Transactional Templateは「Templates > Transactional」で設定します。

Transactional Template設定