フォームの各種HTMLソースに関する解説を知りたい
最終更新日:2024年07月03日
フォーム機能では、作成したフォームのHTMLソースを編集することができますが、フォームが動作する上で編集削除不可のタグもあります。
ここでは、スパイラル特有のタグを中心に役割や編集削除不可のタグをご案内します。
例えば、フォームで入力した値が正しく引き継がれない、フォームが正しく動作しない場合などは、
必要なタグが不足している可能性がある為、下記を参照して設定中のHTMLソースをご確認ください。
入力ページ用HTML
フォームの入力ページ設定にて、「ソースデザイン」を選択している場合に使用します。
ソース編集時、編集/削除不可のタグを編集/削除してしまった場合は、入力ページ用HTMLの「デフォルトデザイン」または「設定デザイン」からダウンロードしたHTMLファイルを参考に修正ください。
（ソース例）
※【差し替えキーワード】部分にはDB作成時に設定した各フィールドの差し替えキーワードが入ります。
※以下の例はフォーム作成時にデバイスの種類を「マルチデバイス用フォーム」を選択した場合に生成されるソースです。
<!DOCTYPE html>
<html id="SMP_STYLE">
<head>
（１）<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title>入力フォーム</title>
<style type="text/css">SMP_STYLE
～～～～(中略）～～～～
</style>
</head>
<body class="body">
<center>
<div class="body_tbl">
<!-- SMP_TEMPLATE_HEADER start -->
（２）<!--SMP:DISP:REG:START-->
<p class="header_rmesg">必要事項をご入力の上、送信ボタンを押してください。</p>
<!--SMP:DISP:REG:END-->
（３）<!--SMP:DISP:ERR:START-->
<p class="header_emesg">ご入力内容に不備がございます。エラーが発生した項目を修正し、送信しなおしてください。</p>
<!--SMP:DISP:ERR:END-->
<!-- SMP_TEMPLATE_HEADER end -->
<!-- SMP_TEMPLATE_FORM start -->
（４） <form method="post" action="/regist/Reg2">
<div class="smp_tmpl">
<dl class="cf">
<dt class="title">
お名前
</dt><dd class="data ">
（５）<input class="input $errorInputColor:【差し替えキーワード】$" type="text" （６）name="【差し替えキーワード】" （７）value="$【差し替えキーワード】$" maxlength="64" >
<br>
<span class="msg">（８）$error:【差し替えキーワード】$</span>
</dd>
</dl>
</div>
（９） <input type="hidden" name="detect" value="判定">
<!-- HIDDEN_PARAM START -->
（１０） $form:hidden$ （１１）<input type="hidden" name="【差し替えキーワード】" value="$【差し替えキーワード】$">
<!-- HIDDEN_PARAM END -->
<input class="submit" type="submit" name="submit" value="送信">
</form>
<!-- SMP_TEMPLATE_FORM end -->
～～～～（中略）～～～～
</div>
</center>
</body>
</html>（１）<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
原則、編集削除不可。
文字コードについて詳細は「SPIRAL ver.1で使用可能な文字コード」をご確認ください。
（２）<!--SMP:DISP:REG:START-->
<p class="header_rmesg">必要事項をご入力の上、送信ボタンを押してください。</p>
<!--SMP:DISP:REG:END-->
フォームアクセス時および確認ページから入力ページに戻った時に表示されます。
「<!--SMP:DISP:REG:START-->」と「<!--SMP:DISP:REG:END-->」で囲まれた部分が表示される対象となります。
ページ内に複数設置することができます。
（３）<!--SMP:DISP:ERR:START-->
<p class="header_emesg">ご入力内容に不備がございます。エラーが発生した項目を修正し、送信しなおしてください。</p>
<!--SMP:DISP:ERR:END-->
入力エラー発生時に表示されます。
「<!--SMP:DISP:ERR:START-->」と「<!--SMP:DISP:ERR:END-->」で囲まれた部分が表示される対象となります。
ページ内に複数設置することができます。
（４） <form method="post" action="/regist/Reg2">
編集削除不可。
ファイル型フィールドを使用している場合、一部ソースが異なります。詳細はこちらをご確認ください。
（５）<input class="input $errorInputColor:【差し替えキーワード】$" type="text" name="【差し替えキーワード】" value="$【差し替えキーワード】$" maxlength="64" >
フォームの入力欄です。
（６）name="【差し替えキーワード】"
編集削除不可。
フォームで入力された値の格納先となるDBフィールドを指定するためのタグです。
（７）value="$【差し替えキーワード】$"
原則編集削除不可。
フォームで入力された値に差し替わります。
そのため、「$【差し替えキーワード】$」部分に任意の値を入力すると、入力欄にあらかじめ任意の値が入力された状態でフォームが表示されます。
（８）$error:【差し替えキーワード】$
編集不可。
エラーメッセージに差し替わります。
（９） <input type="hidden" name="detect" value="判定">
（１０） $form:hidden$
編集削除不可。
（１１）<input type="hidden" name="【差し替えキーワード】" value="$【差し替えキーワード】$">
フォームの使用フィールド設定にて「特殊入力：値を引き継ぐ（hidden）」に設定しているフィールドがある場合、このようなhiddenタグが組み込まれます。
例えば、マイエリア内に設置するフォームにて会員情報を引き継ぎたい場合等に使用します。
フォーム表示時、入力欄として表示されません。
外部設置用HTML（リモート用ファイル）
作成したフォームをスパイラル外のページ（自社コーポレートサイト等）に設置したい場合に使用します。
ソース編集時、編集/削除不可のタグを編集/削除してしまった場合は、外部設置用HTML＞リモート用ファイルの「デフォルトデザイン」または「設定デザイン」からダウンロードしたHTMLファイルを参考に修正ください。
詳しくは「フォームの「外部設置用HTML」とは何ですか？」をご確認ください。
（ソース例）
※【差し替えキーワード】部分にはDB作成時に設定した各フィールドの差し替えキーワードが入ります。
※以下の例はフォーム作成時にデバイスの種類を「マルチデバイス用フォーム」を選択した場合に生成されるソースです。
<!DOCTYPE html>
<html id="SMP_STYLE">
<head>
（１）<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title></title>
<style type="text/css">
～～～～(中略）～～～～
</style>
</head>
<body class="body">
<center>
<div class="body_tbl">
<!-- SMP_TEMPLATE_HEADER start -->
<!--SMP:DISP:REG:START-->
<p class="header_rmesg">必要事項をご入力の上、送信ボタンを押してください。</p>
<!--SMP:DISP:REG:END-->
<!-- SMP_TEMPLATE_HEADER end -->
<!-- SMP_TEMPLATE_FORM start -->
（２） <form method="post" action="https://XXXXXX.smp.ne.jp/regist/Reg2">
<div class="smp_tmpl">
<dl class="cf">
<dt class="title">
お名前
</dt><dd class="data ">
（３） <input class="input " type="text" （４）name="【差し替えキーワード】" value="" maxlength="64" >
<br>
</dd>
</dl>
</div>
（５） <input type="hidden" name="detect" value="判定">
<!-- 管理ID -->
（６） <input type="hidden" name="SMPFORM" value="lfqb-mdoepg-XXXXXXXXXXXXXXXXXXXXXXXX">
<input class="submit" type="submit" name="submit" value="送信">
</form>
～～～～（中略）～～～～
</div>
</center>
</body>
</html>（１）<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
原則、編集削除不可。
文字コードについて詳細は「SPIRAL ver.1で使用可能な文字コード」をご確認ください。
（２） <form method="post" action="https://XXXXXX.smp.ne.jp/regist/Reg2">
編集削除不可。
ファイル型フィールドを使用している場合、一部ソースが異なります。詳細はこちらをご確認ください。
（３） <input class="input " type="text" name="【差し替えキーワード】" value="" maxlength="64" >
フォームの入力欄です。
（４）name="【差し替えキーワード】"
編集削除不可。
フォームで入力された値の格納先となるDBフィールドを指定するためのタグです。
（５） <input type="hidden" name="detect" value="判定">
（６） <input type="hidden" name="SMPFORM" value="XXXX-XXXXXX-XXXXXXXXXXXXXXXXXXXXXXXX">
編集削除不可。
外部設置用HTML（マイエリア用ファイル）
作成したフォームをマイエリアや単票ページに設置したい場合に使用します。
ソース編集時、編集/削除不可のタグを編集/削除してしまった場合は、外部設置用HTML＞マイエリア用ファイルの「デフォルトデザイン」または「設定デザイン」からダウンロードしたHTMLファイルを参考に修正ください。
詳しくは「フォームの「外部設置用HTML」とは何ですか？」「マイエリアや単票にフォームを設置したい」をご確認ください。
（ソース例）
※【差し替えキーワード】部分にはDB作成時に設定した各フィールドの差し替えキーワードが入ります。
※以下の例はフォーム作成時にデバイスの種類を「マルチデバイス用フォーム」を選択した場合に生成されるソースです。
<!DOCTYPE html>
<html id="SMP_STYLE">
<head>
（１）<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title></title>
<style type="text/css">
～～～（中略）～～～
</style>
</head>
<body class="body">
<center>
<div class="body_tbl">
<!-- SMP_TEMPLATE_HEADER start -->
<!--SMP:DISP:REG:START-->
<p class="header_rmesg">必要事項をご入力の上、送信ボタンを押してください。</p>
<!--SMP:DISP:REG:END-->
<!-- SMP_TEMPLATE_HEADER end -->
<!-- SMP_TEMPLATE_FORM start -->
（２）<form method="post" action="https://XXXXXX.smp.ne.jp/regist/Reg2">
<div class="smp_tmpl">
<dl class="cf">
<dt class="title">
お名前
</dt><dd class="data ">
（３） <input class="input " type="text" （４）name="【差し替えキーワード】" （５）value="%val:usr:【差し替えキーワード】%" maxlength="64" >
<br>
</dd>
</dl>
</div>
（６） <input type="hidden" name="detect" value="判定">
<!-- 管理ID -->
（７） <input type="hidden" name="SMPFORM" value="%smpform:XXXXXXXXXXXXXXX%">
（８） <input type="hidden" name="【差し替えキーワード】" value="%val:usr:【差し替えキーワード】%">
<input class="submit" type="submit" name="submit" value="送信">
</form>
～～～（中略）～～～
</div>
</center>
</body>
</html>（１）<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
原則、編集削除不可。
文字コードについて詳細は「SPIRAL ver.1で使用可能な文字コード」をご確認ください。
（２） <form method="post" action="https://XXXXXX.smp.ne.jp/regist/Reg2">
編集削除不可。
ファイル型フィールドを使用している場合、一部ソースが異なります。詳細はこちらをご確認ください。
（３） <input class="input " type="text" name="【差し替えキーワード】" value="%val:usr:【差し替えキーワード】%" maxlength="64" >
フォームの入力欄です。
（４）name="【差し替えキーワード】"
編集削除不可。
フォームで入力された値の格納先となるDBフィールドを指定するためのタグです。
（５）value="%val:usr:【差し替えキーワード】%"
原則編集削除不可。
マイエリア内にて、DBに登録されている値を参照して表示させるためのタグです。
マイエリアを発行しているDBとフォームを発行しているDBが異なる等の理由で、編集を行う必要がある場合があります。
（６） <input type="hidden" name="detect" value="判定">
（７） <input type="hidden" name="SMPFORM" value="%smpform:XXXXXXXXXXXXXXX%">
編集削除不可。
（８） <input type="hidden" name="【差し替えキーワード】" value="%val:usr:【差し替えキーワード】%">
フォームの識別キーや認証キーに指定したフィールドなど、フォームの使用フィールド設定にて「特殊入力：値を引き継ぐ（hidden）」に設定しているフィールドがある場合、このようなhiddenタグが組み込まれます。
フォーム表示時、入力欄として表示されません。
確認ページ
フォームの確認ページ設定にて、確認ページ使用を「使用する」にしており、「ソースデザイン」を選択している場合に使用します。
ソース編集時、編集/削除不可のタグを編集/削除してしまった場合は、確認ページ用HTMLの「デフォルトデザイン」または「設定デザイン」からダウンロードしたHTMLファイルを参考に修正ください。
（ソース例）
※【差し替えキーワード】部分にはDB作成時に設定した各フィールドの差し替えキーワードが入ります。
※以下の例はフォーム作成時にデバイスの種類を「マルチデバイス用フォーム」を選択した場合に生成されるソースです。
<!DOCTYPE html>
<html id="SMP_STYLE">
<head>
（１）<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title></title>
<style type="text/css">
～～～（中略）～～～
</style>
</head>
<body class="body">
<center>
<div class="body_tbl">
<!-- SMP_TEMPLATE_HEADER start -->
<!-- SMP_TEMPLATE_HEADER end -->
<!-- SMP_TEMPLATE_FORM start -->
（２） <form method="post" action="/regist/Reg2">
（３） <input type="hidden" name="confirm" value="true">
<div class="smp_tmpl">
<dl class="cf">
<dt class="title">
名
</dt><dd class="data ">
（４） $【差し替えキーワード】$ <br> </dd>
</dl>
</div>
（５） <input type="hidden" name="detect" value="判定">
<!-- HIDDEN_PARAM START -->
（６） $form:hidden$
<!-- HIDDEN_PARAM END -->
（７）<input class="submit" type="submit" name="SMPFORM_BACK" value="戻る"> <input class="submit" type="submit" name="submit" value="送信">
</form>
～～～（中略）～～～
</div>
</center>
</body>
</html>（１）<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
原則、編集削除不可。
文字コードについて詳細は「SPIRAL ver.1で使用可能な文字コード」をご確認ください
（２） <form method="post" action="/regist/Reg2">
（３） <input type="hidden" name="confirm" value="true">
編集削除不可。
（４） $【差し替えキーワード】$
原則、編集削除不可。
入力ページで入力された値に差し替わります。
（５） <input type="hidden" name="detect" value="判定">
（６） $form:hidden$
編集削除不可。
（７）<input class="submit" type="submit" name="SMPFORM_BACK" value="戻る">
原則、編集不可。
「戻る」の文言を編集し変更することは問題ありません。
システムエラーページ
フォームのシステムエラーページ設定にて、「ソースデザイン」を選択している場合に使用します。
ソース編集時、編集/削除不可のタグを編集/削除してしまった場合は、システムエラーページ用HTMLの「デフォルトデザイン」または「設定デザイン」からダウンロードしたHTMLファイルを参考に修正ください。
（ソース例）
※【差し替えキーワード】部分にはDB作成時に設定した各フィールドの差し替えキーワードが入ります。
※以下の例はフォーム作成時にデバイスの種類を「マルチデバイス用フォーム」を選択した場合に生成されるソースです。
<!DOCTYPE html>
<html id="SMP_STYLE">
<head>
（１）<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title></title>
<style type="text/css">
～～～（中略）～～～
</style>
</head>
<body class="body">
<center>
<div class="body_tbl">
<!-- SMP_TEMPLATE_HEADER start -->
<!-- SMP_TEMPLATE_HEADER end -->
<!-- SMP_TEMPLATE_FORM start -->
<div class="smp_tmpl">
<div class="sub_text">
エラーが発生しました。<br>ブラウザを閉じ再度アクセスしてください。<br><br><br>（２）%val:error:code%: （３）%val:error:msg%
</div>
</div>
～～～（中略）～～～
</div>
</center>
</body>
</html>（１）<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
原則、編集削除不可。
文字コードについて詳細は「SPIRAL ver.1で使用可能な文字コード」をご確認ください。
（２）%val:error:code%
編集不可。
エラーコードに差し替わります。
コードの編集はできません。
（３）%val:error:msg%
編集不可。
エラーメッセージに差し替わります。
メッセージ内容の編集はできません。
注意事項
・本ページは、フォームの動作を保証するものではありません。
・編集削除不可のタグが全て存在しているのにフォームが正常に挙動しない場合は、フォームの設定内容や編集したソースが影響している可能性があります。
・編集削除不可のタグ以外においても、ソースの編集内容によってはデザイン崩れを引き起こしたりフォームが正常に動作しない場合があります。
・フォーム設定内容によってソース内に組み込まれるタグが異なることがあります。