テーマの編集画面のカスタマイズ（旧バージョン）

テーマの編集画面のカスタマイズ（旧バージョン）

テーマの編集画面では、影、透明度、色、パターンなどを使用して、企業や組織のイメージをフォームに反映できます。これにより、モバイルを含むあらゆるデバイスで見栄えが良いフォームを作成できます。フォームのすべての要素を細かくカスタマイズできるため、ブランドの個性を際立たせることができます。

フォームの外観をカスタマイズするには：

  1. フォームを作成後、［テーマ］タブに移動します。

  2. ［最初から作成する］または［Customize Form］（フォームのカスタマイズ）をクリックします。
    最初から作成するの画像

  3. ［フォームのカスタマイズ］では、以下の要素の外観をカスタマイズできます。

    1. フォーム

    2. サブフォーム

    3. 複数ページからなるフォームの各ページ

    4. お礼ページ

      フォームのカスタマイズの画像

フォームタブ

［フォーム］タブでは、以下の設定を行うことができます。



設定の手順について、それぞれ詳しく説明します。

フォームの背景のカスタマイズ

壁紙の追加

フォームの背景をカスタマイズしたり、フォームの各セクションごとに異なる背景を設定したりすることが可能です。必要に応じて、背景にパターンを設定したり、画像を使用したりすることができます。

パターンを背景に設定するには：
  1. ［フォーム］タブで、［背景］セクションのドロップダウンメニューから［壁紙］を選択します。
  2. ［背景の種類］の［パターン］から、パターンを選択します。
  3. ［色］を選択し、必要に応じて［透明度］を調整します。
フォームの壁紙の画像

画像を背景として設定するには：
  1. ［フォーム］タブで、［背景］セクションのドロップダウンメニューから［壁紙］を選択します。
  2. ［背景の種類］から［画像］を選択します。デスクトップから画像をアップロードするか、［Search from Unsplash］（Unsplashで検索する）をクリックして、Unsplashの高解像度画像を使用します。
  3. ［色］を選択し、必要に応じて［透明度］を調整します。

    壁紙として設定される画像の画像

バナーの追加

バナーは、製品の宣伝や、自社のブランドやサービスを知ってもらうのに役立ちます。フォームの上部のスペースに、自社のビジネスに合ったバナーを追加できます。 
バナーの画像

  1. デスクトップから画像をアップロードします。対応している画像形式は、JPG、JPEG、PNG、BMP、GIFです。 
  2. アップロード後に画像の配置を設定することも可能です。

フォームの要素のカスタマイズ

ボックスのカスタマイズ

［ボックス］とは、すべての項目やボタンを含むフォームの一部を指します。 

ボックスをカスタマイズするには：
  1. ［フォームのカスタマイズ］→［フォーム］タブの順に移動します。［ボックス］のドロップダウンメニューでは、レイアウト、枠線、角、配置、余白、影など、［ボックス］のさまざまな設定を行うことができます。
  2. ［ボックス］の背景の色、透明度、パターンを変更できるほか、枠線の太さ、スタイル、透明度、色、［ボックス］の角のデザインを設定できます。また、［配置］では、フォーム内での［ボックス］の配置を設定できます。


    必要に応じて、フォームの幅、［ボックス］間の間隔、影の効果もカスタマイズできます。

    フォームのカスタマイズの画像

ヘッダーのカスタマイズ  

  1. ［フォームのカスタマイズ］→［フォーム］タブの順に移動します。ドロップダウンメニューの［ヘッダー］では、ヘッダーの背景、枠線、角のデザイン、配置、フォームの幅、余白、影など、さまざまな機能を設定できます。
  1. ロゴの挿入 ： ブランドの認知度を高めるために、推奨される形式で自社のロゴをフォームのヘッダーとしてアップロードすることも可能です。 画像を挿入後、配置やサイズを調整できます。
ロゴの挿入の画像

フォームの本体のカスタマイズ               

フォームの本体とは、ボタンをのぞくフォームの入力項目で構成される部分です。



フォームの本体をカスタマイズするには、［フォームのカスタマイズ］→［フォーム］タブの順に移動します。ドロップダウンメニューから［本体］を選択し、要件に合わせてフォーム本体の機能を自由に変更できます。
  1. 背景、枠線、角のデザイン、配置、フォームの幅、余白、影などの設定も変更可能です。
  2. フォーム本体の背景の色、透明度、パターンを変更したり、フォーム本体の幅、スタイル、透明度、色を変更したりもできます。

項目のカスタマイズ

項目のボックス
項目のボックスとは、フォーム内の各項目を囲む部分を指します。



