カスタムテンプレートのよくある質問

自動返信・管理者通知のテンプレートで使える記法と注意点です。

カスタムテンプレートの基本的な使い方（入力値の埋め込み・条件分岐・複数選択の展開・使えるフィルタなど）はカスタムテンプレートの使い方をご参照ください。

テキストテンプレートとHTMLテンプレートがあるのはなぜですか?

HyperFormからメールを送信する際、マルチパートで送信されます。

メールを受信した人が使っているメールクライアントの設定で、HTMLメールを優先して表示するようになっていればHTMLメールが開かれ、そうでなければテキストメールが表示されます。

そのため、HTMLメールとテキストメールの両方の設定が必要です。

HTMLメールとテキストメールを同時に送信するマルチパートメールとは | SendGridブログ今回はメールの基本的な仕組み「マルチパートメール」※1についてご紹介します。マルチパートメールは添付ファイルの送信などにも使われる技術ですが、今回のテーマであるHTMLメールとテキストメールを同時に送信する際にも利用されます。 背景 サポート宛に以下のようなお問い合せをいただくことがあります。 SendGridには、宛先アドレスごとにテキストメールとHTMLメールを送り分ける機能はありますか？ お問い合せの背景として、例えば携帯電話向けにはテキストメールを送り、PC向けにはHTMLメールを送りたい、という要望があると考えられます。※2 解決方法 SendGridでは宛先に応じてメール本文の形式を送り分ける機能はありません。また、一般的なメールの世界でも、宛先に応じてメール本文の形式を送り分ける、といったことは通常は行いません。 ではどうするのかというと、冒頭でご紹介した「マルチパートメール」と呼ばれる形式を利用して本文にHTMLパートとテキストパート両方を指定したものを送信します。どちらを表示するかは受信側が選択します。HTMLパートを表示する機能がないメーラや、HTMLパートの表示を設定により禁止しているメーラなどではテキストパートを表示し、HTMLパートが表示可能なメーラはHTMLパートを表示します。 仕組み メールメッセージはヘッダとボディから構成される単純な構造をしています。ヘッダ部にはSubjectヘッダ（件名）や、Toヘッダ（宛先アドレス）、Fromヘッダ（送信元アドレス）など、いわゆるメッセージのメタデータに相当する情報が記載されます。一方、ボディ部にはメール本文の他、添付ファイルがテキスト変換された状態で記載されます。最も単純なテキストメールの場合、メッセージは以下のような構造となります。※3 ヘッダ部にあるContent-Typeヘッダの値「text/plain」がテキストメールであることを表しています。 一方、マルチパートメールは以下のような構造となります。 ヘッダ部にあるContentsendgrid.kke.co.jp

サイト訪問者が入力した値をメール本文に埋めこむにはどうすれば良いですか?

formのinput要素等のname属性の値を{{ }}で囲むことで、サイト訪問者が入力した値をメールに含めることができます。

例えば以下のようなformがあった場合

<form>
  <input type="text" name="お名前" />
  <input type="email" name="email" />
  <textarea name="お問い合わせ内容"></textarea>
  <button type="submit">送信</button>
</form>

以下のようにメール内に回答を埋め込むことができます。

お問い合わせありがとうございます
以下の内容で、お問い合わせを受け付けました。
----

お名前
{{ お名前 }}

メールアドレス
{{ email }}

お問い合わせ内容
{{ お問い合わせ内容 }}

----
引き続きよろしくお願いいたします。
テキストテンプレートの場合
<h1>お問い合わせありがとうございます</h1>
<p>以下の内容で、お問い合わせを受け付けました。</p>

<p>お名前：{{ お名前 }}</p>
<p>メールアドレス：{{ email }}</p>
<p>お問い合わせ内容：{{ お問い合わせ内容}}</p>

<p>引き続きよろしくお願いいたします。</p>
HTMLテンプレートの場合

同じ書き方で、「メール設定」画面の「メールの件名」「管理者向けメール件名」にもフォームの入力値を埋め込めます。

name属性にハイフンなどの記号を含む項目を埋め込むにはどうすれば良いですか?

name属性にハイフン（-）などの記号が含まれる場合、name属性の値をそのまま{{ }}で囲む書き方では埋め込めません。attribute(_context, 'name属性の値')という書き方を使ってください。

例えば以下のような項目があった場合

<select name="select-store">...</select>
例
{{ attribute(_context, 'select-store') }} → ⭕ 入力値が出力される
{{ select-store }} → ❌ 「0」が出力される

{{ select-store }}と書いた場合、ハイフンが引き算の記号として解釈されるため、入力値の代わりに「0」が出力されます。エラーにはならないため気づきにくい点にご注意ください。

この書き方は、メール本文のカスタムテンプレート（テキスト・HTML）とメールの件名（訪問者向け・管理者向け）で共通です。

なお、フォームのHTMLを変更できる場合は、name属性をアンダースコア区切り（例: select_store）にしていただくと、通常どおり{{ select_store }}と書けます。