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

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

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


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



フォームの見た目を好みに合わせてカスタマイズするには、

Customize themes

  1. フォームの作成が完了したら、テーマ タブに移動します。

  2. 最初から作成 または フォームをカスタマイズ をクリックします。

    Create from Scratch

  3. フォームのカスタマイズ では、次の見た目を変更できます。

    1. フォーム

    2. サブフォーム

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

    4. サンクスページ

      Form Customization

フォームタブ

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



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

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

壁紙の追加

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

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

画像を背景として設定するには、
  1. フォーム タブで、ドロップダウンの[背景] セクションから[壁紙] を選択します。
  2. [背景の種類] [画像] を選択します。パソコンから画像をアップロードするか、[Pixabay から検索] をクリックして、Pixabay の高解像度画像を使用できます。

    Choose background from Pixabay
  3. 色を選択し、必要に応じて[不透明度] を調整します。

    Image Wallpaper

バナーの追加

バナーを使用すると、商品を宣伝したり、回答者にブランドやサービスを認知してもらうことができます。フォーム上部のスペースに、組織に合ったバナーを追加できます。

Banner

  1. パソコンから画像をアップロードします。推奨される画像形式は JPG、JPEG、PNG、BMP、GIF です。
  2. アップロード後に、画像の配置も設定できます。

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

コンテナ

フォームコンテナは、すべての項目とボタンが含まれているフォームの領域です。


フォームコンテナをカスタマイズするには、次の手順を実行します。
  1. [フォームのカスタマイズ] > [フォーム] タブ > ドロップダウンの[コンテナ] で、背景、枠線、角、配置、フォーム幅、余白、シャドウなど、フォームコンテナの各種設定を変更できます。
  2. コンテナ背景の色・不透明度・パターン、コンテナの枠線および角の幅・スタイル・不透明度・色を変更でき、[配置] オプションでフォーム内のコンテナの配置を制御できます。


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

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

本文               

フォーム本文は、ボタンを除くフォーム項目で構成されるフォームの部分です。



フォーム本文をカスタマイズするには、[フォームのカスタマイズ] > [フォーム]タブ > ドロップダウンの[本文]に移動します。要件に合わせてフォーム本文の各種設定を変更できます。
  1. フォームコンテナの背景、枠線、角、配置、フォーム幅、余白、影など、さまざまな項目を変更するための設定があります。
  2. 本文の背景色、不透明度、パターン、本文の枠線と角の幅、スタイル、不透明度、色を変更できます。

項目

項目コンテナ
項目コンテナは、フォーム内の各項目の周囲にある部分です。



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

Field Customization

 

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



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

マトリックス選択
フォームにマトリックス選択項目がある場合は、その質問と回答の色、フォント、スタイル、フォントサイズを設定できます。

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

選択肢スタイル
[選択肢スタイル]オプションでは、選択式項目内のラジオボタンおよびチェックボックス項目に対して、テンプレートのスタイルを選択できます。


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

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

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

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

  Submit Button customizatio


フォームに[保存] と [確認]ボタンもある場合は、それぞれのドロップダウンで、上記と同様の項目を変更できます。
フォームボタンの変更とカスタマイズについては、こちらも参照してください。

サブフォームタブ

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

サブフォームコンテナ  

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

Subform Container

サブフォーム項目  

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

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

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

ページタブ

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

ページのカスタマイズ

  1. ページヘッダーの背景、枠線、角、配置、余白などの設定は、ドロップダウンのPage > Header オプションで行えます。
  2. 件名内のコンテンツのフォント、色、スタイル、サイズを変更する場合は、Page >件名で設定できます。
  3. フォームのページフッターに表示される、閲覧済みページと未閲覧ページの番号や色は、Page > 番号 セクションでカスタマイズできます。

    Page Customization
  1. ナビゲーションボタン(次へ戻る)の背景、枠線、角、フォント、配置、余白、影などは、Navigation > Button セクションでカスタマイズできます。
  2. ページの閲覧状況を示すナビゲーションバーの色の変化や、ページ内でのバーの間隔は、ドロップダウンのNavigation > 棒グラフ オプションでカスタマイズできます。

    Page Navigation Buttons Customization
    また、Navigation > 棒グラフで、フォームの閲覧済みページと未閲覧ページを異なる色で表示することもできます。

    Navigation Status

サンクスページタブ

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

  2. フォームをカスタマイズをクリックします。

  3. フォームのカスタマイズ > サンクスページタブで、サンクスページの初期設定スタイルをカスタムに変更します。

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

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

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

Thank You Page customization

コンテナ:コンテナの背景の色、不透明度、パターン、枠線、角、配置、余白など、さまざまな項目を変更できます。コンテナの枠線と角については、幅、スタイル、不透明度、色を調整できます。
ボタンとアイコン:サンクスページ上のボタンの背景、枠線、角、フォント、余白、影、およびアイコンの枠線をカスタマイズできます。Icon & Textでは、チェックアイコンの色とテキストメッセージの色も変更できます。

Change color of the Tick and Text

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

フォント設定の変更                                  

フォーム内の各セクションにあるテキスト要素について、フォントのスタイル、サイズ、色を変更できます。フォームにおけるフォントの重要性や、フォームに適したフォントの選び方については、こちらを参照してください。

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

影の追加   

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

枠線の追加   

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

配置の変更   

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

フォーム幅の調整   

必要に応じてフォームの幅を調整できます。
フォーム幅を変更するには、Form タブでForm セクションのContainer を選択し、Form Widthを選択します。
  1. 固定幅を設定するには、スタンダードを選択し、フォームの幅をピクセル単位で指定します。指定できる範囲は 320 px 〜 1200 px です。
  2. 画面サイズに合わせてフォーム幅を自動調整するには、Fit to screen を選択します。
フォームのサンクスページをどのようにカスタマイズできるかは、こちらを参照してください。


    Zoho CRM 管理者向けトレーニング

    「導入したばかりで基本操作や設定に不安がある」、「短期間で集中的に運用開始できる状態にしたい」、「運用を開始しているが再度学び直したい」 といった課題を抱えられているユーザーさまに向けた少人数制のオンライントレーニングです。

    日々の営業活動を効率的に管理し、導入効果を高めるための方法を学びましょう。

    Zoho CRM Training



              Zoho Campaigns Resources

                Zoho WorkDrive Resources




                  • Desk Community Learning Series


                  • Digest


                  • Functions


                  • Meetups


                  • Kbase


                  • Resources


                  • Glossary


                  • Desk Marketplace


                  • MVP Corner


                  • Word of the Day


                  • Ask the Experts









                                  • Related Articles

                                  • テーマのカスタマイズ(新テーマビルダー)

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

                                    ペーパーレスのデータ収集ツールであるZoho Formsを使用すると、従来の紙ベースでの煩わしいやりとりに比べてデータ収集の手間を削減し、業務を効率化できます。 Zoho Formsの魅力 Zoho ...

                                  Resources

                                  Videos

                                  Watch comprehensive videos on features and other important topics that will help you master Zoho CRM.



                                  eBooks

                                  Download free eBooks and access a range of topics to get deeper insight on successfully using Zoho CRM.



                                  Webinars

                                  Sign up for our webinars and learn the Zoho CRM basics, from customization to sales force automation and more.



                                  CRM Tips

                                  Make the most of Zoho CRM with these useful tips.