テーマカスタマイズ(旧テーマビルダー)

テーマカスタマイズ(旧テーマビルダー)

お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。


影、透過度、色、パターンなどを組み合わせて、ビジネスに最適なフォームテーマを作成できます。フォーム内のすべての要素を細かくコントロールして、モバイルを含むあらゆるデバイスで美しく表示されるフォームをデザインし、ブランドを際立たせましょう。

フォームの見た目を好みに合わせてカスタマイズするには、
  1. フォームを作成した後、[Themes] タブに移動します。

  2. [Create from Scratch] または [Customize Form] をクリックします。
    Create from Scratch

  3. Form Customization では、次の見た目をカスタマイズできます。

    1. フォーム

    2. サブフォーム

    3. 複数ページフォーム内の各ページ

    4. サンクスページ

      Form Customization

Form タブ

[Form] タブでは、フォーム内の次の項目をカスタマイズできます。



それぞれの項目について詳しく見ていきます。

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

壁紙の追加

フォームの背景をカスタマイズし、フォーム内のセクションごとに異なる背景を設定できます。ニーズに応じて、パターンを設定するか、画像を背景として使用できます。

パターンを背景として設定するには、
  1. [Form] タブで、ドロップダウンの [Background] セクションから [Wallpaper] を選択します。
  2. [Background Type][Pattern] を選択し、使用するパターンを選びます。
  3. 色を選択し、必要に応じて不透明度を調整します。
Form Wallpaper

画像を背景として設定するには、
  1. [Form] タブで、ドロップダウンの [Background] セクションから [Wallpaper] を選択します。
  2. [Background Type][Image] を選択します。デスクトップから画像をアップロードするか、[Search from Unsplash] をクリックして Unsplash の高解像度画像を使用できます。
  3. 色を選択し、必要に応じて[Opacity] を調整します。

    Image Wallpaper

バナーの追加

バナーを使用すると、製品を宣伝したり、回答者にブランドやサービスに親しんでもらったりできます。フォーム上部のスペースに、ビジネスに合ったバナー画像を追加できます。
Banner

  1. デスクトップから画像をアップロードします。推奨される画像形式は JPG、JPEG、PNG、BMP、GIF です。
  2. アップロード後に、画像の配置(アラインメント)も設定できます。

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

コンテナのカスタマイズ

フォームコンテナは、すべてのフィールドとボタンを含むフォームの領域です。

フォームコンテナをカスタマイズするには、次の操作を行います。
  1. Form Customization > Form タブ > ドロップダウンの [Container] を開くと、コンテナの背景、枠線、角、配置、フォーム幅、余白、影など、さまざまな項目を変更するためのオプションが表示されます。
  2. コンテナ背景の色・不透明度・パターン、コンテナの枠線と角の幅・スタイル・不透明度・色を変更でき、[Alignment] オプションでフォーム内のコンテナの配置を制御できます。


    フォーム全体の幅、コンテナ間の余白、影の効果も、必要に応じてカスタマイズできます。

    Form Customization

ヘッダーのカスタマイズ  

  1. Form Customization > Form タブ > ドロップダウンの [Header] では、ヘッダーの背景、枠線、角、配置、フォーム幅、余白、影などをカスタマイズできます。
  1. ロゴの挿入 ブランド認知を高めるために、推奨形式のビジネスロゴをフォームのヘッダーとしてアップロードできます。 挿入後は、画像の配置やサイズを調整できます。
Insert Logo

ボディのカスタマイズ               

フォームボディは、ボタンを除くフォームフィールドが配置されている部分です。



フォームボディをカスタマイズするには、Form Customization > Form タブ > ドロップダウンの [Body] を開き、要件に合わせてボディの各項目を変更します。
  1. フォームコンテナと同様に、背景、枠線、角、配置、フォーム幅、余白、影などを変更できます。
  2. ボディ背景の色・不透明度・パターン、フォームボディの枠線と角の幅・スタイル・不透明度・色を変更できます。

