送信メールの読みやすさを改善する2つの機能について、2回にわたって説明しています。前回は Markdown を使って、メール本文に見出しや箇条書きといった装飾を施す方法でした。今回はメール本文内に画像を埋め込む方法です。これらの機能を使えば内容をより理解しやすいメールを作成できます。
- 基本編: 固定のメール本文設定したメールを固定のアドレスに送信する
- 内容設定編: データ埋め込みを使用してメールの本文を変更する
- 宛先設定編: データ埋め込みを使用してメールの宛先を変更する
- HTML メール編: HTMLメールを送信する
- HTML メール Markdown編: マークダウンをHTMLに変換し、HTMLメールを送信する（前回）
- HTML メール 画像埋め込み編: メールに画像を設定し、HTMLメールを送信する（今回）
- 不達対応編: メールが届かない場合のトラブルシューティング
メール本文に画像を挿入する
Questetra Ver. 16.2 では、［メッセージ送信中間イベント（メール）］で送信されるメール本文に、画像を挿入できるようになりました。文章の途中に画像を表示できるので、より幅広いメールを作成できます。
これは ファイル型データ項目と、［メッセージ送信中間イベント（メール）］の［本文（HTML）］に短いコードを記述して実現します。
ファイル型データ項目
まず、アプリに［ファイル型データ項目］を用意します。ここではファイル名を「画像」、フィールド名を q_image と指定します。
メッセージ送信中間イベント（メール）設定
ファイル型に格納されている画像をメール本文に挿入するには、以下の2つの設定を行います。
1. ［本文（HTML）］に以下のコードをコピーする
<img src="cid:#{#q_image?.get(0)?.getId()}">
2． ［添付ファイル / インライン画像］の設定項目で、［インライン画像］を選択してドロップダウンから「画像」ファイル型データ項目を指定する
複数画像の挿入
上記のコードでは1つの画像のみ埋め込めます。2つ以上の画像を埋め込むには、画像ごとにコードを追加します。
複数の画像を埋め込むようにコードを設定した場合、想定した数の画像が添付されている必要があります。設定したコードの数に画像の数が満たないとエラーとなります。例えば［本文（HTML）］に3つの画像を埋め込むようにコードを設定している場合、エラーにならないためには3個の画像が添付されている必要があります。2つ以下ではエラーとなり、メールは送信されません。
複数の画像を挿入する場合のコードは以下です。
2つ目の画像
<img src="cid:#{#q_image?.get(1)?.getId()}">
3つ目
<img src="cid:#{#q_image?.get(2)?.getId()}">
以降、get(2) の括弧の中の数字を増やしていきます。
上記コードの「q_image」は、ファイル型データ項目のフィールド名です。ご自身で付与したフィールド名に置き換えてください。
インライン画像はプレーンテキストや Markdown テキストと同列に挿入されます。上記の設定例では、Markdown で記入してある「署名」データ項目も、［本文(HTML)］の末尾に追加しています。
以下のメール画面では、［メッセージ送信中間イベント（メール）］の［本文（HTML）］に設定されている順で、「議題/議事録」インライン画像、「署名」が表示されています。
まとめ
この記事では、メールの読みやすさを向上させる2つの重要な機能のうち、インライン画像について説明しました。画像を適切に挿入することで、メールがより魅力的でわかりやすくなります。
前回紹介したMarkdownの機能も活用することで、ビジネスや個人のコミュニケーションにおいて、よりプロフェッショナルで効果的なメールを作成できるようになります。ぜひ試してみてください。