フォーム内の項目をカスタマイズするには、ドロップダウンメニューから［フォームのカスタマイズ］→［フォーム］タブの順に移動して、［項目］を選択します。
［項目のボックス］では、項目のボックスの背景、枠線、角のデザイン、余白をカスタマイズできます。また、項目のボックス内のテキストのフォントも変更できます。

項目のカスタマイズの画像

 

すべての項目
［すべての項目］では、項目のボックスの背景、枠線、角のデザイン、フォント、余白、影をカスタマイズできます。



セクション 
フォームに個別のセクションがある場合、セクションごとに背景、枠線、角のデザイン、フォント、余白などの設定をカスタマイズできます。

表形式の選択肢
フォームに［表形式の選択肢］項目がある場合、項目内の質問と回答の色、フォント、スタイル、フォントサイズをカスタマイズできます。

選択肢
選択肢形式の項目がある場合、項目内の選択肢の色、フォント、スタイル、フォントサイズをカスタマイズできます。

スタイルの選択
［スタイルの選択］では、［選択肢］項目内の［ラジオボタン］や［チェックボックス］のテンプレートのスタイルをカスタマイズできます。


評価、スライダー
フォームに［評価］／［スライダー］項目が含まれている場合、［評価］項目のスタイルやサイズの編集、枠線のカスタマイズ、項目の一部の選択状態（選択済み／未選択）に応じた色の選択が可能です。

複数選択
フォームに［複数選択］形式の問題が含まれている場合、項目内の選択肢の色、フォント、スタイル、フォントサイズをカスタマイズできます。

選択リスト

フォームに［選択リスト］項目がある場合、［選択リスト］のスタイルをカスタマイズできます。［選択リスト］のスタイルを設定し、［Type 2］のスタイルを使用することで、リスト内から必要な項目をすばやく見つけるための選択肢を追加できます。 

フッターのカスタマイズ 

フッターとは、フォーム内のすべてのボタンが配置されている部分を指します。［フォームのカスタマイズ］→［フォーム］タブ→［フッター］では、背景、枠線、角のデザイン、配置、フォームの幅、余白、影など、フッターのさまざまな機能をカスタマイズできます。

フォームのボタンのカスタマイズ

ボタンには、［送信］、［保存］、［確認］の3種類があります。［フォームのカスタマイズ］→［Button］（ボタン）→［幅］で、ボタンのラベルの幅をカスタマイズできます。
［送信］ボタンのセクションに移動すると、［送信］ボタンのラベルの背景、枠線、角のデザイン、フォント、配置、余白、影の設定を変更できます。

 送信ボタンのカスタマイズの画像


フォームに［保存］および［確認］ボタンがにある場合、それぞれのドロップダウンのメニューから機能を変更できます。

サブフォームタブ

フォームにサブフォームが含まれている場合は、必要に応じてサブフォームをカスタマイズできます。

サブフォームのボックス 

サブフォームをカスタマイズするには、［サブフォーム］タブに移動し、ドロップダウンメニューから［サブフォーム］→［ボックス］を選択します。
サブフォームのボックス

サブフォーム項目 

  1. ［サブフォーム］の項目をカスタマイズするには、［サブフォーム］タブでドロップダウンメニューを使用して、［項目］を選択します。［項目のボックス］では、［項目のボックス］の背景、枠線、角のデザイン、余白、フォントをカスタマイズできます。
  2. サブフォームに選択肢形式の項目がある場合、項目内の表示内容の色、フォント、スタイル、文字サイズをカスタマイズできます。
  3. ［スタイルの選択］の［選択肢］項目内の［スタイルの選択］で、テンプレートのスタイルを選択できます。
  4. サブフォームに［評価］項目が含まれている場合、［評価］項目のスタイルやサイズを編集したり、項目の一部の選択状態（選択済み／未選択）に応じた色を選択したりすることができます。
  5.  フォームに［複数選択］形式の設問が含まれている場合、項目内の選択肢の色、フォント、スタイル、文字サイズを編集できます。

ポップアップ形式のサブフォーム 

ポップアップ形式のサブフォームを選択している場合は、［Pop-up］（ポップアップ）→［Card］（カード）セクションで、背景、枠線、角などのポップアップの表示設定や、入力内容のフォントを編集できます。

ページタブ

ページ数の多いフォーム
ページ数の多い、長いフォームは、記入するのが退屈に感じられることがあります。フォーム内のページのデザインをカスタマイズして、ページ数の多い長いフォームを魅力的に仕上げましょう。
［フォームのカスタマイズ］の［ページ］タブでは、ページそのものをカスタマイズできるだけでなく、ページ上のページ移動ボタンといった細かい部分までカスタマイズできます。

