フォームのスタイル設定について | Synergy! サポートページ

フォームのスタイル設定について

フォームのレイアウトやカラー、ヘッダ・フッタを設定します。

フォーム>フォーム管理>編集したいフォームの【編集】>フォーム編集画面から「スタイル設定」をクリックします。

オリジナルHTMLを利用してデザインカスタマイズを行った画面には、ここでの設定は適用されません。

デザインカスタマイズについての詳細は「デザインカスタマイズ」を参照してください。

スタイル設定
すべての画面に共通の、フォームのレイアウトやカラーを設定します。
PC向けで作成したフォームは、「旧スタイル設定はこちら」をクリックすると、旧スタイルが適用されます。
※旧スタイルとの比較表はこちらをご覧ください。

共通ヘッダ・フッタ
すべての画面に表示する、フォームのヘッダ・フッタを設定します。

スマートフォン対応(METAタグ挿入)
※携帯向けのフォームのみで表示されます。
iPhoneなどのスマートフォンにおける最適化表示の有無を設定します。

標準スタイル(PC向け)

標準スタイルと旧スタイルの違いは以下です。

  標準スタイル 旧スタイル
レスポンシブ対応※1 あり なし
レイアウトの変更 不可
※分割パターンを選択できます。
HTMLタグの利用
リセットボタン なし あり

※1 レスポンシブ対応とは、表示する端末ごとにWebページやWebサイトを最適な大きさで表示することです。

<標準デザイン見本>

①画面設定枠の各画面のメッセージ枠内へ以下のHTMLタグを設置すると、現在の進捗状況が表示されます。

<div id="step-set">
<ul>
<li class="step active">入力</li>
<li class="step">確認</li>
<li class="step">完了</li>
</ul>
</div>

activeは該当する画面のみに記入してください。
※「<」などの記号はすべて半角にして設置してください。

②各項目の表示名称へ以下のHTMLタグを設置すると、「必須」「任意」の画像が表示されます。※表示名称は、項目設計>各項目の編集より確認できます。

※各画像のHTMLタグは項目設計>各項目の編集>「必須判定」箇所にある「表示名称に必須(任意)マークを追加」ボタンをクリックすると自動追加できます。

<span class="icn-req-nodisp-err">必須</span>

<span class="icn-opt-nodisp-err">任意</span>

※「<」などの記号はすべて半角にして設置してください。



この記事へのご意見、ご指摘がございましたらご入力ください。
※ご入力内容への返信はできません。お問い合わせの場合はこちらからお願いします。
この記事は参考になりましたか?
参考になった参考にならなかった
読み込み中...