フィールドのカスタマイズ

フィールドコンテナ
フィールドコンテナは、フォーム内の各フィールドの周囲にある領域です。



フォーム内のフィールドをカスタマイズするには、Form Customization > Form タブ > ドロップダウンの [Fields] に移動します。
[フィールドコンテナ] では、フィールドコンテナの背景、枠線、角、余白をカスタマイズできます。フィールドコンテナ内の文字のフォントも変更できます。

Field Customization

 

All Fields
[All Fields] オプションでは、フィールド入力ボックスの背景、枠線、角、フォント、入力欄の余白、影を一括でカスタマイズできます。



Section
フォーム内にセクションを分けている場合は、各セクションの背景、枠線、角、フォント、余白などをカスタマイズできます。

Matrix Choice
フォームに Matrix Choice フィールドがある場合、その質問と回答の文字色、フォント、スタイル、フォントサイズを設定できます。

Choices
同様に、選択式フィールドがある場合は、その選択肢の色、フォント、スタイル、フォントサイズを変更できます。

Choice Style
ラジオボタンチェックボックスの選択肢フィールドでは、選択肢スタイルオプションからテンプレートのスタイルを選択できます。


評価、スライダー
フォームに評価 / スライダーフィールドがある場合は、評価フィールドのスタイルやサイズ、枠線を編集し、選択時と未選択時の部分の色を設定できます。

複数選択
フォームに複数選択質問がある場合は、そのフィールド内の選択肢の色、フォント、スタイル、フォントサイズを編集できます。
フォームにドロップダウンフィールドがある場合は、ドロップダウンのスタイルを選択できます。ドロップダウンのスタイルをType 2に変更すると、リスト内から必要な選択肢をすばやく検索できる検索オプションを追加できます。 
フッターは、フォーム内のすべてのボタンが配置される部分です。[フォームのカスタマイズ] > [フォーム] タブ > [フッター] では、背景、枠線、角、配置、フォーム幅、余白、影など、フッターの各種項目をカスタマイズできます。


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

ボタンには次の 3 種類があります。 送信 保存  確認です。[フォームのカスタマイズ] > [ボタン] > [] から、ボタンラベルの幅をカスタマイズできます。
[送信] ボタンのセクションでは、送信ボタンラベルの背景、枠線、角、フォント、配置、余白、影を変更できます。

 Submit Button customizatio


フォームに 保存ボタンや 確認 ボタンもある場合は、それぞれのドロップダウンから、上記と同様の項目を変更できます。

サブフォームタブ

フォームにサブフォームがある場合、そのサブフォームも自由にカスタマイズできます。

サブフォームコンテナ 

Subformタブに移動し、ドロップダウンからSubform> Containerを選択して、サブフォームをカスタマイズします。
Subform Container

サブフォームフィールド 

  1. サブフォーム内のフィールドをカスタマイズするには、Subformタブ > ドロップダウンのFieldsに移動します。Field Containerでは、フィールドコンテナの背景、枠線、角、余白、フォントをカスタマイズできます。
  2. サブフォーム内に選択式フィールドがある場合、そのフィールド内の内容の色、フォント、スタイル、フォントサイズを変更できます。
  3. 選択式フィールドでは、ドロップダウンのChoice styleオプションでテンプレートのスタイルを選択できます。
  4. サブフォーム内にRatingフィールドがある場合、評価フィールドのスタイルとサイズを編集し、選択時と未選択時の両方の色を設定できます。
  5.  フォームにMultiple Choice質問がある場合、そのフィールド内の選択肢の色、フォント、スタイル、フォントサイズを編集できます。

ポップアップサブフォーム 

ポップアップサブフォームを使用している場合は、Pop-up> Cardセクションで、背景、枠線、角、コンテンツのフォントなど、ポップアップの各種設定を編集できます。

ページタブ