ページのカスタマイズ

  1. 背景、枠線、角、配置、余白など、ヘッダーの機能をカスタマイズするには、ドロップダウンメニューの［ページ］の［ヘッダー］から行うことができます。
  2. 各ページのタイトル部分に表示される内容に使用されるフォント、色、スタイル、サイズは、［ページ］→［タイトル］から設定できます。
  3. フォームの閲覧済みページと未閲覧ページのフッターの番号や色は、［ページ］→［Number］（番号）セクションでカスタマイズできます。
    ページのカスタマイズの画像

ページ移動ボタンのカスタマイズ 

  1. ［ページ移動］の［Button］（ボタン）セクションでは、ページ移動ボタン（［次へ］／［戻る］）の背景、枠線、角、フォント、配置、間隔、影などの設定をカスタマイズできます。
  2. ページの閲覧状況を示すページ移動バーの色変更や、ページ内でのバーの配置間隔は、ドロップダウンメニューから［ページ移動］を選択して、カスタマイズします。

    ページ移動ボタンのカスタマイズ

お礼ページタブ

お礼ページでは、フォームの送信後に回答者を任意のページにリダイレクトし、お礼のメッセージを表示できます。［確認メッセージと移動先URL］の設定でお礼ページを設定したり、回答内容に応じて、異なるお礼ページに回答者をリダイレクトするようにフォームルールを設定したりすることができます。
お礼ページの外観は、必要に応じてカスタマイズできます。実行するには：

  1. フォームを作成後、［テーマ］タブに移動します。

  2. ［Customize Form］（フォームのカスタマイズ）をクリックします。

  3. ［Customize Form］（フォームのカスタマイズ）の［お礼ページ］タブで、お礼ページの［標準］のスタイルを［Custom］（個別指定）に変更します。

  4. お礼ページのテーマをフォームのカスタマイズに合わせて表示する場合は、［フォームのデザインを使用する］を選択します。選択すると、［ボックス］および［壁紙］のカスタマイズ設定がお礼ページに反映されます。

  5. お礼ページでは、壁紙、ボックス、ボタン、アイコンをカスタマイズできます。

壁紙：背景としてパターンや画像を設定できます。［色］を選択し、必要に応じて［透明度］を調整します。

ボックス：ボックスでは、背景、枠線、角、配置、余白、色、透明度、背景のパターンなど、ボックスに関するさまざまな機能を設定できます。また、ボックスの枠線や角について、幅、スタイル、透明度、色を変更することもできます。
ボタンとアイコン：お礼ページでは、ボタンの背景、枠線、角、フォント、余白、影、アイコンの枠線をカスタマイズできます。

お礼ページのカスタマイズ

フォームのカスタマイズに関するヒント

フォントの設定変更                                  

フォームの各セクションにあるテキストの要素のフォントの種類、サイズ、色を変更できます。
フォントの設定を変更するには：
  1. ［Form］（フォーム）、［サブフォーム］、［Page］（ページ）タブで、フォントの設定を変更するフォームの要素を選択します。
  2. ［Font］（フォント）をクリックします。
  3. テキストの要素をカスタマイズするには、色、フォントの種類、スタイル／太さ、文字サイズを選択します。

影の追加   

フォームに影の効果を追加することで、フォームをより魅力的にカスタマイズできます。
影を追加するには：
  1. ［Form］（フォーム）、［サブフォーム］、［Page］（ページ）タブで、フォントの設定を変更するフォームの要素を選択します。
  2. ［影］をクリックし、［影］の範囲と色を指定します。 

枠線の挿入    

フォーム全体やフォーム内の特定のセクション、送信ボタン、フォームのフッター／ヘッダー、セクション区切りなどに枠線を追加できます。
枠線を追加するには：
  1. ［Form］（フォーム）、［サブフォーム］、［Page］（ページ）タブで、枠線を追加するフォームの要素を選択します。
  2. ［枠線］をクリックし、枠線の幅、スタイル、色を変更し、透明度を調整します。 

配置の変更   

フォーム、フォームヘッダー、送信ボタンなどの配置を変更することができます。
配置を変更するには：
  1. ［Form］（フォーム）、［サブフォーム］、［Page］（ページ）タブで、配置を変更するフォームの要素を選択します。
  2. ［配置］をクリックし、必要な配置を設定します。

フォームの幅の変更    

フォームの幅は、必要に応じて調整できます。
フォームの幅を変更するには、［Form］（フォーム）タブの［Form］（フォーム）セクションにある［ボックス］を選択し、［フォームの幅］を選択します。
  1. フォームの幅を固定するには、［標準］を選択し、フォームの幅をピクセル単位で指定します。幅は320～1,200pxの間で入力します。
  2. フォームの幅を画面サイズに合わせて自動で調整するには、［画面に合わせる］を選択します。
「お礼ページ」のカスタマイズについては、こちらをご参照ください。