Synergy!LEAD

オリジナルHTML作成時の注意点は?

Synergy!LEADのフォーム機能には、入力・確認・完了・非公開画面のデザインを自由に編集できる「デザインカスタマイズ」機能を搭載しています。このページでは、書き換えていい箇所、書き換えていけない箇所、構造上必ず設置しなければならないタグなど、オリジナルHTML作成時の注意点を説明します。

1. テンプレートと項目

以下4点、ご注意ください。

  • 項目設定を完了してからテンプレートをダウンロードしてください。また、別のフォームで利用したオリジナルHTMLを、そのままコピーして他のフォームに適用することはできません。必ず該当フォームからダウンロードしたテンプレートを編集してください。
  • 入力項目として設定されている項目とその選択肢はHTMLに必ず掲載してください。当社「Synergy!クラウド」では、デザインカスタマイズ後のHTMLに記載の項目とフォームで設定された入力項目との間に過不足がないかをチェックしています。たとえば、「フォーム上の項目が不要だったため、HTMLを編集した際に消去した」場合、反対に「フォームに足りなかった選択肢をHTML上で作り足した」場合、項目(選択肢)に不一致があると判定してエラーとなります。
  • 項目の形式をHTML上で変更しないでください。たとえば、フォーム設定では「ラジオボタン型」になっている項目をHTML上で「プルダウンメニュー」に変更した場合もエラーとなります。
  • アップロードするオリジナルHTMLの文字コードは「UTF-8」にしてください。
    ※2016年4月20日以前に作成したオリジナルHTMLファイルの文字コードは、「Shift-JIS」のままとしてください。(参照ページ

2. 埋込タグ

ダウンロードしたHTMLファイルの中には、各画面に必要な入力項目のタグやエラーメッセージ用の「埋込タグ」などが記述されています。これらは削除しないでください。必要な「埋込タグ」がHTMLに記載されていない場合、HTMLアップロード時にエラーとなります。なお、各画面により、必要な埋め込みタグは異なります。埋込タグには以下の2種類があります。

  • <%%DUPERROR%%>
  • <%%ERROR**%> ※「**」部分には任意の半角数字が入ります。項目により異なります。

3. 設置が必要なタグ

以下、ファイル内に設置が必要なタグです。

  • <%%DUPERROR%%> ※埋込タグです。入力データがすでに登録済みだった場合のエラーを表示します。
  • <form method="post" ~ > ※どのフォームにデータを送信するかを指定します。
  • <%%ERROR**%%> ※埋込タグです。各項目の入力エラー時のメッセージを表示します。
  • 各入力項目 ※フォームに設定された項目です。※<input /> など項目の種別によってタグが異なります。

また、以下はHTMLサンプルです。

  • 黒字の部分:自由に編集できます。
  • 赤字の部分:フォームの挙動上、HTML上に必ず設置しなければならないタグです。
  • 青字の部分:上記の必要設置タグ(赤字部分)の中で、編集が可能な部分です。

フォームからダウンロードした直後のHTMLサンプル:

<html>
<head>
<title>オリジナルHTMLサンプル</title>
</head>
<body>

以下のフォームに必要な項目を入力のうえ、送信をクリックしてください。<br><br>

<%%DUPERROR%%>
<form method="post" action="/webapp/form/10000_xxx_1/setParameters.do" >

<p>
メールアドレス<br/>
<input type="text" name="singleAnswer(ANSWER1236)" size="50" />
<%%ERROR1236%%>
</p>

<p>
氏名<br/>
姓:<input type="text" name="singleAnswer(ANSWER1237-1)" size="10" />
名:<input type="text" name="singleAnswer(ANSWER1237-2)" size="10" />
<%%ERROR1237%%>
</p>

<p>
単一選択型(プルダウンメニュー)<br/>
<select name="singleAnswer(ANSWER1238)">
<option value="0">---お選びください---</option>
<option value="1">選択肢1</option>
<option value="2">選択肢2</option>
<option value="3">選択肢3</option>
<option value="4">選択肢4</option>
<option value="5">選択肢5</option>
</select>

<%%ERROR1238%%>
</p>

<p>
複数選択型<br/>
< table border="0"><tr><td>
<input type="checkbox" name="multiAnswer(ANSWER1239)" value="1"/>選択肢1
</td></tr><tr><td>
<input type="checkbox" name="multiAnswer(ANSWER1239)" value="2"/>選択肢2
</td></tr><tr><td>
<input type="checkbox" name="multiAnswer(ANSWER1239)" value="3"/>選択肢3
</td></tr><tr><td>
<input type="checkbox" name="multiAnswer(ANSWER1239)" value="4"/>選択肢4
</td></tr><tr><td>
<input type="checkbox" name="multiAnswer(ANSWER1239)" value="5"/>選択肢5
<input type="text" name="singleAnswer(ANSWER1239-5)" size="40" />
</td></tr></table>
<%%ERROR1239%%>
< /p>

<input type="submit" value=" 送 信 " >
<input type="reset" value=" リセット " >

</form>

</body>
</html>

4. 項目変更後のHTMLアップロード

フォームの項目を変更した後に「入力画面」のオリジナルHTMLファイルをアップロードせずにフォームを「公開」しようとするとエラーになります。
現在アップロード中のオリジナルHTMLを再度アップロードしてからフォームを「公開」してください。
選択肢項目の並び順の変更/削除を行った場合は、選択肢番号などが変わります。必ず、変更後のテンプレートHTMLをダウロードし、当該選択肢を現在アップロード中のオリジナルHTMLに反映してから再アップロードしてください。
(参考:選択リスト値を変更した場合のフォームへの影響

※「確認画面」にオリジナルHTMLを適用している場合はそちらの変更、アップロードが必要です。

メール配信

フォーム作成

Salesforce

仕様

ページのトップへ戻る