複数ページのフォームをお使いですか?
ページ数の多いフォームは、回答者にとって入力が退屈になりがちです。フォーム内の各ページの見た目をカスタマイズして、長い複数ページフォームでも興味を持って入力してもらいましょう。
Form Customization> Pageタブでは、ページ自体だけでなく、ページ上のナビゲーションボタンなど細かな部分までカスタマイズできます。

ページのカスタマイズ

  1. ページヘッダーの背景、枠線、角、配置、余白などの設定は、ドロップダウンのPage> Headerオプションでカスタマイズできます。
  2. タイトル内のコンテンツのフォント、色、スタイル、サイズを変更するには、Page>Titleで設定します。
  3. フォームのページフッターに表示される、訪問済みページと未訪問ページの番号や色は、Page> Numberセクションでカスタマイズできます。
    Page Customization
  1. ナビゲーションボタン(NextBack)の背景、枠線、角、フォント、配置、余白、影などの設定は、Navigation> Buttonセクションでカスタマイズできます。
  2. ページの閲覧状況を示すナビゲーションバーの色や、ページ内でのバーの余白は、ドロップダウンのNavigation> Barオプションでカスタマイズできます。

    Page Navigation Buttons Customization

サンクスページタブ

サンクスページは、フォーム送信後に回答者をリダイレクトし、送信完了を知らせるページです。サンクスページは、Acknowledgements & Redirectsで設定するか、フォームルールでリダイレクトを設定し、回答内容に応じて異なるサンクスページへリダイレクトすることもできます。
サンクスページの見た目も、用途に合わせてカスタマイズできます。設定するには、
  1. フォームの作成後、Themesタブに移動します。

  2. Customize Formをクリックします。

  3. Form Customization> Thank You pageタブで、サンクスページのDefaultスタイルをCustomに変更します。

  4. サンクスページのテーマをフォームのカスタマイズ内容と合わせたい場合は、 Use form design オプションを選択します。このオプションを選択すると、フォームコンテナと壁紙のカスタマイズがサンクスページにも適用されます。

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

Wallpaper:背景としてパターンまたは画像を設定できます。必要に応じて色を選択し、不透明度を調整します。

Container:コンテナの背景の色、不透明度、パターン、枠線や角の幅、スタイル、不透明度、色など、コンテナのさまざまな要素を変更できます。
Buttons & Icon:サンクスページ上のボタンの背景、枠線、角、フォント、余白、影、およびアイコンの枠線をカスタマイズできます。

Thank You Page customization

フォームカスタマイズのクイックヘルプ

フォント設定の変更                                  

フォーム内の各セクションにあるテキスト要素のフォントスタイル、サイズ、色を変更できます。
フォント設定を変更するには、
  1. FormSubform、またはPageタブで、フォント設定を変更したいフォーム要素を選択します。
  2. Fontをクリックします。
  3. フォントの色、フォントファミリー、スタイル/太さ、サイズを選択してテキスト要素をカスタマイズします。

影の追加   

フォームに影の効果を追加して、視覚的な印象を高めることができます。
影を追加するには、
  1. FormSubform、またはPageタブで、影の効果を追加したいフォーム要素を選択します。
  2. Shadowをクリックし、影の範囲と色を指定します。

枠線の追加   

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

配置の変更   

フォーム本体、フォームヘッダー、送信ボタンなどの配置を変更できます。
配置を変更するには、
  1. FormSubform、またはPageタブで、配置を変更したいフォーム要素を選択します。
  2. Alignmentをクリックし、必要な配置を設定します。

フォーム幅の変更   

必要に応じてフォームの幅を調整できます。
フォーム幅を変更するには、FormタブでFormセクションのContainerを選択し、Form Widthを選びます。
  1. 固定のフォーム幅を設定するには、Standardを選択し、フォームの幅をピクセル単位で指定します。設定可能な範囲は 320 px ~ 1200 px です。
  2. フォーム幅を画面サイズに自動で合わせるには、Fit to screenを選択します。
こちらから、サンクスページのカスタマイズについて確認できます。