表示する端末ごとにWebページやWebサイトを最適な大きさで表示することをレスポンシブデザインと言います。
Synergy!ではフォームに下記いずれかの設定を行うことにより、レスポンシブ対応が可能です。
標準デザイン（新スタイル）はレスポンシブ対応しています。
1．標準デザイン（旧スタイル）を適用する。詳しくはこちらをご覧ください。
※PC向けで作成した場合のみ利用可
2．オリジナルHTMLデザインを適用し、レスポンシブ対応のHTMLタグを追加する。
詳しくは下記手順をご覧ください。
＜レスポンシブ対応イメージ図＞※スマートフォン(iPhone)での表示例
レスポンシブ対応の注意点
・スタイル設定の「分割パターン」は設定内容にかかわらず「分割なし」の形式
で表示します。
・フィーチャーフォン(ガラケー)の仕様により、表示に数秒かかる場合や表示で
きない場合、表示端末の容量によりページが切れてしまう場合があります。
【手順】
1．作成したフォームのオリジナルHTMLテンプレートをダウンロードします。
フォーム＞フォーム管理＞編集したいフォームの【編集】＞フォーム編集画面から「画面設定」の各画面設定より【設定】＞「デザイン選択」で「オリジナルHTMLを適用する」を選択します。
【テンプレート(標準デザイン)を取得】をクリックし、オリジナルHTMLテンプレートをダウンロードします。
2. テキストエディタ等でダウンロードしたテンプレートのHTMLソースを表示し、下記PDFファイルを参考に修正します。
※PDFファイルをクリックしてブラウザで表示し、必要な箇所をコピー＆ペーストしてご利用ください。
（画像をクリックして表示）
3．修正したHTMLファイルをアップロードします。
オリジナルHTMLアップロードの【参照】ボタンより修正したHTMLファイルを呼び出し【アップロード】ボタンをクリックします。
上記手順を、確認画面や完了画面などの各画面にも設定してください。
オリジナルHTMLにあまり詳しくない方は以下の設定でスマートフォンでの表示を最適化することができます。（レスポンシブデザインではありません。）
※標準デザインはレスポンシブに対応しています。旧スタイルをご利用の際にお使いください。
【携帯向けフォームの場合】
フォーム編集画面 ＞ スマートフォン対応（METAタグ挿入）の設定を「利用する」に変更
【PC向けフォームの場合】
フォーム編集画面 ＞ METAタグ挿入の入力枠へ以下のタグを設置
※この方法は、フォームの表示幅をスマートフォン用に一定の大きさにします。表示端末の画面幅により多少の表示ズレが起きます。
・ここでご紹介しているレスポンシブ対応は、フォーム機能のフォームを対象としています。デザインカスタマイズ機能を持たないアンケート機能等には適用できません。
・携帯端末には様々な仕様を持つ機種が存在するため、表示する機種によっては動作しない場合があります。
・オリジナルHTMLの記述方法についてはサポートの対象外としております。
こちらでは活用例のご紹介を目的としており、個別の案件に対応するためのオリジナルHTMLの記述方法についてのご質問は承りかねますのであらかじめご了承ください。
・お持ちのフォームにすでにオリジナルHTMLを使ったデザインカスタマイズを行っている場合には、こちらにご紹介したHTMLタグがフォームに影響を及ぼす可能性もあります。十分に動作検証を行ってください。
読み込み中...