テンプレートの作成と編集

メールテンプレートは、異なるメールクライアントやモバイル環境でも意図したとおりに表示されるよう作成する必要があり、HTMLやCSSの知識も必要になります。 技術に詳しい人がいない場合、フロントエンドやテンプレート周りの担当エンジニアをアサインした方が良いでしょう。 また、実際にメールを送信する前のテストには、Litmusのようなレンダリングアプリケーションを活用されることをお勧めします。

現在のところ、1アカウントで作成できるのは 300テンプレート、300バージョン までです。

Dynamic Templateは、アカウント(またはサブユーザ)ごとに独立しています。親アカウントで作成したテンプレートにサブユーザからアクセスするといったことはできません。

テンプレートの作成

  1. Email API > Dynamic Templatesを選択し、画面右上にあるCreate a Dynamic Templateをクリックします。
  2. テンプレート名を入力してCreateをクリックします。

  3. テンプレート名をクリックしてAdd Versionを選択します。

  4. テンプレート作成のベースとなるデザインを選択します。
    利用するテンプレートにカーソルをあわせて、Selectをクリックします。

    • Your Email Designs:ユーザが作成したテンプレート
    • SendGrid Email Designs:SendGridが用意したテンプレート
  5. エディタを選択し、Selectをクリックします。

    • Design Editor:WYSIWYGエディタでの編集
    • Code Editor:HTMLコードでの編集

 エディタが表示されます。テンプレートの件名や本文はここで編集できます。

HTMLテンプレートの編集

メジャーなメールアプリケーションの中にはテーブルレイアウトしか読み込めないものがあるため、テンプレートはインラインまたはヘッダースタイルのテーブルベースのHTMLにするのが無難です。

作成済みのテンプレート名をクリックもしくは縦三点リーダ(︙)からEditを選択すると編集画面が表示されます。バージョンを追加したい場合は、Add Versionから行えます。編集が完了したらSaveをクリックします。

また、Dynamic Template では、項目名を {{ }} で囲んだタグを使うことができます。これらのタグはメールを送信するときにAPIから渡される動的コンテンツで置き換えられます。

テンプレートのプレビュー

テンプレートを編集したら、意図した通りに表示されることを確認しましょう。

  1. テンプレートの縦三点リーダ(︙)をクリックします。
  2. Previewを選択すると、HTMLメール(PC)、HTMLメール(モバイル)、テキストメールの3種類のプレビューを確認できます。

テンプレートの編集中にPREVIEWモードに切り替えることでもプレビュー表示を確認できます。

テスト送信

プレビュー機能で表示確認したらテスト送信を行い、実際に受信して表示を確認しましょう。テンプレートを有効化する前には必ずテストすることをお勧めします。

  1. テンプレートの縦三点リーダ(︙)からEditを選択します。

  2. 編集画面が表示されるので、SettingsタブのTEST YOUR EMAILを選択します。

  3. テスト送信の宛先を指定して、Send Test Messageをクリックすると、テストメールが送信されます。

レイアウトやフォーマットについてはこのテストメールで表示を確認できますが、Substitution Tag は置換されませんのでご注意ください。

テンプレートの有効化

テンプレートをActiveにする方法

  1. Activeにしたいバージョンの縦三点リーダ(︙)をクリックします。
  2. Make Activeを選択します。

1つのテンプレートで有効化できるバージョンは1つだけです。新しく作成したバージョンでメールを送信するには、そのバージョンをActiveにする必要があります。

テンプレートの複製

テンプレート内の特定のバージョンを複製する方法

  1. 複製元バージョンの縦三点リーダ(︙)をクリックします。
  2. Duplicateを選択します。

「“Copy of ” + 複製元のバージョン名」という名前で複製されます。複製されたバージョンはActiveではないため、必要に応じてActiveに変更してください。


配下のバージョンを含むテンプレート全体を複製する方法

  1. 複製元テンプレートの縦三点リーダ(︙)をクリックします。
  2. Duplicateを選択します。

  3. 必要に応じてテンプレート名を編集し、Duplicateをクリックします。

デフォルトで表示されるテンプレート名は「“Copy of ” + 複製元のテンプレート名」です。
テンプレート配下にあるバージョンは「“Clone: ” + 複製元のバージョン名 + 日付」という名前で複製されます。

配信停止タグ

受信者がメールを配信停止するためのリンクを挿入するには、Substitution Tagsを使います。これにより、受信者は以下の操作を行えるようになります。

  • 当該グループのメールのみ配信停止する
  • 全てのメールを配信停止する
  • 購読管理を行う

グループごとに配信停止できるようにするには、使用するUnsubscribe Groups(配信停止グループ)をメールの送信時に指定しておく必要があります。
SMTP経由でメールを送信する場合は、X-SMTPAPIヘッダにグループIDを追加してください。
Web API経由でメールを送信する場合は、mail.send の呼び出し時にx-smtpapiパラメータにグループIDを追加してください。

Manage Email Preferences(購読管理用のリンク)を挿入する場合は、購読管理画面に表示する配信停止グループも指定する必要があります。

詳しくは、APIリファレンスをご参照ください。

グループIDは、以下のいずれかの方法で確認できます。

当該グループのメールのみ配信停止する

メールの本文中に <%asm_group_unsubscribe_url%> タグを入れておくと、そのタグは “Unsubscribe From This List” というテキストに置換されます。受信者がこのリンクをクリックすると、当該配信停止グループのメールが配信停止(Group Unsubscribe)されます。

全てのメールを配信停止する

メールの本文中に <%asm_global_unsubscribe_url%> タグを入れておくと、そのタグは “Unsubscribe From All Emails” というテキストに置換されます。受信者がこのリンクをクリックすると、全てのメールが配信停止(Global Unsubscribe)されます。

配信設定を変更する

メールの本文中に <%asm_preferences_url%> タグを入れておくと、そのタグは “Manage Email Preferences” というテキストに置換されます。 受信者がこのリンクをクリックすると購読管理ページが表示され、どのグループのメールを受け取るかを受信者自身が選択することができます。